jqgrid提交按钮不起作用

Question

这可能是很明显的事情，但我无法在我的 jqgrid 中获得 post 更改的提交按钮。我尝试将 table 放在一个表单字段中，认为这会有所帮助。取消按钮有效。任何想法表示赞赏。

<!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

我认为问题出在您的 HTML 上，它应该看起来像这样

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

Answer 2

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

这是 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"}
    );

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

jqgrid提交按钮不起作用

jqgrid submit button not working

jquery

coldfusion

jqgrid