назначить уникальный идентификатор Jgrid Row - PullRequest
Новая
       7

назначить уникальный идентификатор Jgrid Row

0 голосов
/ 24 сентября 2010

Я использую Jgrid.i хочу, когда я добавляю новую строку в таблицу каждый раз, когда она присваивает новый идентификатор этой строке.

Я добавляю строку, используя 

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>

Ответы [ 2 ]

1 голос
/ 24 сентября 2010

Я решил проблему, используя ..

Я считаю все строки в сетке, а затем добавляю 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") ;

};
1 голос
/ 24 сентября 2010

Ваш код кажется мне в основном нормальным.Единственная потенциальная проблема, которую вы можете иметь с идентификаторами, - это возможный конфликт с идентификаторами из /Content/xml/user.xml.Вы должны быть осторожны и не включать целые идентификаторы, теряющие 3, в /Content/xml/user.xml.

Еще несколько замечаний к вашему коду.Лично я считаю нецелесообразным использовать переменную с именем lastsel2 в контексте, который не имеет ничего общего с выбором.Использование переменной с именем i в области действия jQuery(document).ready (так что переменная будет почти глобальной, потому что она будет видна повсюду) не очень приятно.Более поздняя модификация вашего кода может иногда сбрасывать значение 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 Validator покажет вам другие ошибки в вашем коде XHTML, которые могут следовать за этим в другой версии браузера, которую вы использовали для тестирования веб-приложения.некорректная работа:

1) runat в неизвестном атрибуте для элемента <head> в "-//W3C//DTD XHTML 1.0 Transitional//EN".Поэтому вы должны заменить <head runat="server"> на <head>

2) Чтобы не было ошибок проверки XHTML, вы должны поместить код JavaScript внутри блока //<![CDATA[ //]]>: 

<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) Включить <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> в элемент <head>.

6)Включите <tr><td /></tr> внутри <table>, чтобы следовать "-//W3C//DTD XHTML 1.0 Transitional//EN"

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...