CODEWITHSUNDEEP
jqueryjqgridinlineedit
Matt Murdock
Matt Murdock

Reputation: 169

get the defaultValue of textbox in jqgrid while on inline-edit

We can get the defaultValue of a normal html textbox using:

$("#textboxId").prop("defaultValue");

However inside jqgrid(inline-edit), while editing a row, if select the textbox and check for defaultValue, it always results empty.

I want to get the original value of the textbox while on editmode, to check if the textbox value is really changed or not.

Please help. Thanks.

Upvotes: 1

Views: 878

Answers (1)

Helen Araya
Helen Araya

Reputation: 1946

What you need to do is use onSelectRow function of the jqGrid options get the old rowdata right when the user clicks the row in inline edit then use beforeSaveRow to examine the change.

Here is a code for it and a jsFiddle link to it.

var lastSel = 0;
            var mydata = [
                    {id:"1", name: "abc",desc: "desc 11"},
                    {id:"2", name: "def",desc: "hello there"},
                    {id:"3", name: "xyz",desc: "desc 44"}
                ];
            $("#list").jqGrid({

                datatype: "local",
                data: mydata,
                height: "auto",

                colModel :[
                 {name:'id',key:true, index:'idcustomers', width:55},
                    {name:'name',  width:100,editable: true},
                    {name:'desc', width:100,editable: true}                   
                ],
                pager: '#pager',
                rowNum:10,
                rowList:[10,20,30],
                sortname: 'idcustomers',
                sortorder: 'asc',
                viewrecords: true,
                gridview: true,
                caption: 'Customers',

                cellsubmit: 'clientArray',
                onSelectRow: function (id) {
          var currentRow =  $('#list').jqGrid("getRowData",id);

            if (id && id !== lastSel) {
             lastSel=id;
            }
            else
            {
            return;
            }
             jQuery('#list').editRow(id, 
          {
                "keys": true,          
               oneditfunc: function () {


                },
                "successfunc": null,
                "url": null,
                "extraparam": {},
                "aftersavefunc": null,
                "errorfunc": null,
                "afterrestorefunc": null,
                "restoreAfterError": true,
                "beforeSaveRow": function (options, rowid) {
                    // jqGrid calls its own SaveRow when the user hits 'Enter'. We need it to call ours.
                    // Note, the 'beforeSaveRow' is undocumented, but it gets invoked before jqGrid calls its own SaveRow method.

                 var newName = jQuery('#' + rowid + '_' + 'name').val();        
                  var oldName = currentRow.name;

                 if(newName!=oldName)
                 {
                   alert('changed');              
                 }
                   return true;

                },
            });
            }

            });

Upvotes: 1

Related Questions