is it possible to include an event in a javascript function?

Question

i was just wondering if getting a jqgrid event from a main javascript and separate it using another javascript in a form of function would work? what im trying to do is like this. i have a code :

     ...//some code here
     serializeGridData: function(postData) {
        var jsonParams = {
            'SessionID': $('#eSessionID3').val(),
            'dataType': 'data',
            'recordLimit': postData.rows,
            'recordOffset': postData.rows * (postData.page - 1),
            'rowDataAsObjects': false,
            'queryRowCount': true,
            'sort_fields': postData.sidx
        };

        if (postData.sord == 'desc')
        {
            ...//some code here
        }           
        else
        {
            ...//some code here
        }

        return 'json=' + jsonParams;
    },

    loadError: function(xhr, msg, e) { 
        showMessage('errmsg');
    },
            ...//some code here

i want to get this code and write this in another javascript file and make this as a function, so that my other file could use this one..is it possible?

i created something like this in my other javascrtip file where i planned to put all my functions. here's the code (functions.js):

function serialLoad(){
   serializeGridData: function(postData) {
      var jsonParams = {
         'SessionID': $('#eSessionID3').val(),
         'dataType': 'data',
         'recordLimit': postData.rows,
         'recordOffset': postData.rows * (postData.page - 1),
         'rowDataAsObjects': false,
         'queryRowCount': true,
         'sort_fields': postData.sidx
      };

      if (postData.sord == 'desc')
      {
          ...//some code here
      }           
      else
      {
          ...//some code here
      }
      return 'json=' + jsonParams;
   },

   loadError: function(xhr, msg, e) { 
       showMessage('errmsg');
   }
}

this isn't working and display a message syntax error. i don't know how to correct this. is there anyone who can help me.?

Community · Accepted Answer · 2017-05-23 12:11:53Z

2

First of all the answer on your derect question. If you define in the functions.js file some global variable, for example, myGlobal:

myGlobal = {};
myGlobal = serializeGridData: function(postData) {
    // ... here is the implementation
};

you can use it in another JavaScript file which must be included after the functions.js file:

serializeGridData: myGlobal.serializeGridData

(just use such parameter in the jqGrid definition).

If you want to use the serializeGridData parameter with the value in the most of your jqGrids you can overwrite the default value of serializeGridData in the functions.js file instead:

jQuery.extend(jQuery.jgrid.defaults, {
    datatype: 'json',
    serializeGridData: function(postData) {
        // ... here is the implementation
    },
    loadError: function(xhr, msg, e) { 
        showMessage('errmsg');
    }
});

In the example I ovewride additionally default datatype: 'xml' jqGrid parameter to datatype: 'json'. It shows that in the way you can set default values of any jqGrid parameter.

What it seems to me you really need is to use prmNames jqGrid parameter to rename some defaulf names of the standard jqGrid parameters. For example with

prmNames: {
    rows:"recordLimit",
    sort: "sort_fields",
    search:null,
    nd:null
}

you rename the standard rows parameter to recordLimit, the sidx to sort_fields and remove _search and nd parameters to be send.

Additionally you can use postData having some properties defined as the function (see here for details). For example:

postData: {
    SessionID: function() {
        return $('#eSessionID3').val();
    },
    rowDataAsObjects: false,
    queryRowCount: true,
    dataType: 'data',
    recordOffset: function() {
        var pd = jQuery("#list2")[0].p.postData;
        return pd.recordLimit * (pd.page - 1);
    },
    json: function() {
        var pd = jQuery("#list2")[0].p.postData;
        return {
           SessionID: $('#eSessionID3').val(),
           dataType: 'data',
           recordOffset: pd.recordLimit * (pd.page - 1),
           rowDataAsObjects: false,
           queryRowCount: true,
           sort_fields: pd.sort_fields
        };
    }
}

I used here both json parameter which you currently use and add parameters like SessionID, queryRowCount and so on directly in the list of parameters which will be send. Of course it is enough to send only one way (either json or the rest) to send the aditional information which you need.

edited May 23, 2017 at 12:11

CommunityBot

11 silver badge

answered Mar 21, 2011 at 8:54

Oleg

222k36 gold badges414 silver badges826 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

jayAnn Over a year ago

