mvcのモーダルでページ設定を実装する

Question

mvcアプリケーションでは、ユーザーは検索を実行してセッションに結果を保存してから、ページングがうまく動作するWebGridに表示されます。

私のアドバンス検索は、私がモーダルで実装したもので、ページネーションは機能しません。別のページに移動しようとすると、何も表示されません。

これは私が今持っているものです。

コントローラ

ActionResult Index(filter) 

{ 

    //Retrieve data from regular search 

    //Store in a session 

    //return session 

} 

ActionResult GetRegularGrid() 

{ 

    //retrieve regular search session 

    //return same session 

} 

ActionResult AdvanceSearch(filter) 

{ 

    //Retrieve data from advance search 

    //store in a session 

    //return advance search session to partial view 

} 

インデックスビュー

<script>    
       $(function() {      
        GetRegularGrid();     
       }); 

       function GetRegularGrid() { 
        console.log(); 
        $.ajax({ 
         type: 'POST', 
         url: 'SearchController/GetRegularGrid', 
         success: function (response) { 
          $("#DataList").show(); 
          $("#DataList").html(response); 
          $('#ASGrid').hide(); 
         }, 
         cache: false, 
         error: function (error) { 
          console.log(error); 
         } 
        }); 
<a href="#" style="font-weight: bold" class="btn" data-toggle="modal" data-target="#AdvSearch">Advance Search</a> 

<br /> 
      <div class="modal fade" id="AdvSearch"> 
       <div class="modal-dialog"> 
        <div class="modal-content"> 
         <div class="modal-header"> 
          <a href="#" class="close" data-dismiss="modal">&times;</a> 
         <p style="font-weight: bold" class="modal-title">Advance Search</p> 
         </div> 
         <div class="modal-body"> 
          <form id="AdvanceSearchForm"> 
           @Html.Partial("AdvSearchForm") 
          </form> 
         </div> 
        <div class="modal-footer"> 
         <table> 
          <tr> 
            <td><p align="left">% accepts wildcard</p></td> 
           <td width="320px"></td> 
           <td><input type="button" value="Search" class="btn btn-primary" id="ASearchbtn" /></td> 
          </tr> 
         </table> 
        </div> 
       </div> 
      </div> 
     </div> 

     <div id="ASGrid"> 

     </div> 

     <script> 
      $(document).ready(function() { 
       $("#ASearchbtn").click(function() { 

        var form = $('#AdvanceSearchForm'); 
        var ASData = $('#AdvanceSearchForm').serialize(); 
        $.validator.unobtrusive.parse(form); 
        form.validate(); 

        if (form.valid()) { 
         $("#ErrMsg").text(""); 
         $.ajax({ 
          type: "POST", 
          url: "/SearchController/AdvanceSearch", 
          data: ASData, 
          datatype: "html", 
          cache: false, 
          success: function (response) { 
           $("#AdvSearch").modal("hide"); 
           $('#ASGrid').html(''); 
           $('#ASGrid').html(response); 
           $('#ASGrid').show(); 
           $("#DataList").hide(); 
           $('.modal-backdrop').remove(); 
           $('#noresult').hide();          
          }, 
          error: function (error) { 
           $("#ErrMsg").text("Invalid search - Atleast one field is required."); 
           console.log(error); 
          } 
         }); 
        } 

        $(document).ajaxComplete(function() {       
         $('tbody tr').hover(function() { 
          $(this).toggleClass('clickable'); 
         }).on('dblclick', function() { 
          var sid = $(this).find('td:eq(0)').text(); 
          $("#subId").val(sid); 
         }) 

         return false; 
        }); 

        return false; 
       });      
      }); 
     </script> 

Answer 1

私はこの問題を解決するためにGETしてPOSTを変更し、それが今

<script> 
     $(document).ready(function() { 
      $("#ASearchbtn").click(function() { 

       var form = $('#AdvanceSearchForm'); 
       var ASData = $('#AdvanceSearchForm').serialize(); 
       $.validator.unobtrusive.parse(form); 
       form.validate(); 

       if (form.valid()) { 
        $("#ErrMsg").text(""); 
        $.ajax({ 
         type: "GET", 
         url: "/SearchController/AdvanceSearch", 
         data: ASData, 
         datatype: "html", 
         cache: false, 
         success: function (response) { 
          $("#AdvSearch").modal("hide"); 
          $('#ASGrid').html(''); 
          $('#ASGrid').html(response); 
          $('#ASGrid').show(); 
          $("#DataList").hide(); 
          $('.modal-backdrop').remove(); 
          $('#noresult').hide();          
         }, 
         error: function (error) { 
          $("#ErrMsg").text("Invalid search - Atleast one field is required."); 
          console.log(error); 
         } 
        }); 
       } 

       $(document).ajaxComplete(function() {       
        $('tbody tr').hover(function() { 
         $(this).toggleClass('clickable'); 
        }).on('dblclick', function() { 
         var sid = $(this).find('td:eq(0)').text(); 
         $("#subId").val(sid); 
        }) 

        return false; 
       }); 

       return false; 
      });      
     }); 
    </script> 

の作品