JQGRID保存新行

时间:2013-05-05 19:36:01

标签: jquery jqgrid-inlinenav

我之前已经多次使用过jqgrid而没有太多问题,除了这次我碰到了一堵砖墙。

我正在构建一个网站,要求用户通过管理员前端访问产品数据库表,这是JQGRID的用武之地。此表有许多列,例如有一个模态框弹出添加新行是不切实际的(模态框比窗口高)。

因此我使用内联方法来编辑,添加和删除行,除了保存新记录之外,这种方法很有效。单击添加行按钮,在表的顶部创建一个新行,我可以随意填充该行,但是当我单击保存行时,没有任何反应!

如果我突出显示一行并编辑某些内容然后单击“保存行”,它将使用所有参数触发对服务器端脚本所需的ajax调用,并修改该行。因此,我知道按钮确实有效,而不是简单地没有启用按钮。突出显示一行并单击删除也可以。

让我感到困惑的是,在添加新行时点击保存行什么都不做,(好吧它不会尝试触发ajax请求 - 使用Firebug监控),也不会出现任何错误。我正在使用最新版本的JQGRID

这是我的代码。

        <div style='overflow: auto;'>
                <table id='list3'></table>
                <div id='pager3'></div>
        </div>


        <script>

                jQuery('#list3').jqGrid({
                        url:'/accent/index.php?id=39',
                        datatype: 'json',
                        colNames:['ID','Brand', 'Item Code', 'S. Desc','L. Desc','Range',
                                'Colour/Finish','Category','Fitment','No of Bulbs','Type of Lamp','Light Socket','Max W',
                                'Max LE Lamp','IP','Width','Length','Height','Min Drop','Max Drop',
                                'Projection','Weight','Shade Code','RRP','Price','Clearance','Featured'
                                ],
                        colModel:[
                                {name:'id',index:'id', width:40,align:'center',editable:true},
                                {name:'brand',index:'brand', width:70,align:'center',editable:true},
                                {name:'itemCode',index:'itemCode', width:75,align:'center',editable:true},
                                {name:'shortDesc',index:'shortDesc', width:100,editable:true},
                                {name:'longDesc',index:'longDesc', width:200,editable:true},
                                {name:'range',index:'range', width:100,align:'center',editable:true},
                                {name:'colourFinish1',index:'colourFinish1',width:100,align:'center',editable:true},
                                {name:'groupOfLights',index:'groupOfLights',width:100,align:'center',editable:true},
                                {name:'typeOfFitting',index:'typeOfFitting',width:100,align:'center',editable:true},
                                {name:'noOfLamp1',index:'noOfLamp1',width:80,align:'center',editable:true},
                                {name:'typeOfLamp1',index:'typeOfLamp1',width:80,align:'center',editable:true},
                                {name:'lightSocketLamp1',index:'lightSocketLamp1',width:50,align:'center',editable:true},
                                {name:'maxWattageLamp1',index:'maxWattagelamp1',width:50,align:'center',editable:true},
                                {name:'maxLowEnergyLamp',index:'maxLowEnergyLamp',width:50,align:'center',editable:true},
                                {name:'ipRating',index:'ipRating',width:50,align:'center',editable:true},
                                {name:'width',index:'width',width:50,align:'right',editable:true},
                                {name:'length',index:'length',width:50,align:'right',editable:true},
                                {name:'height',index:'height',width:50,align:'right',editable:true},
                                {name:'minimumDrop',index:'minimumDrop',width:60,align:'right',editable:true},
                                {name:'maximumDrop',index:'maximumDrop',width:60,align:'right',editable:true},
                                {name:'projection',index:'projection',width:100,align:'right',editable:true},
                                {name:'weight',index:'weight',width:50,align:'right',editable:true},
                                {name:'shadeCode1',index:'shadeCode1',width:50,align:'right',editable:true},
                                {name:'rrp',index:'rrp',width:50,align:'right',editable:true},
                                {name:'price',index:'price',width:50,align:'right',editable:true},
                                {name:'clearance',index:'clearance',width:50,align:'center',editable:true},
                                {name:'featured',index:'featured',width:50,align:'center',editable:true}
                        ],
                        rowNum:25,
                        rowList:[25,50,100],
                        pager: '#pager3',
                        sortname: 'id',
                        viewrecords: true,
                        sortorder: 'desc',
                        caption:'Edit Products',
                        height: '500px',
                        editurl:'/accent/core/components/productsdatabase/editJSON.php?&u=admin
                });

                jQuery('#list3').jqGrid('navGrid','#pager3',{edit:false,add:false,del:true});
                jQuery('#list3').jqGrid('inlineNav','#pager3',{edit:true,add:true,del:false});
        </script>

1 个答案:

答案 0 :(得分:0)

此问题现已确定,并且是jqgrid的内联编辑功能的已知错误。

有关所有详细信息,请参阅此Stackoverflow帖子:StackOverflow