Question

我需要从服务器加载JSON，我想让用户点击并编辑该值。

但是当他们编辑时，它不应该调用服务器。我的意思是我不会立即更新。所以我不想要editurl。所以我试过了 'ClientArray'但仍显示Url未设置警告框。但是我需要用户单击添加评论项目按钮时所有已编辑的值此按钮将触发 AddSelectedItemsToSummary（）以保存服务器中的那些

MVC HTML脚本

<div>
<table id="persons-summary-grid"></table>
<input type="hidden" id="hdn-deptsk" value="2"/>
<button id="AddSelectedItems" onclick="AddSelectedItemsToSummary();" />
</div>


$(document).ready(function(){
   showSummaryGrid(); //When the page loads it loads the persons for Dept
});

JSON数据

    {"total":2,"page":1,"records":2,
     "rows":[{"PersonSK":1,"Type":"Contract","Attribute":"Organization
           Activity","Comment":"Good and helping og"},
          {"PersonSK":2,"Type":"Permanant","Attribute":"Team Management",
          "Comment":"Need to improve leadership skill"}
    ]}

jQGRID代码

var localSummaryArray;

function showSummaryGrid(){

 var summaryGrid = $("#persons-summary-grid");

 // doing this because it is not firing second time using .trigger('reloadGrid')
 summaryGrid.jqGrid('GridUnload'); 
 var deptSk = $('#hdn-deptsk').val();
 summaryGrid.jqGrid({
 url: '/dept/GetPersonSummary',
 datatype: "json",
 mtype: "POST",
 postData: { deptSK: deptSk },
 colNames: [
            'SK', 'Type', 'Field Name', 'Comments'],
colModel: [
           { name: 'PersonSK', index: 'PersonSK', hidden: true },
           { name: 'Type', index: 'Type', width: 100 },

           { name: 'Attribute', index: 'Attribute', width: 150 },
           { name: 'Comment', index: 'Comment', editable: true, 
                    edittype: 'textarea',  width: 200 }
         ],

cellEdit: true,
cellsubmit: 'clientArray',
editurl: 'clientArray',
rowNum: 1000,
rowList: [],        
pgbuttons: false,     
pgtext: null,         
viewrecords: false,    
emptyrecords: "No records to view",
gridview: true,
caption: 'dept person Summary',
height: '250',

jsonReader: {
    repeatitems: false

},
loadComplete: function (data) {

        localSummaryArray= data;
        summaryGrid.setGridParam({ datatype: 'local' });
        summaryGrid.setGridParam({ data: localSummaryArray});
    }

});
)

按钮点击功能

function AddSelectedItemsToSummary() {

 //get all the items that has comments 
 //entered using cell edit and save only those.
 // I need to prepare the array of items and send it to MVC controller method
 // Also need to reload summary grid

}

有人可以帮忙吗？ 为什么我得到的网址没有设置错误？

修改

此代码在loadComplete更改后正在运行。在它出现之前没有URL设置警报

Answer 1

我不明白您描述的单元格编辑问题。此外，你写道“当用户点击一行中的+图标时，我需要编辑的值”。 “+”图标在哪里？你的意思是“trash.gif”图标？如果您想使用单元格编辑，在点击行上的图标时如何设想？单击“trash.gif”图标时应该开始编辑哪个单元格？您可以使用“trash.gif”图标ising editCell方法开始编辑其他单元格作为单元格，但我不认为它会让用户感到舒服，因为对于用户的观点，他将开始编辑单击另一个单元格时的一个单元格。我觉得不舒服。可能你想要实现inline editing？

代码中的一个明显错误是在showSummaryGrid内使用RemoveFromSummary。函数RemoveFromSummary 创建 jqGrid，而不仅仅是填充它。因此，应该将其称为仅一次。要刷新网格主体，您应该调用$("#persons-summary-grid").trigger("refreshGrid");。而不是使用postData: { deptSK: deptSk }，你应该使用

postData: { deptSK: function () { return $('#hdn-deptsk').val(); } }

如果触发refreshGrid就足够了，它将从'#hdn-deptsk'向服务器发送当前值。有关详细信息，请参阅the answer。

更新：我无法重现您所描述的问题，但我准备了the demo，它可以满足您的需求（如果我能正确理解您的要求）。您可能需要的代码中最重要的部分将在下面找到

$("#AddSelectedItems").click(function () {
    var savedRow = summaryGrid.jqGrid("getGridParam", "savedRow"),
        $editedRows,
        modifications = [];
    if (savedRow && savedRow.length > 0) {
        // save currently editing row if any exist
        summaryGrid.jqGrid("saveCell", savedRow[0].id, savedRow[0].ic);
    }
    // now we find all rows where cells are edited
    summaryGrid.find("tr.jqgrow:has(td.dirty-cell)").each(function () {
        var id = this.id;
        modifications.push({
            PersonSK: id,
            Comment: $(summaryGrid[0].rows[id].cells[2]).text() // 2 - column name of the column "Comment"
        });
    });
    // here you can send modifications per ajax to the server and call
    // reloadGrid inside of success callback of the ajax call
    // we simulate it by usage alert
    alert(JSON.stringify(modifications));
    summaryGrid.jqGrid("setGridParam", {datatype: "json"}).trigger("reloadGrid");
});

JSON数据中的jQGrid celledit显示URL未设置警报

1 个答案: