Grid RecordForm Plugin

[jsakalos]

Funny you should say that I just bought a new microsoft wireless keyboard and mouse combo and as you say they certainly can make mice/keyboards.

Yeah, I liked these combos/sets most. Especially good was that "ergonomic" keyboard. I don't know if they still produce it - I use notebook now. (HP/Compaq is my favorite brand.)

[mjlecomte]

Saki, I went exploring a bit for educational purposes and have a couple of questions, although my questions appear unrelated to the actual plugin, more about your grid extension implementation. Hopefully ok to post in this thread for these questions.

Example.Grid1 = Ext.extend(Ext.grid.EditorGridPanel, {
     layout:'fit'
    ,border:false
    ,stateful:false
    ,url:'process-request.php'
    ,objName:'company'
    ,idName:'compID' 

What are you doing with objName and idName?

It looks like you're going to use objName server side.

                ,baseParams:{cmd:'getData', objName:this.objName} 

So I gather you've sent directions to route you to the appropriate controller ('cmd') but then I couldn't guess what you're going to do with the objName.

As for idName, I didn't really understand much for that one:

        switch(options.params.cmd) {
            case 'saveData':
                var records = this.store.getModifiedRecords();
                Ext.each(records, function(r, i) {
                    if(o.insertIds && o.insertIds[i]) {
                        r.set(this.idName, o.insertIds[i]);
                        delete(r.data.newRecord);
                    }
                });
                this.store.commitChanges();
            break; 

I gather you've sent back from server side a json property insertIds, but I don't quite get the set and delete parts.

[jsakalos]

Here you are MJ,

cmd stands, as you already understand, for a command to execute. It can be something like: getData, saveData, deleteRecord, or any command your server script understands.

objName stands for an "object" that we want to execute the command with. There is also server-side script included in the download so you can study it in full, but here is an excerpt:

$objects = array(
    // {{{
    // company
    "company"=>array(
         "table"=>"company"
        ,"idName"=>"compID"
        ,"fields"=>array(
             "compID"
            ,"company"
            ,"price"
            ,"change"
            ,"pctChange"
            ,"lastChange"
            ,"industry"
            ,"action1"
            ,"qtip1"
            ,"action2"
            ,"qtip2"
            ,"action3"
            ,"qtip3"
            ,"note"
        )
    )
    // }}}
); 

In a multi-table environment we should know which fields we have, what is the table name, etc. Therefore, if I send objName:'company' server looks in the above table and has all necessary data available.

idName is forgotten in client sources in fact as a remain of devel process and it is name of the field in a table that holds primary key. In our case it would be compID. This is important as if you send {cmd:'deleteRecord', objName:'company', id:33} we need to create an sql so we need id-to-primary-key mapping.

Should you have more questions, just post here, no problem.

[jsakalos]

Aaah, one more,

my server-side script can insert new records or update old ones in one request. You can edit grid records, add new ones and the click save and all works.

It is done such a way, that new records get property newRecord:true so server knows where to use update sql and where to use insert sql.

insertIds is array of primary key values of newly inserted records that client receives as the response from server so it can update underlying records in the store by removing newRecord property and setting correct ids for them. Otherwise you wouldn't be able to delete newly inserted records jus after clicking Save (Submit) as you wouldn't have ids to send to server for the delete command. Also update would fail or, better to say, it wouldn't update as id would be null (for those new records) so update sql wouldn't find any matching records.

[mjlecomte]

My mistake, I didn't realize (or forgot probably because I think you mentioned somewhere) that php script was included. I'll look further at the php file in the zip (I was just poking around the js in firebug initially).

I'm with you on the explanation. I had already been using a primaryKey property similar to your idName, so I'm with you there. I had also been passing a table property as well, but I think your method may be a more powerful way to approach it, I'll dig around some more....

Aaah, one more,

my server-side script can insert new records or update old ones in one request. You can edit grid records, add new ones and the click save and all works.

It is done such a way, that new records get property newRecord:true so server knows where to use update sql and where to use insert sql.

I'm going to review this bit further. At the moment I'm playing with having a save button on the toolbar. There is also a preferences menu button on the toolbar where you can select the save mode preference (instant, manual or when leaving a row). The save button enables/disables depending on the save mode. Anyway, batching up the client side data to send to the server depends a bit on the saveMode.

I was originally using a similar newRecord property. But I have changed that to sending the recordID. In the config I set newKey: -1. When a new record is added client side it is assigned the current value of newKey and then then newKey is decremented by one in case another record is added. Server side, I check if the value of the recordID is less than 1, if it is I do an insert, otherwise I use the update sql. I have this complexity in there because a user can add multiple records before "saving". So this way each added record has a unique record id.
Similar to what you mention below, once the server returns the response I can update new records to have the actual database primaryKey value instead of the negative number it got initially.

insertIds is array of primary key values of newly inserted records that client receives as the response from server so it can update underlying records in the store by removing newRecord property and setting correct ids for them. Otherwise you wouldn't be able to delete newly inserted records jus after clicking Save (Submit) as you wouldn't have ids to send to server for the delete command. Also update would fail or, better to say, it wouldn't update as id would be null (for those new records) so update sql wouldn't find any matching records.

I'm not sure if I have a problem like you elude to here. So far I haven't been able to break it. But I'm not sure if I'm in "save instantly" saveMode if someone can modify a newly created record fast enough where there may be some moment when there's a cross in communication before the new record gets it's "real primary key" assigned.

[jsakalos]

Yeah, these are 2 workable approaches to one problem. I usually don't use instant save so returning real insertIds is vital.

I like your "fake negative" id as you can identify records safely. I rely on the order assuming that submitted records have some order and insertIds have same order. This method works reliably too though.

[oracio]

hello Saki,

This extension is exactly what i was looking for, so thanks a lot!
I understand that it is still in an early beta version, but just for you knowledge, it doesnt work well on IE7: the Add Recrod doesnt work and when i open the edit record and save it, the page stucks.

Anyways, i just wanted to inform you about those issues and for your question if you should keep working on this extantion, in my opinion. Y-E-S!

[jsakalos]

Add button is not a part of the extension, it's part of the demo application. I haven't had time to implement it yet. I'll take a look at the another issue in IE7.

[jsakalos]

I've done add record - check it out now.

[wm003]

That's awesome and very useful! Thanks for sharing, saki