Forum

November 2nd, 2014
A A A
Avatar

Lost password?
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

The forums are currently locked and only available for read only access
sp_Feed Topic RSS sp_Related Related Topics sp_TopicIcon
small bug in generating new id in postIt() of editGridRow()
07/03/2011
12:22
Avatar
OlegK
Germany
Member
Members
Forum Posts: 1255
Member Since:
10/08/2009
sp_UserOfflineSmall Offline

Hello Tony,

in some seldom situation the postIt() of editGridRow() generate new row id with the following line of code

if(!ret[2]) { ret[2] = (parseInt($t.p.records,10)+1)+""; }

which is not quite correct.

1) $t.p.records is already a Number and one don't need to make parseInt($t.p.records,10)

2) if one add the row after deliting some previously added lines with the small id number, one can receive id duplication in case of the usage the code ret[2] = $t.p.records+"";

So I suggest to fix in so way

if(!ret[2]) {
    // generate new id
    var new_id = $t.p.records + 1;
    // If one remove some rows before insterting the row it can be that
    // id = $t.p.records + 1 is already in use. So we have to find
    // another unused id
    while ($("#"+new_id).length !== 0) { // verify that the id already exist
        new_id++;
    }
    ret[2] = String(new_id);
}

By the way the current version of the form editing not supports local editing. I made the example which shows how one can do use local editing with respecrt of form editing. Based on the example I will try to write the corresponding suggestiond to change grid.formedit.js to allow local editing. I will post the corresponding new code of the postIt() in the next time in "Feature Requests".

Best regards
Oleg

12/03/2011
11:22
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Oleg,

Yes this is true and is a problem.

This one is good solution, but I think a better way is to use a random function to generate the id - something like in the new filter module.

I will use this approach.

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

12/03/2011
11:49
Avatar
OlegK
Germany
Member
Members
Forum Posts: 1255
Member Since:
10/08/2009
sp_UserOfflineSmall Offline

Hello Tony,

the usage of randId I like also more, but to be consequent one can also use the same function in grid.base.js, for example here. One can have small compatibility problem if somebody play on the interger sequential id numbers if he don't define any id (or define in the wrong way) in the input data.

One thing I would do: one should verify that the id genrated with respect of Math.random are not yet used. All standard random function are not so random, only random function from the cryptographical modules can produce good rendom numbers. See this answer for example. A simple verification like $("#"+new_id).length !== 0 will be enough.

I recommed you additionally use Math.floor(Math.random()*idMax+1) instead of Math.floor(Math.random()*idMax) which you currently use. It will no more produce id=0 which can be not the best in different JavaScript compares. The idMax value can be jqGrid parameter initialized to 10000.

