分配唯一ID Jgrid行

我正在使用Jgrid.i當我向表中添加新行時，每次將新的id分配給該行時。分配唯一ID Jgrid行

我加入使用

var AddNewRow = function(id){ 
         var datarow = {Consultant:"",Role:"",Task:"",SDate:"",EDate:"", 
             Deliverables:"",Complete:""}; 

         var lastsel2 = i+1; 
         //debugger; 
         var su=jQuery("#test").addRowData(lastsel2, datarow, "last") ; 
//     if (su) { 
//       jQuery('#test').editRow(lastsel2,true); 
//            
//      
//       } 


         };

行和我的完整的代碼是....

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>Untitled Page</title> 
    <!--<script type="text/javascript"> 

    var check=\$retrivexml; 
     alert(check); 
     </script>--> 
    <link href="../../Content/css/Style/style.css" rel="stylesheet" type="text/css" /> 
    <link rel="stylesheet" href="../../Content/css/Style/jquery-ui-1.7.2.custom.css" 
     type="text/css" media="screen" /> 
    <link rel="stylesheet" href="../../Content/css/Style/ui.jqgrid.css" type="text/css" 
     media="screen" /> 
    <!-- <link rel="stylesheet" type="text/css" media="screen" href="../../Content/css/Style/jqModal.css" />--> 
    <!--<link rel="stylesheet" type="text/css" media="screen" href="../../Content/css/Style/datePicker.css" />--> 
    <!--<link href="../../Content/css/Test/jquery-ui.css" rel="stylesheet" type="text/css" />--> 
    <!--<link href="../../Content/css/Test/ui.jqgrid.css" rel="stylesheet" type="text/css" />--> 

    <script src="../../Content/js/Jgrid js/jquery.js" type="text/javascript"></script> 
    <script src="../../Content/js/Jgrid js/grid.locale-en.js" type="text/javascript"></script> 
    <script src="../../Content/js/Jgrid js/jquery.jqGrid.min.js" type="text/javascript"></script> 
    <!--<script src="../../Content/js/Jgrid js/celledit.js" type="text/javascript"></script>--> 
    <script src="../../Content/js/Jgrid js/ui.datepicker.js" type="text/javascript"></script> 
    <script src="../../Content/js/Jgrid js/json2.js" type="text/javascript"></script> 
    <script src="../../Content/js/Jgrid js/JsonXml.js" type="text/javascript"></script> 
    <script src="../../Content/js/Jgrid js/grid.import.js" type="text/javascript"></script> 

    <!--<script type="text/javascript" src="../../Content/js/Jgrid js/grid.base.js"></script> 
    <script type="text/javascript" src="../../Content/js/Jgrid js/grid.formedit.js"></script> --> 

    <script type="text/javascript"> 

    jQuery(document).ready(function() { 

     var i=3; 
    var grid = jQuery("#test"); 
      var MyExportToXml = function (grid) { 
       var dataFromGrid = {row: grid.jqGrid('getGridParam', 'data') }; 
       var xmldata = '<?xml version="1.0" encoding="utf-8" standalone="yes"?>\n<rows>\n' + 
           xmlJsonClass.json2xml (dataFromGrid, '\t') + '</rows>'; 
       alert(xmldata); 
      }; 


    var AddNewRow = function(id){ 
         var datarow = {Consultant:"",Role:"",Task:"",SDate:"",EDate:"", 
             Deliverables:"",Complete:""}; 

         var lastsel2 = i+1; 
         //debugger; 
         var su=jQuery("#test").addRowData(lastsel2, datarow, "last") ; 
//     if (su) { 
//       jQuery('#test').editRow(lastsel2,true); 
//            
//      
//       } 


         }; 

    var lastsel3; 
    jQuery("#test").jqGrid({ 
     url:'/Content/xml/user.xml', 
     //url: $!retrivexml, 
    datatype: "xml", 
     colNames:['Consultant','Project Role', 'Task', 'Start Date','End Date','Deliverables','Complete'], 
     colModel:[ 
     {name:'Consultant',index:'Consultant', width:90, editable: true,edittype:"select",editoptions:{value:"K:Kin;R:Rajesh;R:Renee;S:Sandeep"}}, 
     {name:'Role',index:'Role', width:80, align:"right",editable:true}, 
     {name:'Task',index:'Task', width:80, align:"right",editable:true}, 
     {name:'SDate',index:'SDate', width:90,editable:true}, 
     {name:'EDate',index:'EDate', width:90,editable:true}, 
     {name:'Deliverables',index:'Deliverables', width:200, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"25"}}, 
     {name:'Complete',index:'Complete', width:60, editable: true,edittype:"checkbox",editoptions: {value:"Complete:Incomplete"}} 
     ], 


     rowNum:10, 
     //rowList:[10,20,30], 
     pager: '#pagediv', 
     sortname: 'id', 
     viewrecords: true, 
     sortorder: "desc", 
     caption:"Project Planning", 
    forceFit : false, 
    cellEdit: true, 
    editurl:'clientArray', 
    cellsubmit: 'clientArray', 
    height: "100%", 

    ondblClickRow: function(id, iRow, iCol, e) {alert(iRow);}, 

    afterEditCell: function (id,name,val,iRow,iCol){  

     if(name=='SDate') { 
     jQuery("#"+iRow+"_SDate","#test").datepicker({dateFormat:"yy-mm-dd"}); 

     } 

    if(name=='EDate') { 
     jQuery("#"+iRow+"_EDate","#test").datepicker({dateFormat:"yy-mm-dd"}); 
     } 
    }, 


    }); 
    jQuery("#test").jqGrid('navGrid','#pagediv',{edit:false,add:false,del:false}).navButtonAdd('#pagediv', { caption:"New", buttonicon :'ui-icon-circle-plus', title: "Add New Row", 
     onClickButton: function() { 
      AddNewRow (grid); 
     } 
    }); 


    $("#export").click(function(){ 
       MyExportToXml (grid); 
      }); 


     }); 
    </script> 

