JQGrid保存並繼續窗體編輯

Question

我是新來的使用JQGrid並尋找解決方案，我的問題沒有成功。在添加記錄期間的表單編輯中，我創建了一個名爲「保存並繼續」的額外按鈕。我的意圖是，這個按鈕將保存一個新的記錄到網格中，清除窗體上的字段，並在不關閉窗體的情況下開始插入新窗體。我正在嘗試使用addrowdata並重新加載網格，但並沒有取得任何成功。任何幫助都可以做，或者如果有更好的方法來做到這一點，我願意接受。

$(document).ready(function() { 
    'use strict'; 
    var mydata = [{ 
     id: "1", 
     startdate: "2007-10-01", 
     name: "S008572", 
     total: "210.00" 
    }, { 
     id: "2", 
     startdate: "2007-10-02", 
     name: "O008975", 
     total: "320.00" 
    }, { 
     id: "3", 
     startdate: "2007-09-01", 
     name: "S990653", 
     total: "430.00" 

    }], 
     $grid = $("#list"), 
     initDateEdit = function (elem) { 
      $(elem).datepicker({ 
       dateFormat: 'dd-M-yy', 
       autoSize: true, 
       changeYear: true, 
       changeMonth: true, 
       showButtonPanel: true, 
       showWeek: true 
      }); 
     }, 
     numberTemplate = { 
      formatter: 'number', 
      align: 'right', 
      sorttype: 'number', 
      editrules: { 
       number: true, 
       required: true 
      }, 
      searchoptions: { 
       sopt: ['eq', 'ne', 'lt', 'le', 'gt', 'ge', 'nu', 'nn', 'in', 'ni'] 
      } 
     }; 

    $grid.jqGrid({ 
     datatype: 'local', 
     data: mydata, 
     colNames: ['Client', 'Date', 'Total'], 
     colModel: [{ 
      name: 'name', 
      index: 'name', 
      align: 'center', 
      editable: true, 
      width: 65, 
      editrules: { 
       required: true 
      } 
     }, { 
      name: 'startdate', 
      index: 'startdate', 
      width: 80, 
      align: 'center', 
      sorttype: 'date', 
      formatter: 'date', 
      formatoptions: {newformat: 'd-M-Y'}, 
      editable: true, 
      datefmt: 'd-M-Y', 
      editoptions: { 
       dataInit: initDateEdit 
      } 
     }, { 
      name: 'total', 
      index: 'total', 
      width: 60, 
      template: numberTemplate 
     }], 
     rowNum: 10, 
     rowList: [5, 10, 20], 
     pager: '#pager', 
     gridview: true, 
     rownumbers: true, 
     autoencode: true, 
     ignoreCase: true, 
     sortname: 'startdate', 
     viewrecords: true, 
     sortorder: 'desc', 
     shrinkToFit: false, 
     height: '100%', 
     caption: 'Demonstrate how to implement searching on Enter' 
    }); 
    $.extend($.jgrid.edit, { 
     bSubmit: "Save and Close", 
     bCancel: "Cancel", 
     width: 370, 
     recreateForm: true, 
     beforeShowForm: function() { 
      $('<a href="#">Save and Continue<span class="ui-icon ui-icon-disk"></span></a>') 
       .click(function() { 
       alert("click!"); 
        var id = $.Guid.New(); 
        var newRowData= [{"id":id,"startdate": @startdate,"total":@total}]; 
        $("#list").addRowData(id,newRowData); 
        $("#list").trigger("reloadGrid"); 
      }).addClass("fm-button ui-state-default ui-corner-all fm-button-icon-left") 
       .prependTo("#Act_Buttons>td.EditButton"); 
     } 
    }); 
    $grid.jqGrid('navGrid', '#pager'); 
}); 

Answer 1

您嘗試使用form editing和本地數據（datatype: "local"）。 jqGrid支持當前使用inline editing或cell editing模式編輯本地數據。我建議你使用內聯編輯。例如，您可以使用inlineNav在導航欄中添加備選按鈕，該按鈕允許使用內聯編輯方法添加和編輯行。

如果表單編輯真的比你的要求好得多，那麼我可以轉發你the answer這是修改another answer。答案提供了演示如何執行表單編輯來編輯本地數據的演示。我警告你，演示的代碼並不簡短，也不簡單。儘管如此，它的作品