|
Title: change the url of the datagrid after performing some search on table to reload Post by: abha on December 09, 2014, 04:36:33 AM i want the function searchUser() to change the url of the datagrid to "search_record.php" how can i do this? thanks in advance
my code is index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Search Person</title> <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css"> <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/color.css"> <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/demo/demo.css"> <link rel="stylesheet" type="text/css" href="format.css"> <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script> <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script> </head> <body> <label class="inputlabel" for="first_name">First Name:</label> <select name="match1"> <option value = "a">IS</option> <option value = "b">NOT IS</option> <option value = "c">CONTAINS</option> </select> <input class="textbox" type="text" name="first_name"><br> <label class="inputlabel" for="last_name">Last Name:</label> <select name="match2"> <option value = "a">IS</option> <option value = "b">NOT IS</option> <option value = "c">CONTAINS</option> </select> <input class="textbox" type="text" name="last_name"><br> <label class="inputlabel" for="city">City:</label> <select name="match3"> <option value = "a">IS</option> <option value = "b">NOT IS</option> <option value = "c">CONTAINS</option> </select> <input class="textbox" type="text" name="city"><br> <label class="inputlabel" for="state">State:</label> <select name="match4"> <option value = "a">IS</option> <option value = "b">NOT IS</option> <option value = "c">CONTAINS</option> </select> <input class="textbox" type="text" name="state"><br> <label class="inputlabel" for="country">Country:</label> <select name="match5"> <option value = "a">IS</option> <option value = "b">NOT IS</option> <option value = "c">CONTAINS</option> </select> <input class="textbox" type="text" name="country"><br> <label class="inputlabel" for="profession">Profession:</label> <select name="match6"> <option value = "a">IS</option> <option value = "b">NOT IS</option> <option value = "c">CONTAINS</option> </select> <input class="textbox" type="text" name="profession"><br> <label class="inputlabel" for="email">Email:</label> <select name="match7"> <option value = "a">IS</option> <option value = "b">NOT IS</option> <option value = "c">CONTAINS</option> </select> <input class="textbox" type="text" name="email"><br> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-search" onclick="searchUser()">Search</a> <h2>Searched Data</h2> <p>Click the buttons on datagrid toolbar to do actions.</p> <table id="dg" title="My Users" class="easyui-datagrid" style="width:1000px;height:300px" toolbar="#toolbar" pagination="true" rownumbers="true" fitColumns="true" sorting="true" data-options="singleSelect:true,collapsible:true,url:'insert_record.php',method:'post'"> <thead> <tr> <th data-options="field:'personid',width:80">Person Id</th> <th data-options="field:'first_name',width:80">First Name</th> <th data-options="field:'last_name',width:80">Last Name</th> <th data-options="field:'address',width:80">Address</th> <th data-options="field:'city',width:80">City</th> <th data-options="field:'state',width:80">State</th> <th data-options="field:'countryid',width:80">CountryId</th> <th data-options="field:'dateofbirth',width:80">DOB</th> <th data-options="field:'profession',width:80">Profession</th> <th data-options="field:'mobile',width:80">Mobile</th> <th data-options="field:'emailid',width:80">EmailId</th> </tr> </thead> </table> <div id="toolbar"> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">New User</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Edit User</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser ()">Remove User</a> </div> <div id="dlg" class="easyui-dialog" style="width:400px;height:250px;padding:10px 20px" closed="true" buttons="#dlg-buttons"> <div class="ftitle">User Information</div> <form id="fm" method="post" novalidate> <div class="fitem"> <label>First Name:</label> <input name="first_name" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>Last Name:</label> <input name="last_name" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>Address:</label> <input name="address" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>City:</label> <input name="city" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>State:</label> <input name="state" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>CountryId:</label> <input name="countryid" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>DOB:</label> <input name="dateofbirth" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>Profession:</label> <input name="profession" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>Mobile:</label> <input name="mobile" class="easyui-textbox" required="true"> </div> <div class="fitem"> <label>EmailId:</label> <input name="emailid" class="easyui-textbox" validType="email" required="true"> </div> </form> </div> <div id="dlg-buttons"> <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="saveUser()" style="width:90px">Save</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog ('close')" style="width:90px">Cancel</a> </div> <script type="text/javascript"> var url; function newUser(){ $('#dlg').dialog('open').dialog('setTitle','New User'); $('#fm').form('clear'); url = 'save_record.php'; } function searchUser() { $('#dg').datagrid('loadData',{url:'search_record.php'}); } function editUser(){ var row = $('#dg').datagrid('getSelected'); if (row){ alert('Item ID:'+row.personid); $('#dlg').dialog('open').dialog('setTitle','Edit User'); $('#fm').form('load',row); url = 'update_record.php?id='+row.personid; } } function saveUser(){ $('#fm').form('submit',{ url: url, onSubmit: function(){ return $(this).form('validate'); }, success: function(result){ var result = eval('('+result+')'); if (result.errorMsg) { $.messager.show({ title: 'Error', msg: result.errorMsg }); } else { $('#dlg').dialog('close'); // close the dialog $('#dg').datagrid('reload'); // reload the user data } } }); } function destroyUser(){ var row = $('#dg').datagrid('getSelected'); if (row){ $.messager.confirm('Confirm','Are you sure you want to destroy this user?',function(r){ if (r){ $.post('delete_record.php',{id:row.personid},function(result){ if (result.success){ $('#dg').datagrid('reload'); // reload the user data } else { $.messager.show({ // show error message title: 'Error', msg: result.errorMsg }); } },'json'); } }); } } </script> <style type="text/css"> #fm{ margin:0; padding:10px 30px; } .ftitle{ font-size:14px; font-weight:bold; padding:5px 0; margin-bottom:10px; border-bottom:1px solid #ccc; } .fitem{ margin-bottom:5px; } .fitem label{ display:inline-block; width:80px; } .fitem input{ width:160px; } </style> </body> </html> search_record.php <?php $page = isset($_POST['page']) ? intval($_POST['page']) : 1; $rows = isset($_POST['rows']) ? intval($_POST['rows']) : 10; $offset = ($page-1)*$rows; $result = array(); $items = array(); $countryid =1; $mysqli = new mysqli("localhost", "root", "abha123", "personalrecord"); /* check connection */ if (mysqli_connect_errno()) { printf("Connect failed: %s\n", mysqli_connect_error()); exit(); } $query1 = "select count(*) from person"; $rs = $mysqli->query($query1); $row = $rs->fetch_row(); $result["total"] = $row[0]; $query2 = "select * from person where countryid = '".$countryid."'limit $offset,$rows"; $rs = $mysqli->query($query2); /* fetch object array */ while ($row = $rs->fetch_assoc()) { array_push($items,$row); } $result["rows"] = $items; echo json_encode($result); ?> thanks in advance Title: Re: change the url of the datagrid after performing some search on table to reload Post by: stworthy on December 09, 2014, 08:19:26 AM Please call 'load' method instead.
Code: $('#dg').datagrid('load', 'search_record.php');Title: Re: change the url of the datagrid after performing some search on table to reload Post by: abha on December 10, 2014, 10:46:54 PM Thank You!!! It works!
Title: Re: change the url of the datagrid after performing some search on table to reload Post by: abha on December 10, 2014, 11:24:25 PM In the above example if i want to send the data entered in the textbox in index.html file to search_record.php for performing search how can i do it?
please help Title: Re: change the url of the datagrid after performing some search on table to reload Post by: abha on December 15, 2014, 12:00:55 AM Solved!!!
|