web-dev-qa-db-ja.com

ASP.NET MVC C#でJqueryを使用して部分ビューを更新する

Jqueryと共にMVC C#を使用しています。

いくつかのタブがあるかなり大きなページに部分的なビューがあります。

チェックボックスをクリックすると、フォーム内の部分ビューが更新されます。代わりに私が得ているのは、部分的なビューです

これがJqueryの私のコードです:

   $('#activelist,#inactivelist').change(function () {

        var status = 'inactive';
        window.location.href = '@Url.Action("Skits","KitSection")' + '?id=' + id+ '&status=' + status;

    });

フォーム内の部分ビューをどのように更新するかについて、どのように呼び出しを行うかについてのアイデアはありますか?

これがPartialViewのコードです

     return PartialView(Kits);

前述のように、表示されるのはフォーム全体ではなく、部分的なビューのみです。

13
Nate Pet

window.location.hrefはページ全体を再読み込みします。完全に再読み込みせずに、ページの一部を再読み込みする必要があります。これにはjQuery ajaxを使用できます。 Partialviewを取得するために使用できるjQueryセレクターを見つけましょう。

たとえば、HTMLマークアップがメインフォーム(ビュー)で次のようになっているとします。

<div>
  <p>Some content</p>
  <div id="myPartialViewContainer">
      @Html.Partial("_FeaturedProduct")
  </div>
  <div>Some other content</div>
</div>

そして、ここでDIV with IDmyPartialViewContainerは、partial viewのコンテンツを保持するコンテナーdivです。したがって、jQueryを使用してそのdivのコンテンツを再ロードします。 load メソッド

$(function(){

   $('#activelist,#inactivelist').change(function () {
      var id="someval"; 
      var status = 'inactive';
      $("#myPartialViewContainer").load('@Url.Action("Skits","KitSection")' + '?id=' + id+ '&status=' + status)
  });

});
29
Shyju

Window.location.hrefプロパティを介してユーザーをパーシャルのURLにリダイレクトするため、そのパーシャルのみが表示されます。

代わりにAJAXを呼び出してHTMLを取得し、.appendメソッドなどを使用して、追加するコンテナ要素に追加する必要があります。

編集:.load()jQuery ajaxメソッドは、実際にはこの特定の状況に適しています。

3
jamesmillerio