wait...ok.. i think i should study your code... i believe this can help me... thank you for the help and your time... im new in jqgrid and json and i really appreciate your effort. i hope i can have a mind like yours Oleg...")

Oleg Over a year ago

@jayAnn: You are welcome! If you will receive some additional question about the code later you can ask here your questions.

jayAnn Over a year ago

i've been reading your code many times and i still can't get it right...i see it so complicated. i dont know where to write the jQuery.extend({....}) (in main javascript or in the functions.js), and the postdata, idon't know where should i insert it and where should i write it.. thank you oleg:) and sorry if i can't hardly understand...

Oleg Over a year ago

@jayAnn: You can do following: in the functions.js use jQuery.extend(jQuery.jgrid.defaults, ...) to change any default parameters of jqGrid. In the way you can set prmNames or serializeGridData for example. Then in the main script you define jqGrid having no serializeGridData parameter, In the case as the default parameter will be used values from jQuery.jgrid.defaults which you changed in the functions.js.

Oleg Over a year ago

@jayAnn: Helped this? Probably I just try to write an code example as an answer on your next question.

|

Matthew Abbott · Accepted Answer · 2011-03-21 08:04:21Z

0

The second example is incorrect, as you are declaring a javascript object as the body of a function, what you could do is:

function serialLoad() {
    // Return an object with the required members
    return {
        serializeGridData: function(postData) { ... },
        loadError: function(xhr, msg, e) { ... }
    };
}

answered Mar 21, 2011 at 8:04

Matthew Abbott

61.7k9 gold badges108 silver badges131 bronze badges

8 Comments

jayAnn Over a year ago

i don't know but i don't get my program right. the grid is gone onload..but thank you for the answer...

jayAnn Over a year ago

console shows an error message "missing ( before formal parameters" in "function loadError: function(xhr, msg, e) { showMessage('errmsg'); } "

Matthew Abbott Over a year ago

You need to post the above comment on @Felix's answer.

Felix Kling Over a year ago

@jayAnn: Ah, that was a copy and paste mistake. Remove the second function keyword.

jayAnn Over a year ago

ahhh,,, i already correctly do it... and there's no error message now, but the grid doesn't show

|

Felix Kling · Accepted Answer · 2011-03-21 08:36:42Z

0

You are mixing function declaration and object literal notation. This syntax: property: value is used when creating an object with object literal notation:

var obj = {
   prop: val,
   prop2: val
};

serializeGridData and loadError are properties of some object and you cannot define those by just putting them into a function.

One way would be to create two functions, one for serializeGridData and one for loadError, e.g.

function serialLoad(postData){
  var jsonParams = {
     //...
  };

  if (postData.sord == 'desc') {
      //... some code here
  }           
  else {
      //... some code here
  }
  return 'json=' + jsonParams;
}

function onError(xhr, msg, e) { 
   showMessage('errmsg');
}

Then you can assign them in your other file to the object:

// ... some code here
serializeGridData: serialLoad,
loadError: onError,
//... some code here

Another way is to pass the object in question to the function and assign the properties there:

function attachLoadHandler(obj) {
    obj.serializeGridData = function(postData) {
        //...
    };

    obj.loadError = function(xhr, msg, e) {
        //...
    };
}

Then you have to pass the object you created to that function:

attachLoadHandler(obj);

But I think the first approach is easier to understand.

edited Mar 21, 2011 at 8:36

answered Mar 21, 2011 at 8:03

Felix Kling

820k181 gold badges1.1k silver badges1.2k bronze badges

8 Comments

jayAnn Over a year ago

thank you for the reply, but it didn't work...it didn't display my grid anymore on load..

jayAnn Over a year ago

there's no error on the console.... and yes, i never forgot to include my functions.js...

Felix Kling Over a year ago

@jayAnn: I updated my answer, the declaration of the onError function was wrong.

jayAnn Over a year ago

you're first example shows an error "missing ( before formal parameters [Break on this error] function onError: function(xhr, msg, e) { \n"

Felix Kling Over a year ago

@jayAnn: Yep, I already corrected it. Check my update and my comments.

|

Collectives™ on Stack Overflow

is it possible to include an event in a javascript function?

3 Answers 3

6 Comments

8 Comments

8 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

8 Comments

8 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related