jqGrid提交到数据库后如何删除多个选定的行? [英] jqGrid How to Delete Multiple Selected rows after submitting to a Database?
问题描述
我有这个解决方案，可以将多个行数据提交到新数据库中.但是我想在此动作脚本的末尾追加以删除选定的行.提交数据后如何在末尾正确添加此功能?我添加了一个脚本，但是它什么也没做.
I have this solution that submits multiple row data to a new database. But I want to append to the end of this action script to delete the selected rows. How to properly add this function at the end after data has been submitted? I added a script but it does nothing.
按钮的旧代码:
jQuery("#minibutton").click( function(){
var selectedrows = $("#list").jqGrid('getGridParam','selarrrow');
if(selectedrows.length) {
for(var i=0;i<selectedrows.length; i++) {
var selecteddatais = $("#list").jqGrid('getRowData',selectedrows[i]);
var rows=JSON.stringify(selecteddatais)
var postArray = {json:rows};
$.ajax({
type: "POST",
url: "jsonsend.php",
data: postArray,
dataType: "json",
success: function () { jQuery("#list").jqGrid('delGridRow', id, options );
} }); } } });
});
我目前正在尝试的解决方案
My current try at solution
$(function(){
$("#list").jqGrid({
url:'request.php',
editurl: 'jqGridCrud.php',
datatype: 'xml',
mtype: 'GET',
multiselect:true,
multiboxonly:true,
height: 450,
width: 850,
colNames:['id','Project', 'Assigned To','Assign Date','Check Date','Due Date','Attachments'],
colModel :[
{name:'id', index:'id', width:25},
{name:'name', index:'name', width:250, align:'left',editable:true, editoptions:{
size:60} },
{name:'id_continent', index:'id_continent', width:55, align:'right',editable:true,edittype:'select',
editoptions:{value: "Henry:Henry; Ramon:Ramon; Paul:Paul" },mtype:'POST' },
{name:'lastvisit', index:'lastvisit', width:70, align:'right',formatter: 'date',srcformat:'yyyy-mm-dd',newformat: 'm-d-Y',editable:true, edittype: 'text',mtype:'POST' ,editoptions:{size:10, dataInit:function(elem){$(elem).datepicker({dateFormat:'m/d/yy'});}}} ,
{name:'cdate', index:'cdate', width:70, align:'right',formatter: 'date',srcformat:'yyyy-mm-dd',newformat: 'm-d-Y', edittype: 'text',editable:true ,mtype:'POST' ,editoptions:{size:10, dataInit:function(elem){$(elem).datepicker({dateFormat:'m/d/yy'});}}} ,
{name:'ddate', index:'ddate', width:70, align:'right',formatter: 'date',srcformat:'yyyy-mm-dd',newformat: 'm-d-Y',date:'true',editable:true, edittype: 'text',editoptions:{size:10, dataInit:function(elem){$(elem).datepicker({dateFormat:'m/d/yy'});}}} ,
{name:'email', index:'email', width:70,align:'center',sortable:false,mtype:'POST' }
],
pager: '#pager',
rowNum:20,
rowList:[20,40,80],
sortname: 'id',
sortorder: 'desc',
viewrecords: true,
gridview: true,
caption: 'Pending Assignments',
ondblClickRow: function(rowid) {
$(this).jqGrid('editGridRow', rowid,
{width:450,Height:400,recreateForm:true,closeAfterEdit:true,
closeOnEscape:true,reloadAfterSubmit:false, modal:true,mtype:'post'});}
});
$("#list").jqGrid("navGrid", { add: false, search: false }, {}, {}, {
url: "jsonsend.php",
onclickSubmit: function (options, ids) {
var $self = $(this), selectedrows = ids.split(","), selectedData = [], i,
l = selectedrows.length;
for (i = 0; i < l; i++) {
// fill array selectedData with the data from selected rows
selectedData.push($self.jqGrid("getRowData", selectedrows[i]));
}
// the returned data will be combined with the default data
// posted by delGridRow
return {
gridData: JSON.stringify(selectedData)
}
}
});
});
jsonsend.PHP:
jsonsend.PHP:
<?
$database = "newhistoricform";
$dbpassword = "pretty";
$dbhost = "localhost";
$dbuser = "root";
// connect to the MySQL database server
$con = mysql_connect($dbhost, $dbuser, $dbpassword);
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
@mysql_select_db($database,$con) or die("Error connecting to db.");
//First decode the array
$arr = $_POST["json"];
$decarr = json_decode($arr, true);
$count = count($decarr);
for ($x=0; $x < $count; $x++){
$newrec = $decarr;
$id = $newrec['id'];
$name = $newrec['name'];
$id_continent = $newrec['id_continent'];
$email = $newrec['email'];
$lastvisit = $newrec['lastvisit'];
$cdate = $newrec['cdate'];
$ddate = $newrec['ddate'];
}
// Create insert array
$values[] = "('".$id."', '".$name."', '".$id_continent."', '".$lastvisit."','".$cdate."','".$ddate."','".$email."' )";
// Insert the records
$sql = "INSERT INTO finish (id, name, id_continent, lastvisit,cdate,ddate, email)
VALUES ".implode(',', $values);
$result = mysql_query($sql, $con) or die(mysql_error());
?>
推荐答案
对不起，但我无法完全关注您.首先，使用服务器返回的数据(url:'request.php')填充网格.数据可能来自数据库.数据项的id也被填充.如果正确填充了网格，则每行(行ID)的id属性包含和id列的内容将是数据库中的ID.
Sorry, but I can't full follow you. First of all you fill grid with the data returned from the server (from url:'request.php'). The data are probably from the database. The id of the dataitems are filled too. If you correctly fill the grid then the contain of id attribute of every row (the rowid) and the content of id column will be the ids from the database.
要删除数据库中的数据，您只需要具有需要删除的行ID.取而代之的是，将所有数据从选定的行发送到服务器.你为什么这么做?服务器已经有所有数据了?唯一的解释是您需要用于并发控制的信息.好的，让我们发送确实需要的信息.
To delete data in the database you need just have ids of rows which need be deleted. Instead of that you send all data from selected rows to the server. Why you do this? The server have already all the data? The only explanation would be that you need the information for concurrency control. OK, let us that the information is really needed be sent.
现有代码中的主要问题在我看来似乎是逻辑错误:您将获得所有选定行的第一个 ids .然后，您对每个ID进行单独的Ajax调用.在呼叫的success回调内部(在服务器端成功删除一个行之后)，您将获得所有选定的行，并从网格中删除所有选定的行.因为success将被异步调用，所以您可以在将数据发送到服务器之前，从 网格中删除一些行.
The main problem in your existing code seems to me the error in the logic: You get first ids of all selected rows. Then you make separate Ajax call for every id. Inside of success callback of the call (after one row was successfully deleted on the server side) you get all selected rows and remove all selected rows from grid. Because success will be called asynchronously you can remove some rows from the grid before you send the data to the server.
此外，您已经使用 editGridRow 方法进行编辑行.存在 delGridRow 方法，该方法发送选定列表标识服务器的ID(默认URL为editurl: "sendyo.php")，并在成功确认后从服务器端删除行.您可以使用delData参数(请参见文档 )，将所有其他信息发送到ID列表.以最简单的形式，代码($("#minibutton").click句柄的句柄)可能像
Moreover you use already editGridRow method for editing of the rows. There are exist delGridRow method which send the list of selected ids to the server (default URL is editurl: "sendyo.php") and delete the rows after successful conformation from the server side. You can use delData parameter (see the documentation) to send any additional information to the list of ids. In the simplest form the code (the handle of $("#minibutton").click handle) could be like
$("#list").jqGrid("delGridRow", $("#list").jqGrid("getGridParam", "selarrrow"));
或者，如果您需要发送所有选定行的全部内容，则类似
or, if you need send full content of all selected rows, then something like
var $grid = $("#list"),
selectedrows = $grid.jqGrid("getGridParam", "selarrrow"),
i,
selectedData = [];
if (selectedrows.length) {
for (i = 0; i < selectedrows.length; i++) {
// fill array selectedData with the data from selected rows
selectedData.push($grid.jqGrid("getRowData", selectedrows[i]));
}
$grid.jqGrid("delGridRow", $grid.jqGrid("getGridParam", "selarrrow"), {
delData: {
gridData: JSON.stringify(selectedData)
}
});
}
上面的代码会将 tree 参数发送到服务器:oper的值是"del"，id的值是逗号分隔的选定(已删除)行标识符列表，而gridData的值是以JSON格式序列化的已删除行的内容数组.
The above code will send tree parameter to the server: oper with the value "del", id with comma separated list of selected (deleted) rowids and gridData with the array of content of deleted rows serialized in JSON format.
当前使用#minibutton按钮.如果改用navGrid，则可以简化代码.您可以使用删除"按钮为您调用delGridRow.您可以使用onclickSubmit回调来扩展发布的数据.例如，如果您不需要导航器栏中的添加"和搜索"按钮，则可以使用以下代码关于
You use #minibutton button currently. If you would use navGrid instead then you can simplify your code. You can use Delete button which calls delGridRow for you. You can use onclickSubmit callback to extend the posted data. If you don't need for example Add and Search buttons in the navigator bar you can use the code about as the following
$("#list").jqGrid("navGrid", "#pager", { add: false, search: false }, {}, {}, {
url: "jsonsend.php",
onclickSubmit: function (options, ids) {
var $self = $(this), selectedrows = ids.split(","), selectedData = [], i,
l = selectedrows.length;
for (i = 0; i < l; i++) {
// fill array selectedData with the data from selected rows
selectedData.push($self.jqGrid("getRowData", selectedrows[i]));
}
// the returned data will be combined with the default data
// posted by delGridRow
return {
gridData: JSON.stringify(selectedData)
}
}
});
这篇关于jqGrid提交到数据库后如何删除多个选定的行?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