What do you think about including supports for local editing in the form editing module? Do you want to implement it youself or I can write an suggestion (till now I didn't find time to do this, but next week I could do this).

Best regards
Oleg

12/03/2011
12:24
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Well,

Yes there is a possibility to have duplicates, but I think I found the uniquie approach

randId : function ()

{

return String(new Date().getTime());

}

Confused

I will look right now deeper into your code for the local form editing.

Regards

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

13/03/2011
10:24
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Hello Oleg,

Sorry, but I can not find the link you provided for the local form editing.

Could you please post it again?

Thank you.

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

13/03/2011
11:58
Avatar
OlegK
Germany
Member
Members
Forum Posts: 1255
Member Since:
10/08/2009
sp_UserOfflineSmall Offline

No problem Tony!

It is http://www.ok-soft-gmbh.com/jq.....diting.htm. It is in the last paragraph of my first post in the tread.

Best regards
Oleg

P.S. I tried meny time to post the whole code also here. It is terrible!

var lastSel, mydata = [
        {id:"1",invdate:"2007-10-01",name:"test",note:"note",amount:"200.00",tax:"10.00",
         closed:true, ship_via:"TN",total:"210.00"},
        {id:"2",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",
         closed:false,ship_via:"FE",total:"320.00"},
        {id:"3",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",
         closed:false,ship_via:"FE",total:"430.00"},
        {id:"4",invdate:"2007-10-04",name:"test4",note:"note4",amount:"200.00",tax:"10.00",
         closed:true,ship_via:"TN",total:"210.00"},
        {id:"5",invdate:"2007-10-31",name:"test5",note:"note5",amount:"300.00",tax:"20.00",
         closed:false,ship_via:"FE",total:"320.00"},
        {id:"6",invdate:"2007-09-06",name:"test6",note:"note6",amount:"400.00",tax:"30.00",
         closed:false,ship_via:"FE",total:"430.00"},
        {id:"7",invdate:"2007-10-04",name:"test7",note:"note7",amount:"200.00",tax:"10.00",
         closed:true ,ship_via:"TN",total:"210.00"},
        {id:"8",invdate:"2007-10-03",name:"test8",note:"note8",amount:"300.00",tax:"20.00",
         closed:false,ship_via:"FE",total:"320.00"},
        {id:"9",invdate:"2007-09-01",name:"test9",note:"note9",amount:"400.00",tax:"30.00",
         closed:false,ship_via:"TN",total:"430.00"},
        {id:"10",invdate:"2007-09-08",name:"test10",note:"note10",amount:"500.00",
         tax:"30.00",closed:true ,ship_via:"TN",total:"530.00"},
        {id:"11",invdate:"2007-09-08",name:"test11",note:"note11",amount:"500.00",
         tax:"30.00",closed:false,ship_via:"FE",total:"530.00"},
        {id:"12",invdate:"2007-09-10",name:"test12",note:"note12",amount:"500.00",
         tax:"30.00",closed:false,ship_via:"FE",total:"530.00"}
    ],
    grid = $("#list"),
    onclickSubmitLocal = function(options,postdata) {
        var grid_p = grid[0].p,
            idname = grid_p.prmNames.id,
            grid_id = grid[0].id,
            id_in_postdata = grid_id+"_id",
            rowid = postdata[id_in_postdata],
            addMode = rowid === "_empty",
            oldValueOfSortColumn;

        // postdata has row id property with another name. we fix it:
        if (addMode) {
            // generate new id
            var new_id = grid_p.records + 1;
            while ($("#"+new_id).length !== 0) {
                new_id++;
            }
            postdata[idname] = String(new_id);
        } else if (typeof(postdata[idname]) === "undefined") {
            // set id property only if the property not exist
            postdata[idname] = rowid;
        }
        delete postdata[id_in_postdata];

        // prepare postdata for tree grid
        if(grid_p.treeGrid === true) {
            if(addMode) {
                var tr_par_id = grid_p.treeGridModel === 'adjacency' ? grid_p.treeReader.parent_id_field : 'parent_id';
                postdata[tr_par_id] = grid_p.selrow;
            }

            $.each(grid_p.treeReader, function (i){
                if(postdata.hasOwnProperty(this)) {
                    delete postdata[this];
                }
            });
        }

        // decode data if there encoded with autoencode
        if(grid_p.autoencode) {
            $.each(postdata,function(n,v){
                postdata[n] = $.jgrid.htmlDecode(v); // TODO: some columns could be skipped
            });
        }

        // save old value from the sorted column
        oldValueOfSortColumn = grid_p.sortname === "" ? undefined: grid.jqGrid('getCell',rowid,grid_p.sortname);

        // save the data in the grid
        if (grid_p.treeGrid === true) {
            if (addMode) {
                grid.jqGrid("addChildNode",rowid,grid_p.selrow,postdata);
            } else {
                grid.jqGrid("setTreeRow",rowid,postdata);
            }
        } else {
            if (addMode) {
                grid.jqGrid("addRowData",rowid,postdata,options.addedrow);
            } else {
                grid.jqGrid("setRowData",rowid,postdata);
            }
        }

        if ((addMode && options.closeAfterAdd) || (!addMode && options.closeAfterEdit)) {
            // close the edit/add dialog
            $.jgrid.hideModal("#editmod"+grid_id,
                                {gb:"#gbox_"+grid_id,jqm:options.jqModal,onClose:options.onClose});
        }

        if (postdata[grid_p.sortname] !== oldValueOfSortColumn) {
            // if the data are changed in the column by which are currently sorted
            // we need resort the grid
            setTimeout(function() {
                grid.trigger("reloadGrid", [{current:true}]);
            },100);
        }

        // !!! the most important step: skip ajax request to the server
        this.processing = true;
        return {};
    },
    editSettings = {
        recreateForm:true,
        jqModal:false,
        reloadAfterSubmit:false,
        closeOnEscape:true,
        closeAfterEdit:true,
        onclickSubmit:onclickSubmitLocal
    },
    addSettings = {
        recreateForm:true,
        jqModal:false,
        reloadAfterSubmit:false,
        closeOnEscape:true,
        closeAfterAdd:true,
        onclickSubmit:onclickSubmitLocal
    },
    delSettings = {
        // because I use "local" data I don't want to send the changes to the server
        // so I use "processing:true" setting and delete the row manually in onclickSubmit
        onclickSubmit: function(options, rowid) {
            var grid_id = grid[0].id,
                grid_p = grid[0].p,
                newPage = grid[0].p.page;

            // delete the row
            grid.delRowData(rowid);
            $.jgrid.hideModal("#delmod"+grid_id,
                                {gb:"#gbox_"+grid_id,jqm:options.jqModal,onClose:options.onClose});

            if (grid_p.lastpage > 1) {// on the multipage grid reload the grid
                if (grid_p.reccount === 0 && newPage === grid_p.lastpage) {
                    // if after deliting there are no rows on the current page
                    // which is the last page of the grid
                    newPage--; // go to the previous page
                }
                // reload grid to make the row from the next page visable.
                grid.trigger("reloadGrid", [{page:newPage}]);
            }

            return true;
        },
        processing:true
    },
    initDateEdit = function(elem) {
        setTimeout(function() {
            $(elem).datepicker({
                dateFormat: 'dd-M-yy',
                autoSize: true,
                showOn: 'button', // it dosn't work in searching dialog
                changeYear: true,
                changeMonth: true,
                showButtonPanel: true,
                showWeek: true
            });
            //$(elem).focus();
        },100);
    },
    initDateSearch = function(elem) {
        setTimeout(function() {
            $(elem).datepicker({
                dateFormat: 'dd-M-yy',
                autoSize: true,
                //showOn: 'button', // it dosn't work in searching dialog
                changeYear: true,
                changeMonth: true,
                showButtonPanel: true,
                showWeek: true
            });
            //$(elem).focus();
        },100);
    };

grid.jqGrid({
    datatype:'local',
    data: mydata,
    colNames:['Inv No','Date','Client','Amount','Tax','Total','Closed','Shipped via','Notes'],
    colModel:[
        {name:'id',index:'id',width:70,align:'center',sorttype: 'int',searchoptions:{sopt:['eq','ne']}},
        {name:'invdate',index:'invdate',width:80, align:'center', sorttype:'date',
            formatter:'date', datefmt: 'd-M-Y',
            formatoptions: {newformat:'d-M-Y'}, editable:true, 
            editoptions: {dataInit:initDateEdit},
            searchoptions: {dataInit:initDateSearch}},
        {name:'name',index:'name',editable: true, width:70, editrules:{required:true}},
        {name:'amount',index:'amount',width:100,formatter:'number',editable:true,align:'right'},
        {name:'tax',index:'tax',width:70, formatter:'number', editable: true, align:'right'},
        {name:'total',index:'total',width:120, formatter:'number', editable: true, align:'right'},
        {name:'closed',index:'closed',width:110,align:'center',editable: true,
            formatter: 'checkbox',
            edittype:'checkbox',editoptions:{value:'Yes:No',defaultValue:'Yes'},
            stype: 'select',
            searchoptions: { sopt:['eq','ne'], value:':All;true:Yes;false:No' }},
        {name:'ship_via',index:'ship_via',width:120,align:'center',editable: true, formatter:'select',
            edittype:'select',editoptions:value:'FE:FedEx;TN:TNT;IN:Intim',defaultValue:'Intime'},
            stype:'select', searchoptions:{value:':All;FE:FedEx;TN:TNT;IN:Intim'}},
        {name:'note',index:'note',width:100,sortable:false,editable:true,edittype:'textarea'}
    ],
    rowNum:10,
    rowList:[5,10,20],
    pager: '#pager',
    gridview:true,
    rownumbers:true,
    autoencode:true,
    ignoreCase:true,
    sortname: 'invdate',
    viewrecords: true,
    sortorder: 'desc',
    caption:'How to implement local form editing',
    height: '100%',
    editurl: 'clientArray',
    ondblClickRow: function(rowid, ri, ci) {
        var p = grid[0].p;
        if (p.selrow !== rowid) {
            // prevent the row from be unselected on double-click
            // the implementation is for "multiselect:false" which we use,
            // but one can easy modify the code for "multiselect:true"
            grid.jqGrid('setSelection', rowid);
        }
        grid.jqGrid('editGridRow', rowid, editSettings);
    },
    onSelectRow: function(id) {
        if (id && id !== lastSel) {
            // cancel editing of the previous selected row if it was in editing state.
            // jqGrid hold intern savedRow array inside of jqGrid object,
            // so it is safe to call restoreRow method with any id parameter
            // if jqGrid not in editing state
            if (typeof lastSel !== "undefined") {
                grid.jqGrid('restoreRow',lastSel);
            }
            lastSel = id;
        }
    }
}).jqGrid('navGrid','#pager',{},editSettings,addSettings,delSettings,
            {multipleSearch:true,overlay:false,
            onClose:function(form){
                // if we close the search dialog during the datapicker are opened
                // the datepicker will stay opened. To fix this we have to hide
                // the div used by datepicker
                $("div#ui-datepicker-div.ui-datepicker").hide();
            }});

13/03/2011
12:20
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Oleg,

Sorry, I think it was in separate post

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

13/03/2011
12:42
Avatar
OlegK
Germany
Member
Members
Forum Posts: 1255
Member Since:
10/08/2009
sp_UserOfflineSmall Offline

You are welcome!

The only problem is to post code in the forum. Currently I have to make replacement of all blanks to &nbsp; and append every line with <br /> to make code looks OK in the forum. I have to do the changes in another text editor and post the code in the HTML view. Probably you know some tricks.

Oleg

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
39 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information