EasyUI Forum
September 14, 2025, 12:49:02 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
  Home Help Search Login Register  
  Show Posts
Pages: [1]
1  General Category / EasyUI for jQuery / Disabling autoUpdate and saving all the objects in edatagrid ? on: June 22, 2014, 07:39:47 PM

My Question


user can edit any number of rows and if he clicks on SAVE button server call should happen with Updated objects. But here what is hapeing is after user edits that row server call is happening for that row and updating
that particular row only.
simply,i want to remove auto update and update all objects when user clicks on save button


Please can anyone help me

Following is my code

    <html>
    <head>
    <meta charset="UTF-8">
    <title>Build CRUD DataGrid with jQuery EasyUI - jQuery EasyUI Demo</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/demo/demo.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>
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.edatagrid.js"></script>
    </head>
    <body>
    <h2>CRUD DataGrid</h2>
    <p>Double click the row to begin editing.</p>
   
   
    <table id="dg" title="My Users" style="width:800px;height:350px"
    toolbar="#toolbar" pagination="true" idField="id"
    rownumbers="true" fitColumns="true" singleSelect="true">
    <thead>
    <tr>
    <th field="firstname" width="50" >First Name</th>
    <th field="lastname" width="50" >Last Name</th>
    <th field="key1" width="50" editor="datebox">Date</th>
    <!-- <th field="email" width="50" editor="{type:'validatebox',options:{validType:'email'}}">Email</th> -->
   <!--  <th field="email" width="50" editor="editor:{type:'combobox',options:{'ABSENT','ABSENT11','ABSENT22'}">Email</th> -->
     <th data-options="field:'key',width:50,
                        formatter:function(value,row){
                            return row.value;
                        },
                        editor:{
                            type:'combobox',
                            options:{
                                valueField:'key',
                                textField:'key',
                                data:products,
                                required:true
                            }
                        }">Status</th>
   
   
    </tr>
    </thead>
    </table>
 
   
    <div id="toolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:$('#dg').edatagrid('addRow')">New</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="javascript:$('#dg').edatagrid('destroyRow')">Destroy</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="getSelections()">Save</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-undo" plain="true" onclick="javascript:$('#dg').edatagrid('cancelRow')">Cancel</a>
       <input class="easyui-datebox"></input><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="setEditing()">ADD DATE</a>
        <select class="easyui-combobox" name="state" ><option value="ABSENT">ABSENT</option><option value="PRESENT">PRESENT</option><option value="Holiday">Holiday</option><option value="WeekOff">Week Off</option><option value="Others">Others</option></select><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="changeAllStatusValue()">Select Value for all  Globally</a>
    </div>
    <script type="text/javascript">
         function changeAllStatusValue(){
         // here the logic should be implemented
      }

      
      
   
   
    var products = [
          {key:'ABSENT',value:'ABSENT'},
          {key:'PRESENT',value:'PRESENT'},
          {key:'Others',value:'Others'}
      ];
   var products2 ={"total":"10","rows":[{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"}]}
    $(function(){
    $('#dg').edatagrid({/*
    singleSelect: false,
    multiSelect: true, */
   // url: 'attendance/getUsers.htm',
    data:products2,
    saveUrl: 'attendance/saveUsers',
    updateUrl: 'attendance/updateUsers.htm',
    destroyUrl: 'attendance/deleteUsers'
    });
    });
    </script>
    </body>
    </html>
2  General Category / EasyUI for jQuery / setting the values of a particular column when a button is clicked in edatagrid on: June 22, 2014, 07:30:10 PM
Hi as i am new babe to jeasyui, can anyone help me, thanks in advance


1)First thing , i am strucked to change all the column values of "STATUS" as and  when the user selects a option and clicks on  "Select Value for all  Globally"


Please can anyone help me

Following is my code


    <html>
    <head>
    <meta charset="UTF-8">
    <title>Build CRUD DataGrid with jQuery EasyUI - jQuery EasyUI Demo</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/demo/demo.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>
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.edatagrid.js"></script>
    </head>
    <body>
    <h2>CRUD DataGrid</h2>
    <p>Double click the row to begin editing.</p>
    
  
    <table id="dg" title="My Users" style="width:800px;height:350px"
    toolbar="#toolbar" pagination="true" idField="id"
    rownumbers="true" fitColumns="true" singleSelect="true">
    <thead>
    <tr>
    <th field="firstname" width="50" >First Name</th>
    <th field="lastname" width="50" >Last Name</th>
    <th field="key1" width="50" editor="datebox">Date</th>
    <!-- <th field="email" width="50" editor="{type:'validatebox',options:{validType:'email'}}">Email</th> -->
   <!--  <th field="email" width="50" editor="editor:{type:'combobox',options:{'ABSENT','ABSENT11','ABSENT22'}">Email</th> -->
     <th data-options="field:'key',width:50,
                        formatter:function(value,row){
                            return row.value;
                        },
                        editor:{
                            type:'combobox',
                            options:{
                                valueField:'key',
                                textField:'key',
                                data:products,
                                required:true
                            }
                        }">Status</th>
    
    
    </tr>
    </thead>
    </table>
 
    
    <div id="toolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:$('#dg').edatagrid('addRow')">New</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="javascript:$('#dg').edatagrid('destroyRow')">Destroy</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="getSelections()">Save</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-undo" plain="true" onclick="javascript:$('#dg').edatagrid('cancelRow')">Cancel</a>
       <input class="easyui-datebox"></input><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="setEditing()">ADD DATE</a>
        <select class="easyui-combobox" name="state" ><option value="ABSENT">ABSENT</option><option value="PRESENT">PRESENT</option><option value="Holiday">Holiday</option><option value="WeekOff">Week Off</option><option value="Others">Others</option></select><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="changeAllStatusValue()">Select Value for all  Globally</a>
    </div>
    <script type="text/javascript">
         function changeAllStatusValue(){
         // here the logic should be implemented
      }

      
      
    
    
    var products = [
          {key:'ABSENT',value:'ABSENT'},
          {key:'PRESENT',value:'PRESENT'},
          {key:'Others',value:'Others'}
      ];
   var products2 ={"total":"10","rows":[{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"},{"id":"112066","phone":"112066","email":"am@gm.com","lastname":"kumar","firstname":"revanth"}]}
    $(function(){
    $('#dg').edatagrid({/*
    singleSelect: false,
    multiSelect: true, */
   // url: 'attendance/getUsers.htm',
    data:products2,
    saveUrl: 'attendance/saveUsers',
    updateUrl: 'attendance/updateUsers.htm',
    destroyUrl: 'attendance/deleteUsers'
    });
    });
    </script>
    </body>
    </html>
Pages: [1]
Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!