EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: klynix on September 29, 2013, 07:42:41 PM



Title: need help on datagrid search
Post by: klynix on September 29, 2013, 07:42:41 PM
i have difficulty to get the search work. for my first horizontal tab with first vertical tab, the datagrid work fine with search etc.
But when come to third, 4th, the search input field passing empty data, my option has no value.
Can anyone help?


here is my code

home.php
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>Material DO</title>

<link rel="stylesheet" type="text/css" href="css/easyui.css">
<link rel="stylesheet" type="text/css" href="css/icon.css">
<link rel="stylesheet" type="text/css" href="css/demo.css">


<script type="text/javascript" src="js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>

<script type='text/javascript'>

$(document).ready(function(){


$tabsp = $('#tabsProject');
var pselectedindex = -1;
var mselectedindex = -1;


    $(window).resize(function(){

$("div.easyui-tabs").each(function() {
if($(this).is(':visible'))
$(this).tabs('resize',{})
})

$('table.easyui-datagrid').datagrid('resize');



    });


$tabsp.tabs({
onSelect: function(title, index){
if (pselectedindex != index)
{

var p = $tabsp.tabs('getSelected');  // get the selected tab panel
var  pid = p.panel('options').id.substr(4);
pselectedindex = index;
mselectedindex = -1;

$("div.easyui-tabs").each(function() {
if($(this).is(':visible'))
if($(this).attr('id') != 'tabsProject')
$(this).tabs({
onSelect: function(title, index){

if (mselectedindex != index)
{
var mp = $(this).tabs('getSelected');
var mid = mp.panel('options').id.substr(5);

mselectedindex = index;
mp.panel({
href:'load.do.grid.php?ProjectId='+ pid + '&MaterialId='+ mid

})
console.log($(this).attr('id') + ': '+ $('#tab').attr('id'));

}
}
})




});

};
}
})


})




   
</script>


<body>
<?php

require_once("connectdb.php");
require_once(
"..\common\html.php");

$psql "
SELECT
ProjectId,
ProjectName,
GroupName
FROM
Project
WHERE Status <> 1
ORDER BY
ProjectName
"
;

$msql "
SELECT
MaterialId,
MaterialName
FROM
materialtype
ORDER BY
MaterialName
"
;

echo '<div class="easyui-tabs" id="tabsProject" tabWidth="150px"  >';

if ($presult $mysqli->query($psql) )
while($prow $presult->fetch_assoc() )
{
echo '<div title="'.$prow['ProjectName'].'" id="tab-'.$prow['ProjectId'].'" 
data-options="fitcolumns:true", fit:true,  border:false '
.
' style="padding:5px;" >';

echo '<div id="mat-'.$prow['ProjectId'].'" class="easyui-tabs" tabPosition="left" headerWidth="200" style="padding:5px;"
data-options="fitcolumns:true, border:true ">'
;
if ($mresult $mysqli->query($msql) )
while( $mrow $mresult->fetch_assoc() )
{
echo '<div title="'.$mrow['MaterialName'].'" id="'.$prow['ProjectId'].'-'.$mrow['MaterialId'].'" style="padding:5px;" >';
echo '</div>';
};
echo '</div> <!-- M-'$prow['ProjectId'] .'tabs -->';



echo '</div>';
};

echo '</div> <!--class="easyui-tabs"-->';

?>

</body>
</html>

here is the code for load.do.grid.php
Code:

<?php

require_once('connectdb.php');

