Question

这可能是显而易见的，但我无法通过“提交”按钮在我的jqgrid中发布更改。我试着将表格放在一个表格字段中，这会有所帮助。 “取消”按钮有效。任何想法都表示赞赏。

<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/cupertino/jquery-ui.css" type="text/css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/css/ui.jqgrid.css" type="text/css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/i18n/grid.locale-en.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/jquery.jqGrid.min.js"></script>

</head>
<body>
<script type="text/javascript">
$("document").ready(function() {

    jQuery("#editgrid").jqGrid({
        url:'cfc/jqgrid.cfc?method=jsonContacts&returnformat=json&queryformat=struct',
        width:"auto",
        height:"auto",
        datatype: "json",
        colNames:['contactID','lastname', 'Email'],
        colModel:[
            {name:'contactid',index:'contactid', width:55, search: true},
            {name:'lastname',index:'lastname', width:100, search: true, editable:true},
            {name:'email',index:'email', width:250, search: true, editable:true}
        ],
jsonReader : {repeatitems: false, id: "{id}}"},         
 rowNum:10,rownumbers:true,
rowList:[10,20,30],
sortname: 'contactid',
viewrecords: true,
recordtext: "Record {0} - {1} of {2}",//Pager information to show
sortorder: "desc",
editurl:"cfc/jqgrid.cfc?method=editContact&returnformat=json&queryformat=struct", //The Add/Edit function call 
caption:"Contact List",
pager: '#pager'
        });

jQuery("#editgrid").jqGrid('navGrid', '#pager', {edit: false, add: false, del: false, search: false});

jQuery("#editgrid").jqGrid('filterToolbar',{searchOnEnter:false});

jQuery("#editgrid").jqGrid('inlineNav', '#pager', 
    {   edit: true, 
        editicon: "ui-icon-pencil", 
        add: true, 
        addicon: "ui-icon-plus", 
        save:true, 
        saveicon: "ui-icon-disk", 
        cancel: true, 
        cancelicon: "ui-icon-cancel"}
        );

     });

</script>

<form method="post">
<table id="editgrid"></table>
<div id="pager"></div><br>
<input type="BUTTON" id="editgrid" value="Edit Selected" />
</form>

</body>
</html>

Answer 1

感谢您的帮助。我没有意识到我有回应。我不确定如何收到电子邮件通知。

这是jquery的版本。一旦我将其改为1.11.2，它就有效了。

<head>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/cupertino/jquery-ui.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.8.0/js/i18n/grid.locale-en.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.8.0/js/jquery.jqgrid.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
</head>

我也删除了：

jQuery("#editgrid").jqGrid('inlineNav', '#pager', 
{   edit: true, 
    editicon: "ui-icon-pencil", 
    add: true, 
    addicon: "ui-icon-plus", 
    save:true, 
    saveicon: "ui-icon-disk", 
    cancel: true, 
    cancelicon: "ui-icon-cancel"}
    );

现在发生的一件事是只有一些列填充了数据。我不确定为什么有些人做，有些人不做。编辑功能将修改数据库中的所有行/列，但即使它位于数据库中，也不会显示某些数据。有些列会使用更新的数据正确显示和刷新。

Answer 2

我认为问题出在你的HTML中，它看起来应该是这样的

<form method="post">
<table id="editgrid"></table>
<div id="pager"></div><br>
<input type="submit" id="bedata" value="Edit Selected" />
</form>

jqgrid提交按钮不起作用

2 个答案: