Print Page - Datagrid getChecked data to Array, Post to PHP and Parse [Solved]

Title: Datagrid getChecked data to Array, Post to PHP and Parse [Solved]
Post by: xnoybx on September 19, 2015, 02:31:16 AM

Hello All,
I have a problem with datagrid (not edatagrid) inline row editing, i try to modification easyui datagrid tutorial
http://www.jeasyui.com/tutorial/datagrid/datagrid3.php (http://www.jeasyui.com/tutorial/datagrid/datagrid3.php)

My question is:
1. how can i get all checked row to array including numberbox, textbox and combobox value ?
2. post them to PHP ?
3. Parse the array ini PHP, so i can insert them to Database.

Please Help Me,
Thanks.

HTML

Code:

<table id="dg" class="easyui-datagrid" style="width:600px;height:250px"
			url="data/datagrid_data.json"
			title="Load Data" iconCls="icon-save" fitColumns="true"
			idField="itemid">
		<thead>
			<tr>
				<th field="ck" width="80" checkbox="true">Item ID</th>
				<th field="itemid" width="80">Item ID</th>
				<th field="productid" width="80">Product ID</th>
				<th field="listprice" width="80" align="right">List Price</th>
				<th field="unitcost" width="80" align="right" data-options="editor:'numberbox'">Unit Cost</th>
				<th field="attr1" width="150" data-options="editor:'textbox'">Attribute</th>
				<th field="statusName", data-options="align: 'center', 
						editor:{
							type:'combobox',
							options:{
								valueField:'statusId',
								textField:'statusName',
								panelHeight:'auto',
								data: [{
									statusId: '',
									statusName: '- Choose -'
								},{
									statusId: 'true',
									statusName: 'Active'
								},{
									statusId: 'false',
									statusName: 'Non Active'
								}]
							}
						}
				
				" width="80"><b>Status</b></th>
			</tr>
		</thead>
	</table>

Javascript

Code:

<script>
		function save() {
			var ids = [];
			var rows = $('#dg').datagrid('getSelections');
			for(var i=0; i<rows.length; i++){
				ids.push(rows[i].itemid);
			}
			alert(ids.join('\n'));
		}
		
		
		$(document).ready(function () {
		var lastIndex;
			$('#dg').datagrid({
				onLoadSuccess: function(data) {
					$('#dg').datagrid('getPanel').find('div.datagrid-header input[type=checkbox]').attr('disabled','disabled');
				},
				onCheck: function(index,row){
					if(lastIndex != index) {
						$(this).datagrid('beginEdit', index);
					}
				},
				onUncheck: function(index,row){
					if(lastIndex != index) {
						$(this).datagrid('endEdit', index);
					}
				},
				
			});
		});
	</script>

Title: Re: Datagrid getChecked data to Array, Post to PHP and Parse
Post by: stworthy on September 19, 2015, 07:31:08 PM

Please try the code below to get all the checked editing row.

Code:

var rows = [];
var dg = $('#dg');
$.map(dg.datagrid('getChecked'), function(row){
  var index = dg.datagrid('getRowIndex', row);
  var editors = dg.datagrid('getEditors', index);
  if (editors.length){
    rows.push({
      itemid:row.itemid,
      unitcost:$(editors[0].target).numberbox('getValue'),
      attr1:$(editors[1].target).textbox('getValue'),
      statusName:$(editors[2].target).combobox('getValue')
    });
  }
});
console.log(rows)

You can stringify it and post to your server.

Title: Re: Datagrid getChecked data to Array, Post to PHP and Parse
Post by: xnoybx on September 22, 2015, 06:36:15 AM

Thank for reply stworthy. Its Works.

And this i give the code

Javascript

Code:

function save() {		
	var rows = [];
	var dg = $('#dg');
	$.map(dg.datagrid('getChecked'), function(row){
		var index = dg.datagrid('getRowIndex', row);
		var editors = dg.datagrid('getEditors', index);
		if (editors.length){
			rows.push({
				itemid: row.itemid,
				unitcost: $(editors[0].target).numberbox('getValue'),
				attr1: $(editors[1].target).textbox('getValue'),
				statusName: $(editors[2].target).combobox('getValue')
			});
		}
	});
	$.ajax({
		url:'./data.php',
		type: 'POST',
		data: {data: JSON.stringify(rows)},
		cache: false
	});
}

PHP (data.php)

Code:

$conn = mysqli_connect($host, $user, $pass, $db);
$data = json_decode($_POST['data'], true);
mysqli_query($conn, "DELETE * FROM tbl_test");
foreach($data as $dt) {
	mysqli_query($conn, "INSERT INTO tbl_test (itemid, unitcost, attr1, statusName) VALUES ('$dt[itemid]', '$dt[unitcost]', '$dt[attr1]', '$dt[statusName]')");
}
?>

I think is the good way, if i wrong please correct.

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: xnoybx on September 19, 2015, 02:31:16 AM