title: asp.net mvc jqgrid submit grid using a button outside of the grid
body: <p>I'm new to jqgrid and MVC. My Jqgrid is in multi select mode, and I want to submit all selected items on the grid to the controller by clicking on a button (tbrSave) outside of the grid.</p>
  
  <pre><code>@using (Html.BeginForm("Save", "Home"))
  </code></pre>
  
  <p>{
      
      
      
      </p>
  
  <pre><code>&lt;button type="submit" id="tbrSave" class="toolbar"&gt;
      &lt;span title="Config" class="icon-32-save"&gt;&lt;/span&gt;Save&lt;/button&gt;
  
  &lt;script src="@Url.Content("~/Scripts/grid.locale-en.js")" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.custom.min.js")" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      $(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 &amp;&amp; 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);
              });
  
          }
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>}</p>
  
  <p>How can I attach getSelectedRows to the grid in order to post it to Controller ("Save"). </p>
  
  <p>Thanks a mil.
  Nam Vo.</p>