JSON数据中的jQGrid celledit显示URL未设置警报 [英] jQGrid celledit in JSON data shows URL Not set alert

问题描述

我需要从服务器加载JSON，并且希望使用户能够单击和编辑值.

I need to load a JSON from server and i want to enable a user to click and edit the value.

但是当他们编辑时，它不应调用服务器.我的意思是我不会立即更新.所以我不要editurl.所以我尝试了 'ClientArray'但它仍然显示未设置Url警报框.但是我需要 用户单击添加评论的项目"按钮时，所有已编辑的值都会触发 AddSelectedItemsToSummary()，以将其保存在服务器中

But when they edit, it should not call server. i mean i am not going to update immediately. So i dont want editurl. So i tried 'ClientArray' But still it shows Url is not set alert box. But i need all the edited values when the user click Add Commented Items button this button will fire AddSelectedItemsToSummary() to save those in server

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

}

有人可以帮上忙吗? 为什么我没有设置该URL错误?

Could any one help on this? why i am getting that URL is not set error?

该代码在loadComplete更改后起作用.在显示之前 没有URL设置警报

This code is working after loadComplete changes. Before it was showing No URL Set alert

推荐答案

我不了解您所描述的单元格编辑问题.此外，您写了当用户连续单击+图标时我需要编辑的值". "+"图标在哪里?您是说"trash.gif"图标吗?如果您想使用单元格编辑，那么在单击该行上的图标时您会怎么想?单击"trash.gif"图标应开始编辑哪个单元格?您可以使用"trash.gif"图标以内联编辑?

I don't understand the problem with cell editing which you describe. Moreover you wrote "i need the edited value when the user click + icon in a row". Where is the "+" icon? Do you mean "trash.gif" icon? If you want to use cell editing, how you imagine it in case of clicking on the icon on the row? Which cell should start be editing on clicking "trash.gif" icon? You can start editing some other cell as the cell with "trash.gif" icon ising editCell method, but I don't think that it would be comfortable for the user because for the users point of view he will start editing of one cell on clicking of another cell. It seems me uncomfortable. Probably you want implement inline editing?

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

One clear error in your code is usage of showSummaryGrid inside of RemoveFromSummary. The function RemoveFromSummary create jqGrid and not just fill it. So one should call it only once. To refresh the body of the grid you should call $("#persons-summary-grid").trigger("refreshGrid"); instead. Instead of usage postData: { deptSK: deptSk } you should use

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

如果触发refreshGrid就足够了，它将把'#hdn-deptsk'中的 current 值发送到服务器.有关更多信息，请参见答案.

In the case triggering of refreshGrid would be enough and it will send to the server the current value from the '#hdn-deptsk'. See the answer for more information.

更新:我无法重现您描述的问题，但是我准备了

UPDATED: I couldn't reproduce the problem which you described, but I prepared the demo which do what you need (if I understand your requirements correctly). The most important part of the code which you probably need you will find below

$("#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未设置警报的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！