如何使用jqGrid从/向MySQL DB添加/编辑/删除

时间:2011-12-02 15:48:51

标签: php jquery jqgrid

我是jQuery / jqGrid新手...

我的jqGrid正确选择并显示我的数据。我还有编辑/添加按钮在我的网格上添加/编辑数据。但是,我不确定如何使这些添加/编辑更新MySQL数据库。有什么建议吗?

这是我的scripts.js文件:

 $("#table-maintenance-conflicts").jqGrid(
    { 
        url:'maintenanceConflicts.php', 
        editurl:'maintenanceConflicts-edit.php',
        datatype: 'xml',
        mtype: 'GET',
        colNames:['Conflict Code', 'Description', 'Updated By', 'Updated On'], // Set column names of the grid
        colModel :[ // Set the settings for each individual column of the grid
            {
                name:'conflictCode', 
                index:'conflictCode', 
                width:120, 
                align:'center', 
                editable:false, 
            }, 
            {name:'description', index:'description', width:200, editable:true, edittype:"text"}, 
            {name:'updatedBy', index:'updatedBy', width:120, editable:true, edittype:"text", editrules: {required: true}}, 
            {name:'updatedOn', index:'updatedOn', width:120, editable:false, editrules: {required: true}}
        ], 
        pager: '#pager-maintenance-conflicts', 
        rowNum:10, // To start, the user will see 10 records on the first page
        rowList:[10,15,20], // How many records is the user able to see per page?
        sortname: 'conflictCode',
        sortorder: 'desc', // Order the 'sortname' should be sorted in
        viewrecords: true, // View the records upon grid startup? or wait until a search?
        caption: 'Maintenance | Conflicts' // Title of the grid (at the top)
    }).navGrid('#pager-maintenance-conflicts',{
        edit:true,
        add:true,
        view:true,
        del:true,
        search:true,
        refresh:true
    });

// ADD
$("#add_table-maintenance-conflicts").click(function(){

    jQuery("#table-maintenance-conflicts").jqGrid('editGridRow',"new",{
        mtype: 'POST',
        reloadAfterSubmit:false, 
        closeAfterAdd:true,         
    });

});

// EDIT
$("#edit_table-maintenance-conflicts").click(function(){

    var gr = jQuery("#table-maintenance-conflicts").jqGrid('getGridParam','selrow');
    if( gr != null ) 
        jQuery("#table-maintenance-conflicts").jqGrid('editGridRow',gr,{
            mtype: 'POST',
            reloadAfterSubmit:false, 
            closeAfterEdit:true
        });

});

// DELETE
$("#del_table-maintenance-conflicts").click(function(){

    var gr = jQuery("#table-maintenance-conflicts").jqGrid('getGridParam','selrow');
    if( gr != null ) 
        jQuery("#table-maintenance-conflicts").jqGrid('delGridRow',gr,{
            mtype: 'POST',
            reloadAfterSubmit:false
        });

});

这是我的maintenanceConflicts-edit.php文件:

<?php 

//include the information needed for the connection to MySQL data base server. 
// we store here username, database and password 
$dbhost = "localhost";

$dbuser = "root";

$dbpassword = "";

$database = "ftdbadmin";

// connect to the database
$db = mysql_connect($dbhost, $dbuser, $dbpassword) or die("Connection Error: " . mysql_error());
//echo "Connected to MySQL <br />";

// select the database
mysql_select_db($database) or die("Error conecting to db.");
//echo "Connected to the selected database: ".$database."<br />";

//  If we're ADDING
if($_POST['oper']=='add')
{

}

// If we're EDITING
if($_POST['oper']=='edit')
{
    $conflictCode     =   mysql_real_escape_string($_POST['conflictCode']);
    $description   =   mysql_real_escape_string($_POST['description']);
    $updatedBy =   mysql_real_escape_string($_POST['updatedBy']);
   // $updatedOn    =   mysql_real_escape_string($_GET['updatedOn']);

$SQL = "UPDATE tblconflict SET updatedBy = '".$updatedBy."', description = '".$description."' WHERE conflictCode = ".$conflictCode;

    echo $SQL;
    $result=mysql_query($SQL) or die(mysql_error());

    mysql_close($db);
}

// If we're DELETING
if($_POST['oper']=='del')
{

}

?>

非常感谢任何帮助!!

1 个答案:

答案 0 :(得分:-2)

几个月前,我通过在Wiki,Google和这个网站上搜索来解决这个问题。我偶然发现了这个用于jQGrid的PHP CRUD模板。通过一些调整,我得到它与我的所有网格一起工作。一旦你开始更多地使用它,你会发现有很大的改进和扩展空间。它应该让你开始朝着正确的方向前进。