分配唯一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行

回答

相关问题