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_TopicIcon
JQGrid Save on Control Enter
28/08/2014
01:57
Avatar
lalitmj
Member
Members
Forum Posts: 10
Member Since:
17/08/2014
sp_UserOfflineSmall Offline

Hi,

I'm new to JQGrid need help with changing the save option to control enter instead of Enter. Also my other issue is regarding fetching saved row when i click on another row after edit as it always showing data prior to update (Update is working successfully). I'm attaching code here for reference. Thanks for all your valuable feedback's :-

function buildgrid() {
        var grid = jQuery("#Northwinds");
        var gridData;
        grid.jqGrid({
            url: '/sites/cats/_vti_bin/listdata.svc/TSCMaster',
            datatype: 'json',
            sortable: true,
            rownumbers: false,
            jsonReader: {
                root: "d.results",
                repeatitems: false
            },
               success: function(data){
            var $self = $(this);
                    setTimeout(function () {
                    $self.trigger("reloadGrid");
                    }, 50);
        },
        afterSubmit: function () {
                $(this).jqGrid("setGridParam", {datatype: 'json'});
                return [true];
        },
            colNames: [" ", "Script Page", "Scene #", "Item Description", "Comments/Restrictions","url","etag"],
            colModel: [
        {name: 'myac', width:80, fixed:true, sortable:false, resize:false, formatter:'actions',
            formatoptions:{keys:true}},
        {
                name: 'ScriptPage',
                editable: true,
                sortable: true,
                index: 'ScriptPage',
            search: false,
                width: 75},
            {
                name: 'SceneNumber',
                editable: true,
                sortable: true,
            search: false,
                index: 'SceneNumber',
                width: 75},
            {
                name: 'ItemDescription',
                editable: true,
                sortable: true,
                index: 'ItemDescription',
                width: 300},
        {
            name:'CommentsRestrictions',
              index:'CommentsRestrictions',
            editable:true,
            width :600,
                    edittype:'custom',
            editoptions:{custom_element:function( value , options) {
                var elm = $('<textarea rows=4 cols=100></textarea>');
                elm.val( value );
                // give the editor time to initialize
                setTimeout( function() {
                    tinymce.init({selector: "textarea#" + options.id
            });
                }, 0);
                return elm;
                  },
                  custom_value:function( element, oper, gridval) {
            var id = element[0].id;
                    if(oper === 'get') {
                    return tinymce.get(id).getContent({format: 'row'});
                    } else if( oper === 'set') {
                    if(tinymce.get(id)) {
                        tinymce.get(id).setContent( gridval );
                           }
                        }
              }
            }
              },
                {   
            name: '__metadata.uri',  
            editable: false,
            hidden: true,
            width: 400},
                {   
            name: '__metadata.etag',  
            editable: false,width: 100,
            hidden: true}],
            onSelectRow: function(id) {
 
                    var rowData = $("#Northwinds").getRowData(id);
                    var newUrl = rowData['__metadata.uri'];
                    $(this).setGridParam({
                    'editurl': newUrl
                });
                if (id && id !== lastSel) {
                    $("#Northwinds").restoreRow(lastSel);
 
                    lastSel = id;
                }
                $("#Northwinds").editRow(id, true, null, null);
        
            },
        
        serializeRowData: function(postdata) { //USED ON EDIT
                    var x = JSON.stringify(postdata);
                    return x;
            },
            ajaxRowOptions: { // USED ON EDIT
                    contentType: 'application/json; charset=utf-8',
                    datatype: 'json',
                    mtype: 'POST',
                    async: true,
                beforeSend: function(jqXHR, settings) {
                    grid = $("#Northwinds").jqGrid(); // get the selected row
                    this.selectedRow = grid.jqGrid('getGridParam', 'selrow'); // add the selected row to the ajax object so we can get at in in the callback
                    var etag = grid.jqGrid('getCell', this.selectedRow, '__metadata.etag');
                    jqXHR.setRequestHeader("X-HTTP-Method", "MERGE");
                    jqXHR.setRequestHeader("If-Match", etag);
 
                    var postdata = $.parseJSON(settings.data);
                    delete postdata['oper']; // dont send operation to the server
                    delete postdata['id']; // dont send operation to the server
                    delete postdata["__metadata.etag"];
                    delete postdata["__metadata.uri"];
 
                    settings.data = JSON.stringify(postdata);
 
                },  
        success: function(data, textStatus, jqXHR) {
                    // requery the resource to get the new etag // this is due to a bug in ie that drops all headers associated with an h204
                    var selectedRow = this.selectedRow;
                    $.ajax({
                            beforeSend: function(jqXHR, settings) { // need to pass the selectedRow to the second (nested callback)
                                this.selectedRow = selectedRow;
                        },
                        async: false,
                        contentType: 'application/json; charset=utf-8',
                        datatype: 'json',
                        url: this.url,
                        success: function(data, textStatus, jqXHR) {
                            var etag = jqXHR.getResponseHeader("ETag");
                            $("#Northwinds").jqGrid("setCell", this.selectedRow, "__metadata.etag", etag); // update the etag on the selected row
                            }
                    })
          }
                },
        loadComplete: function (data) {
               //setSearchSelect(grid, griddata, 'Category', 'eq');         
            },
        pager: "#pager",    
            rowNum: 1000,
        rowList: [10, 50, 100, 500, 'All'],
        height: 'auto',
        loadonce:true,
        reloadAfterSubmit: true,
        viewrecords: true,
        gridview: true, // insert all the data at once (speedy)
        caption: 'Theatrical Clearance List'
        });

29/08/2014
11:20
Avatar
tony
Sofia, Bulgaria
Moderator
Members

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

Hello,

 

As far as I understand the question the enter can not be changed. It can be disabled, but not changed with other key - see docs.

As for the second problem replace restoreRow with save row in onSelect row

 

if (id && id !== lastSel) {
                    $("#Northwinds").restoreRow(lastSel);

....

 

to

if (id && id !== lastSel) {
                     $("#Northwinds").saveRow(lastSel);

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.

30/08/2014
01:05
Avatar
lalitmj
Member
Members
Forum Posts: 10
Member Since:
17/08/2014
sp_UserOfflineSmall Offline

Thanks Tony for your help!

03/09/2014
07:17
Avatar
lalitmj
Member
Members
Forum Posts: 10
Member Since:
17/08/2014
sp_UserOfflineSmall Offline

Thanks Tony,

Another problem which happens when i replace restorerow to saverow that the last row still remains editable so as i keep clicking the rows they all get editable. I just needed one row to be editable at a time.

You help is much appreciated!

08/09/2014
15:31
Avatar
tony
Sofia, Bulgaria
Moderator
Members

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

Hello,

 

The problem is inyour ajaxrowoptions. Try as simple as possible code (do not use any other option) and see where the problem is.

 

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.

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
52 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