</head> 
<body> 
    <form id="form1"> 
     <div align="center"> 
      <div id="pagediv"> 
      </div> 
      <table id="test" align="center"> 
      </table> 
      <input type="BUTTON" id="export" value="Export" /> 
     </div> 
    </form> 
</body> 
</html>

來源

2010-09-24 Shivi

在'jQuery的（文件）.ready'和它的增量範圍有一個計數器對每一行添加將起作用。你的問題是什麼？ – Oleg 2010-09-24 08:01:45

我想要訪問最後一行ID並將1加1並分配給新行。即 - 新行=最後一行ID + 1; – Shivi 2010-09-24 10:16:51

歡迎您！順便說一下，如果你寫一個問題或答案的評論，你應該從@Oleg開始，然後我會看到一個「帖子」給我（參見http://meta.stackexchange.com/questions/43019/how-do -comment-答覆工作）。 – Oleg 2010-09-24 12:54:42

我已經使用解決了這個問題..

我算在網格中的所有行，然後加1計數..

onClickButton: function() { 
    var last = jQuery('#test').jqGrid('getGridParam','records'); 
    AddNewRow (last); 
} 

var AddNewRow = function(id){ 

    var datarow = {Consultant:"",Role:"",Task:"",SDate:"",EDate:"", 
        Deliverables:"",Complete:""}; 

    var lastsel2 = parseInt(id) + 1; 

    var su=jQuery("#test").addRowData(lastsel2, datarow, "last") ; 

};

來源

2010-09-24 11:07:12 Shivi

它可以工作或不工作取決於'/ Content/xml/user.xml'中'id'屬性的值，而不依賴於count表中的行。此外，如果您允許用戶刪除一行，那麼此算法可以遵循雙ID。如果您使用整數作爲ID，您可以獲得關於'getDataIDs'的所有當前ID，請查找最大值，然後使用最大值+ 1作爲新ID。 – Oleg 2010-09-24 11:42:31

我該如何使用getDataIDs屬性？請幫忙。 – Shivi 2010-09-24 11:49:44

好的..謝謝，我明白了...感謝Oleg .. – Shivi 2010-09-24 11:51:50

你的代碼，在我看來，主要是確定。使用ID唯一可能遇到的問題是與/Content/xml/user.xml中的ID可能發生衝突。您應該小心，並且不要在/Content/xml/user.xml中包含整數ID作爲3。

給你一些更多的意見代碼。我發現個人不擅長在上下文中使用名稱爲lastsel2的變量，該變量與選擇無關。在jQuery(document).ready範圍內使用名稱爲i的變量（因此變量幾乎是全局的，因爲它隨處可見）不太好。稍後對代碼進行修改可能偶爾會重置i的值。

此外，我建議您始終使用HTML驗證程序驗證您的HTML代碼，如http://validator.w3.org，並驗證您的JavaScript代碼爲JSLint。

JSLint將幫助你找到你的代碼中的一些問題，如

newDom.loadXML('<?xml version="1.0"?><rows><page>1</page><total>1</total><records>'+ 
       + entries.length + '</records></rows>');

（「+」將被使用了兩次：在一行的末尾和第一個開頭）或未使用的變量像groupingView裏面的gridComplete功能。 JSLint可以幫助您使代碼更健壯。

HTML驗證顯示在您的XHTML代碼其他錯誤，你用於測試Web應用程序可以工作，不正確可能跟隨，在其他瀏覽器版本：未知屬性在"-//W3C//DTD XHTML 1.0 Transitional//EN"

1）runat爲<head>元素。所以，你應該更換<head runat="server">到<head>

2）有//<![CDATA[//]]>塊的內部沒有任何您需要將JavaScript代碼XHTML驗證錯誤：

<script type="text/javascript"> 
//<![CDATA[ 
    /* you can place your code here */ 
//]]> 
</script>

3）更換<input type="BUTTON" ...>到<input type="button" ...>因爲XHTML是區分大小寫的。

4）將強制屬性action=""添加到您的<form>以跟隨"-//W3C//DTD XHTML 1.0 Transitional//EN"。如果您不想使用表單提交，也可以將<form>替換爲<fieldset>。

5）在<head>元素內包含<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />。

6）包括<tr><td /></tr>內的<table>遵循"-//W3C//DTD XHTML 1.0 Transitional//EN"

來源

2010-09-24 10:46:20 Oleg

感謝Oleg對您的寶貴意見..非常感謝您... – Shivi 2010-09-24 11:04:29

分配唯一ID Jgrid行

回答

相關問題