EasyUI Forum
May 16, 2024, 03:45:24 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: change the url of the datagrid after performing some search on table to reload  (Read 25156 times)
abha
Newbie
*
Posts: 4


View Profile
« 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
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: December 09, 2014, 08:19:26 AM »

Please call 'load' method instead.
Code:
$('#dg').datagrid('load', 'search_record.php');
Logged
abha
Newbie
*
Posts: 4


View Profile
« Reply #2 on: December 10, 2014, 10:46:54 PM »

Thank You!!! It works!
Logged
abha
Newbie
*
Posts: 4


View Profile
« Reply #3 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
« Last Edit: December 13, 2014, 03:38:39 AM by abha » Logged
abha
Newbie
*
Posts: 4


View Profile
« Reply #4 on: December 15, 2014, 12:00:55 AM »

Solved!!!
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!