1

_tab1、_tab2、_tab3、_tab4 のような 4 つの部分ビューを持つ Index というビューがあり、各部分ビューには送信ボタンとキャンセル ボタンを含むフォーム フィールドがあり、_tab4 キャンセル ボタンをクリックすると、同じ _tab4 部分ビューをフォーム データでリロードしたいクリアしました。

   <ul class="tab">
    <li class="active" id="tab1">tab1</li>
    <li class="" id="tab2">tab2</li>
    <li class="" id="tab3">tab3</li>
    <li class="" id="tab4">tab4</li>
</ul>


    <div class="tabbody" style="display: block; ">
        <% Html.RenderPartial("_tab1");  %>         
    </div>
    <div class="tabbody"style="display: block; ">

     <% Html.RenderPartial("_tab2");  %>            
    </div>
    <div class="tabbody"style="display: block; ">

        <% Html.RenderPartial("_tab3");  %>         
    </div>
    <div class="tabbody" style="display: block; ">

        <% Html.RenderPartial("_tab4");  %>         
    </div>

各部分ビューには送信ボタンとキャンセル ボタンがあります

4

2 に答える 2

1

各 div を一意の ID でマークします。

<div id="tab1-content" class="tabbody" style="display: block; ">
        <% Html.RenderPartial("_tab1");  %>         
</div>

キャンセル ボタン クリック関数でいくつかの jQuery コードを実行します。

$("cancelTab1buttonselector").click(function() {

   $.get("@Html.Action("Tab1")", function(data) {

      $("#tab1-content").html(data);
   });
});

「cancelTab1buttonselector」は、タブ 1 のキャンセル ボタンのセレクターです。各タブで同じことを行います。各タブのコンテンツを PartialViewResult として返すコントローラーのアクションを作成する必要があります。

public ActionResult Tab1() 
{
     var model = ...get model...
     return PartialView("_tab1", model);
}
于 2013-07-24T08:36:47.620 に答える
1

データチェック属性を使用して、urパーシャルをラッパーにロードしてみてください

html:

 <ul class="tab">
    <li class="active tab" id="tab1" data-tabid="tab1">tab1</li>
    <li class="tab" id="tab2" data-tabid="tab2">tab2</li>
    <li class="tab" id="tab3" data-tabid="tab3">tab3</li>
    <li class="tab" id="tab4" data-tabid="tab4">tab4</li>
</ul>

<div class="tabbody" style="display: block; ">
        <% Html.RenderPartial("_tab1");  %>         
    </div>

jquery:

$(document).on('click','.tab',function(){
var tabId = $(this).data('tabid');
 if(tabId=='tab1'){
    $('.tabbody').empty().load('/Controller/_tab1');
}
if(tabId=='tab2'){
    $('.tabbody').empty().load('/Controller/_tab2');
}
if(tabId=='tab3'){
    $('.tabbody').empty().load('/Controller/_tab3');
}
if(tabId=='tab4'){
    $('.tabbody').empty().load('/Controller/_tab4');
}
});
于 2013-07-24T07:20:17.690 に答える