jQ网格问题与编辑表单不发送请求到SQL数据库


jQ Grid problems with edit form does not send request to the SQL database

我是jQ Grid的新用户,我想实现一个编辑表单。我的网格目前链接到一个SQL数据库。SQL数据库的数据正确显示在网格中

当我选择一行并单击编辑按钮时,将出现一个编辑表单,其中包含所选行的数据。当我修改信息并单击提交时,修改显示在网格上,但我的SQL数据库没有更新。如果我刷新页面,网格将显示SQL数据库的信息,并且我可以看到数据库中没有进行修改(显示的数据与最初显示的数据相同)。

有人能帮我一下吗?

这是我的网格代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>
 <link rel="stylesheet" type="text/css" media="screen" href="jquery-ui-1.10.2/themes/base/jquery.ui.all.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.8.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="ui.jqgrid.css" />
<style type="text/css">
html, body {
    margin: 0;
    padding: 0;
    font-size: 75%;
}
</style>
<script src="js/jquery-1.9.0.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.src.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery.extend(jQuery.jgrid.defaults, { autoencode:true });
</script>

<script type="text/javascript">
$(function(){ 
  $("#editgrid").jqGrid({
    url:'example.php',
    datatype: 'xml',
    mtype: 'GET',
    colNames:['Numero','Nature', 'Nom','Qualification','PrixMax','PrixMin'],
    colModel :[ 
      {name:'Numero', index:'Numero', width:55,cellEdit:true, celledittype:'text'}, 
      {name:'Nature',
      index:'Nature',
      editable: true,
      edittype: 'text',
      editoptions: { size: 10},
      editrules: {required: true },
      formoptions: { label: 'Nature' },
      width:90}, 
      {name:'Nom', index:'Nom', width:180, align:'right',editable: true,edittype:'textarea'}, 
      {name:'Qualification', index:'Qualification', width:80, align:'right',editable: true,edittype:'textarea'}, 
      {name:'PrixMax', index:'PrixMax', width:80, align:'right',editable: true,edittype:'textarea'}, 
      {name:'PrixMin', index:'PrixMin', width:150, sortable:false,editable: true,edittype:'textarea'} 
    ],
    pager: '#pager',
    rowNum:10,
    rowList:[10,20,30],
    sortname: 'Numero',
    sortorder: 'desc',
    viewrecords: true,
    emptyrecords: "Nothing to display",
    gridview: true,
    editurl:'edit.php',
    edittype:'text',
    caption: 'My first grid',
    loadonce:true,
});
    $("#bedata").click(function(){
    var gr = jQuery("#editgrid").jqGrid('getGridParam','selrow');
    if( gr != null ) jQuery("#editgrid").jqGrid('editGridRow',gr,{height:280,reloadAfterSubmit:false,edit:true},{editurl:'edit.php',mtype:'POST'});
    else alert("Please Select Row");
});
}); 
</script>
</head>
<body>
<table id="editgrid"><tr><td/></tr></table> 
<div id="pager"></div> 
<input type="BUTTON" id="bedata" value="Edit Selected" />
</body>
</html>

这里是edit。php用来更新数据库

<?php
$dbhost ="localhost";
$dbuser="root";
$dbpassword="";
$database="geoclients";
$db = mysql_connect($dbhost, $dbuser, $dbpassword) or die("Connection Error: " . mysql_error()); 
mysql_select_db($database) or die("Error connecting to db."); 
$tablename="clients";
mysql_set_charset('utf8',$database);
mysql_query("SET NAMES 'utf8'");

    $Num     =  mysql_real_escape_string($_POST['Numero']);
    $Nat   =  mysql_real_escape_string($_POST['Nature']);
    $Nom =  mysql_real_escape_string($_POST['Nom']);
    $Qual    =  mysql_real_escape_string($_POST['Qualification']);
    $PrixMax  =  mysql_real_escape_string($_POST['PrixMax']);
    $PrixMin   =  mysql_real_escape_string($_POST['PrixMin']);
    $sql = "UPDATE ".$tablename." SET Nature = '".$Nat."', Nom = '".$Nom."', Qualification = '".$Qual."', PrixMax = '".$PrixMax."' , PrixMin = '".$PrixMin."' WHERE Numero = ".$Num.";";
    echo $sql;

$result=mysql_query($sql) or die(mysql_error());
mysql_close($db);

?>

到数据库的连接与最初用于填充网格的代码相同(它正在工作),因此我假设该连接代码正在工作。我还检查了请求的SQL语法,似乎还可以。我的SQL数据库托管在本地wamp服务器上。

提前感谢。

我使用jqGrid,但不能说我曾经使用过内置的编辑器,我更喜欢自己处理所有的东西,以便更好地控制它。

看看是否适合你:

$("#bedata").click(function() {
    var grid = $("#editgrid"),
        row  = grid.getGridParam('selrow'),
        data = grid.getRowData(row);
    if (row != null) {
        // Send the ajax request first
        $.ajax({
            url: edit.php,
            data: data,
            type: 'POST',
            success: function(data) {
                console.log(data); // check returned string here
               // here you can put extra code to handle the rows updating
            }
        });
    }
    else alert('Please select row');
});

我终于发现我错了。我的edit.php使用了一个名为"Numero"的变量,因为它是我的数据库中的主键,我需要它来更新右行。但因为它是主键,所以我不希望用户能够编辑它。因此,Numero变量似乎没有与变量的其余部分一起发送,因此更新请求无法成功。

为我愚蠢的错误道歉。感谢每一个帮助过我的人。