EasyUI Forum

Hello,

If I call this function it is NOT saving the added record but add a row in the grid and then stays in edit mode in the datagrid..
Why is it not saving directly? I have manually to save it with the Save button then it works but thats not what I want.

It must add a row and directly save it in the grid and database.


function offerte_item_toevoegen(){   
      $('#dg_offerte_items').edatagrid('addRow',{
         row:{
            omschrijving :'11111'
            }
        }).edatagrid('autoSave');     
   }   




$(function(){
      $('#dg_offerte_items').edatagrid({
      loadMsg:'Momentje..',
      autoSave:true,
      url: 'get_offerte_items.php',
      saveUrl : 'save_offerte_items.php',
     
      onSave:function(index,row){
         alert('save');
      },
      });   
   });
   
<table id="dg_offerte_items" title="" style="width: 400px ;height:100% "
            toolbar="#toolbar_client1" pagination="false" pagePosition="bottom" PageSize="10" idField="id"
            rownumbers="false" singleselect="true"   autoRowHeight="false"  fitColumns="true" showfooter="true" >
         <thead>
            <tr >
               <th field="id" style="width:50px;" >ID</th>
                <th field="omschrijving" editor="{type:'validatebox',options:{required:false}}" style="width:100%" >Main items</th>
           
            </tr>
         </thead>
      </table>
   
      <div id="toolbar_client1" style="padding:3px">
      <a href="#" class="easyui-linkbutton" iconCls="icon-save"       plain="true" onclick="offerte_item_toevoegen()">Knop</a>
     
         <a href="#" class="easyui-linkbutton" iconCls="icon-save"       plain="true" onclick="javascript:$('#dg_offerte_items').edatagrid('addRow')">Toevoegen</a>
         <a href="#" class="easyui-linkbutton" iconCls="icon-save"       plain="true" onclick="javascript:$('#dg_offerte_items').edatagrid('saveRow')">Opslaan</a>
         <a href="#" class="easyui-linkbutton" iconCls="icon-cancel"    plain="true" onclick="javascript:$('#dg_offerte_items').edatagrid('cancelRow')">Annuleer</a>
         <a href="#" class="easyui-linkbutton" iconCls="icon-reload"    plain="true" onclick="javascript:$('#dg_offerte_items').edatagrid('reload')">Refresh</a>
   
      </div>

The 'addRow' method allows to add a new editing row and the user can enter something to edit it. To add a new row directly to the database, you should post it and then refresh the datagrid data.

Thanks stworthy !

It works now!