Using eval to assign a variable to a method. How else should I do it?

Question

I am using a method to accept a portion of an element's ID and use that to determine which url path I need to pass to a method. In my case this is used by a click event on a button that could be attached to any one of a number of grids so I need to know which grid I am on in order to know what data to reload:

jQuery('.reset').click(function(e) {
    e.preventDefault();
    jQuery('#' + grid_id + '_mnf').toggle();
    jQuery('#' + grid_id + '_mnfall > .instance').each(function () {
        jQuery(this).removeAttr("checked");
    });
    var url = eval(grid_id + '_url');
    jQuery('#foo').setGridParam({url:url}).trigger('reloadGrid');
});

The possible urls are defined as variables so I have something like:

var foo_url = url_path + '?input=moduleone&param=1';
var bar_url = url_path + '?input=moduleone&param=2';

This means that in the setGridParam method above the url value will be one of these vars. If I simply do:

var url = grid_id + '_url'; //note I'm not using eval here

The value passed to setGridParam will not work.

If I don't use eval like I do above the url will not work. Why? What is going on here? What else should I do since "eval is evil"?

In my mind, without using eval, I am passing the url like:

jQuery('#foo').setGridParam({url:foo_url}).trigger('reloadGrid');

but this fails so apparently eval is required here?

Because I am sure this is too rigid and clunky of a way to do this and in case anyone wants to see it (and perhaps suggest how I am doing this wrong?), here is how I am getting that grid_id:

// ex. id='foo_filter'
var source = $(this).parent().parent().attr('id').split('_');

var parsed_source = source.splice(1, source.length + 1);

grid_id_portion = '';
for (var i = 0; i < parsed_source.length; i++) {
    grid_id += parsed_source[i];
    if(i < parsed_source.length - 1){
        grid_id += '_';
    }

}

Some issues I see... I have to define the urls as variables for each grid. This is quite inflexible, yes? Those urls are pretty similar as well so defining a bunch of them seems inefficient. Also, what if someone crafts a special chunk of code to insert as the ID that I am breaking apart to pass to eval. That could be bad news, yes? Any suggestions on how to improve on this would be greatly appreciated.

Need to really see the full click code and where you defined grid_id — Alex, Jan 24 '12 at 08:39
@Alex - I added the little bit that was not present. the grid_id definition code is already in there... at the bottom. — Lothar, Jan 24 '12 at 08:58
I suppose that one can implement all what you need in much easier way. The problem is that I don't full understand what you do. Do you have two (or more) grids on the page? How many buttons with the class 'reset' you have on the page? Where are elements ...'_mnf', '_mnfall > .instance'? The HTML markup will be very helpful. — Oleg, Jan 24 '12 at 09:14
Which `mtype` you use in the grid? If you use default `mtype: 'GET'` then all values parameters appended to the URL like `input=moduleone&param=2` can be set with respect of `postData: {input: 'moduleone', param: 2}`. If you would replace `param` properties to *the method* like it's described in [the answer](http://stackoverflow.com/a/2928819/315935) you will be able to test some criteria *inside* of `param` method and return 1 or 2 depend of the tests. — Oleg, Jan 24 '12 at 09:41
@Oleg - I have many grids on one page... more than 2, at least. In some instances I have from 2 to 6 grids with "reset" buttons. '_mnf' elements are modal windows containing filters for grid content that are toggled on/off by clicking a link that is inserted into each grid's header row. '_mnfall' elements are individual checkboxes for various filters to be applied, depending on the type of each grid, in the modal window. The mtype is GET. I will look into setting via `postData`. — Lothar, Jan 24 '12 at 14:29
It seems that the usage of `postData` with methods is the best way. I asked you *where* is the "reset" buttons because if it is inside of jqGrid navigator or somewhere near to the grid then `grid_id` can be calculated based on `this` in the `$('.reset').click` handler. Next I didn't understand why you need to use `eval` at all, because `grid_id + '_url'` seems to get the correct results. The code fragment starting with `// ex. id='foo_filter'` is difficult to understand because it's unclear the context where it's used and so which is `this` value. I suppose that the code can be also simplified — Oleg, Jan 24 '12 at 15:02

score 2 · Accepted Answer · answered Jan 24 '12 at 08:58

2

Use a map to store URLs, not local variables.

var URLs = {
    foo: url_path + '?input=moduleone&param=1',
    bar: url_path + '?input=moduleone&param=2'
};

jQuery('.reset').click(function() {
    //do stuff...
    var url = URLs[grid_id];
    jQuery('#foo').setGridParam({url:url}).trigger('reloadGrid');
});

answered Jan 24 '12 at 08:58

Joe Coder

4,498
31
41

DOes this have something to do with using those square brackets? Does that enable you to get around using eval for some reason? – Lothar Jan 24 '12 at 09:00
1

Without `eval` you are passing the STRING "foo_url" (literally), not the value of the `foo_url` variable. With `eval`, you are `eval`-uating `foo_url` which means getting the value of the `foo_url` variable. – bububaba Jan 24 '12 at 09:02
Yes. JavaScipt syntax allows both dot-notation and bracket-notation for map property lookups. Your previous approach was a local variable lookup by string, which requires interpreter access (ie, evil invocation). – Joe Coder Jan 24 '12 at 09:02

Using eval to assign a variable to a method. How else should I do it?

1 Answers1