echo 
'
<table id="dgMaterial" title="Material DO" class="easyui-datagrid" style="width:auto; height:auto" toolbar="#tb"
data-options=" singleSelect:true, 
fitColumns:true,  
pagination:true,
rownumbers:true,
pageList:[20,50,100],
pageSize:20,
pagePosition:\'both\',
url:\'get.do.json.php\',
queryParams:{
ProjectId:\'' 
$_GET['ProjectId'] . '\', 
\'MaterialId\':\'' 
$_GET['MaterialId'] . '\',
keywords: $(\'#keywords\').val(),
Rec: $(\'#Rec\').val()
}
">'
;
echo 
'<thead>';


echo
'     <tr>';
/* custom define header with specific width size */
echo '<th data-options=" field:\'DoId\'" width="60">Do Id</th>';
echo '<th data-options=" field:\'DoDate\'" width="100" align="center">Do Date</th>';
echo '<th data-options=" field:\'DoNumbering\'" width="300">Do Numbering</th>';
echo '<th data-options=" field:\'Received\'" width="60" align="center">Received</th>';
echo '<th data-options=" field:\'ProjectName\'" width="60" align="left">ProjectName</th>';
echo '<th data-options=" field:\'MaterialName\'" width="100" align="left">MaterialName</th>';

echo '</tr>';

echo
'    </thead>
</table>'
;

// search box

echo '
<div id="tb" style="padding:3px;  ">
    <Label for="MultipleDo">DO Number:</label>
    <input id="MultipleDo" name="MultipleDo" value="" style="line-height:18px; width:200px; margin:0 3px;">
<Label style="margin-left:10px;"for="Received">Received:</label>
<select id="Received" name="Received" >
  <option value="0">No</option>
  <option value="1">Yes</option>
  <option value="2">Both</option>
</select>
<a href="#" class="easyui-linkbutton" plain="true" onclick="doSearch()">Search</a>
</div>'
;


?>


<script type='text/javascript'>
function doSearch(){
$("table.easyui-datagrid").datagrid('load',{
"MultipleDo": $("#MultipleDo").val(),
"Received": $("#Received").val(),
"ProjectId": "<?php echo $_GET['ProjectId']; ?>",
"MaterialId": "<?php echo $_GET['MaterialId']; ?>",
}

);
console.log($('#MultipleDo').attr('id') +': '+ $('#MultipleDo').val());
console.log($('#tb').attr('id'));
}

</script>


and here is my last file for get.do.json.php
Code:


<?php
require_once("connectdb.php");


$MultipleDo = isset($_POST['MultipleDo']) ? mysql_real_escape_string($_POST['MultipleDo']) : '';
$Received = isset($_POST['Received']) ? mysql_real_escape_string($_POST['Received']) : '0';

$ProjectId = isset($_POST['ProjectId']) ? mysql_real_escape_string($_POST['ProjectId']) : '0';
$MaterialId = isset($_POST['MaterialId']) ? mysql_real_escape_string($_POST['MaterialId']) : '0';

if(
$Received == 2)
$Received '';

$page = isset($_POST['page']) ? (int)($_POST['page']) : 1;
$rows = isset($_POST['rows']) ? (int)($_POST['rows']) : 10;
$offset = ($page-1)*$rows;

$where " DoNumbering like '%$MultipleDo%' and Received like '%$Received%' ";

$sql "
SELECT
count(*) as total
FROM
do
INNER JOIN 
project ON do.projectid = project.projectid
INNER JOIN 
materialtype ON do.materialid = materialtype.materialid
WHERE "
.$where.
" AND
do.ProjectId = '
$_POST[ProjectId]
AND
do.MaterialId = 
$_POST[MaterialId]
"
;

if( 
$rs $mysqli->query($sql) )
$result $rs->fetch_assoc();

$sql "
SELECT
DoId,
DATE_FORMAT(DoDate, '%d/%m/%Y') as 'DoDate',

DoNumbering,
IF(Received = 0,'No','Yes') as Received, 
do.ProjectId,
project.ProjectName,
do.MaterialId,
materialtype.MaterialName
FROM
do
INNER JOIN 
project ON do.projectid = project.projectid
INNER JOIN 
materialtype ON do.materialid = materialtype.materialid
WHERE "
.$where.
" AND
do.ProjectId = '
$_POST[ProjectId]
AND
do.MaterialId = 
$_POST[MaterialId]
ORDER BY
DoDate DESC
LIMIT 
$offset$rows
"
;

if ( 
$rs $mysqli->query($sql) )
$result['rows'] = $rs->fetch_all(MYSQLI_ASSOC);


echo 
json_encode($result);
?>