Auto save cells

[shaynl]

Is it possible to add auto save to the cells in the php grid when moving from one cell to another instead of needing to click on the save button?
Thanks

[steven]

yes,
afterEdit : function(){   mygrid.save(); }

[shaynl]

thanks, but where i put it in the code? 

[steven]

var gridOption={ id : grid_demo_id, width: "700",  height: "350",          afterEdit : function(){             mygrid.save();         } }

[shaynl]

still can't get it to work...
im geting error in firefox:

Error: missing } after property list
Source File: http://localhost/samples/php/crud/index.php
Line: 59, Column: 1
Source Code:container : 'gridbox',

this is how it applied:

var gridOption={ id : grid_demo_id, loadURL : 'Controller.php', saveURL : 'Controller.php', width: "700",  //"100%", // 700, height: "200",  //"100%", // 330, afterEdit : function(){ mygrid.save(); } container : 'gridbox', replaceContainer : true, encoding : 'UTF-8', // Sigma.$encoding(), dataset : dsOption , columns : colsOption , clickStartEdit : true , defaultRecord : {'id':"00",'employee':"",'country':"",'customer':"",'order2005':0,'order2006':0,'order2007':0,'order2008':0,'delivery_date':"2008-01-01"}, pageSize:100, toolbarContent : 'reload | add del save | print' };

[shaynl]

hi,
is there any news on how to apply the auto save?
thanks

[PENDRAGON]

You need to add a comma after the line.  I have tried this myself and I get a JavaScript recursion error (as if it goes into an infinite save loop - oddly the record never gets saved at all though which one might expect even with the recursion issue).

(from your post)
    height: "200",  //"100%", // 330,
    afterEdit : function(){ mygrid.save(); },   <---comma needed here
    container : 'gridbox',

[shaynl]

Thanks! Now it's working but I'm getting this recursion error when editing a cell: "out of memory at line:58" (it's this function line…).
I'm wondering… is there any way to fix that?

[PENDRAGON]

I'd be very interested in the solution myself.  I haven't been able to get this to work to auto save and it's the mygrid.save() function that is the problem.  I've tried the following to see that the function is called and that the function itself isn't causing the loop.

      afterEdit : function() {
         var recs = mygrid.getUpdatedRecords();
         if(recs!=null&&recs.length>0){  //this checks to see if any field is updated
            alert('recs' + recs + '.');  //this shows an object reference for each updated field
                                //mygrid.save();            //this line causes recursion error if uncommented
         }
      }

I have also tried to call onBlur and other events that don't seem to be called at all.  The very odd thing is that it's not saving at all.  If the .save() function worked it should save it even if it is creating a recursive loop.

[PENDRAGON]

As an experiment to get an Auto Save function to work, I put a hidden field in a form on the Web page outside of the grid to hold a value.  I use this value to act as a toggle switch in order to stop the .save() function from looping (recursion).

Here's the form on my web page to store the toggle value:
      <form id='toggler' name='toggler'><input type='hidden' value='0' id='toggleval' name='toggleval'></form>

Then I used the following in my gridOption area:
      afterEdit : function() {
         var recs = mygrid.getUpdatedRecords();
         var formval = document.getElementById('toggleval').value;
         if(recs!=null&&recs.length>0&&formval==0){
            document.toggler.toggleval.value=1;
            mygrid.save();
            mygrid.refresh();
            document.toggler.toggleval.value=0;
         }
      }
(remember to put a comma after the bracket at the end if there are more items after it.  I put this as the last thing on mine. 

Some explanation - first I check if there are any updated records since the 'afterEdit' event seems to trigger with or without any changes to the data in a cell (which is probably by design).  I didn't want to save unchanged records to the database for obvious reasons.  After I check that there is an update, I check the value of the toggle (starts out at Ø).  As long as that value is Ø and just before calling that recursive .save() function I set the flag to 1.  Then I execute the .save() followed by a .refresh(). This seems to stop the recursion (since the toggle doesn't equal Ø).  After that I set the value of the hidden field back to Ø so that it's ready for the next update.

Seems to work fine for me.  It's not a great workaround but I don't want to mess with the supplied javascript for the sigma grid itself.

Hope this is helpful until a better answer is posted.

-PEN

[shaynl]

Nice workaround!  It's working fine for the update but there are some other problems:
1. No auto save when deleting row.
2. No auto save when adding new row.
3. Duplicate row bug: when start adding new row and then moving to update existing row (without clicking save), after the update, it save everything but duplicate the new row.

Can we improve this workaround to handle those 3 things?

Thanks

[PENDRAGON]

In the instance I am working with, I don't have a need to auto save for delete or add so I didn't try to figure that out. 

I would say that the afterEdit event is not firing in those two instances so the code isn't running.  You would have to find out what events happen.  Possibly change the Add function so that it actually creates a new record with blank or default data which would then just make it just another record you could edit.  On the delete, maybe update the JavaScript to fire a save command directly after marking the item for deletion which should make it delete with one click.

I didn't even know there was a duplicate command that was native so I'll have to look at that.

If I get time I'll look into some of this but I doubt that will be very soon.  I'm sure someone else has a better idea about these items.

[shaynl]

The auto save on adding is more important…the solution for that like u said will be saving an empty row when clicking add. ..
I tried this but it's not working:
 addRow : function() {               mygrid.add();               mygrid.save();          },
Any clue why?