asp.net mvc jqgrid 바깥 쪽 버튼을 사용하여 그리드 제출

Question

jqgrid 및 MVC를 처음 사용했습니다. My Jqgrid는 다중 선택 모드에 있으며 그리드 외부의 버튼 (tbrSave)을 클릭하여 그리드의 선택된 모든 항목을 컨트롤러에 제출하려고합니다. {

<button type="submit" id="tbrSave" class="toolbar"> 
    <span title="Config" class="icon-32-save"></span>Save</button> 

<script src="@Url.Content("~/Scripts/grid.locale-en.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.custom.min.js")" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     var lastSelectedRow; 

     $('#jqGridCategoryCreate').jqGrid({ 
      //url from wich data should be requested 
      url: 'CategoriesList', 
      //type of data 
      datatype: 'json', 
      editurl: '@Url.Action("UpdateCategory")', 
      //url access method type 
      mtype: 'POST', 

      //columns names 
      colNames: ['CategoryId', 'Category Name', 'Display Order', 'Is Featured Product'], //columns model 
      colModel: [ 

      { name: 'Id', index: 'Id', align: 'left', editable: false }, 
      { name: 'Name', index: 'Name', align: 'left', editable: false }, 
      { name: 'DisplayOrder', index: 'DisplayOrder', align: 'left', editable: true, edittype: 'text', editoptions: { maxlength: 10 }, editrules: { required: true} }, 
       { name: 'IsFeaturedProduct', index: 'IsFeaturedProduct', align: 'left', editable: true, edittype: 'text', edittype: 'checkbox', editoptions: { maxlength: 10, value: '1:Yes;0:No' }, formatter: 'checkbox', editrules: { required: true}}], 
      //pager for grid 
      pager: $('#jqPagerCategoryCreate'), 
      //number of rows per page 
      rowNum: 10, 
      //initial sorting column 
      sortname: 'Id', 
      //initial sorting direction 
      sortorder: 'asc', 
      //we want to display total records count 
      viewrecords: true, 
      multiselect: true, 
      //grid width 
      width: 'auto', 
      //grid height 
      height: 'auto', 
      ondblClickRow: function (id) { 
       if (id && id != lastSelectedRow) { 
        //save changes in row 
        jQuery('#jqGridCategoryCreate').saveRow(lastSelectedRow); 

        $.lastSelectedRow = id; 
        //trigger inline edit for row 
        $('#jqGridCategoryCreate').editRow(lastSelectedRow, true); 
       } 

      } 
     }); 

     $('#jqGridCategoryCreate').jqGrid('navGrid', '#jqPagerCategoryCreate', 
       { add: false, del: true, edit: false, search: false }, 
       { width: 'auto', url: '/Category/Edit' }, 
       { width: 'auto', url: 'SaveCustomLanguageData' }, 
       { width: 'auto', url: '/Category/Delete' }); 

     function getSelectedRows() { 

      //make sure all items must be in view mode before submitting. 
      jQuery('#jqGridCategoryCreate').saveRow(lastSelectedRow); 

      var rows = $("#jqGridCategoryCreate").jqGrid('getGridParam', 'selarrrow'); 

      var categories = []; 
      $.each(rows, function (index, rowId) { 
       var gridRow = $("#jqGridCategoryCreate").getRowData(rowId); 

       var category = { "Id": rowId, 
        "DisplayOrder": gridRow['DisplayOrder'] 
       }; 
       categories.push(category); 
      }); 

     } 
    }); 
</script> 

}

@using (Html.BeginForm("Save", "Home")) 

는

어떻게 컨트롤러 ("저장")에 게시하기 위해 그리드에 getSelectedRows를 첨부 할 수 있습니다.

감사합니다. 남 Vo.

Answer 1

이 단계

1

) 당신의 면도기보기

<a id="somelink" href="">Select Multiple Accounts</a>

2)

$('#somelink').click(function() { 

var multiplerowdata = jQuery("#grid").getGridParam('selarrrow'); 

$.ajax({ type: 'POST', 
    url: '@Url.Action("YourController", "YourActionMethod")', 
    data: JSON.stringify(multiplerowdata), 
    traditional: true, 
    dataType: "json", 
    contentType: "application/json; charset=utf-8", 
    success: function() { alert("row submited"); } 
});}) 

위에서 만든 앵커 링크에 대한 클릭 이벤트 핸들러를 만들기에 앵커 링크를 만들기를 다음 포함 할

3) 때때로 JSON의 자바 스크립트 오류가 정의되지 않았을 수 있습니다. 공유 \ _layout.csh에 메타 태그를 삽입하여 해결할 수 있습니다. TML 페이지가 아래와 같이

<meta http-equiv="X-UA-Compatible" content="IE=8" /> 

4) YourController 내부 YourActionMethod 다소 매개 변수의 순서에 대한이

[AcceptVerbs(HttpVerbs.Post)] 
    public ActionResult YourActionMethod(List<string> datarow) 
    { 
     //return "sucessfully validated"; 
     return null; 
    }