Question

I am building a survey tool that will have different layouts and ‘inquisitorial’ processes depending on the part and actual question that the user is responding too. I am building this in Coldfusion and I am using jQuery UI elements to present questions however this will lead to ui elements embedded in ui elements.

The order in which the UI elements are constructed or triggered is going to be the reverse order that they are presented in the html, so the innermost element has to be triggered first. There is a master page that has the logic that looks up the database for the question information and the specific page layout to use, which is then <cfinclude'd, this layout page may have say tabular UI elements

My solution to this has been to declare an array of UI html node names (DIV tags) along with the UI construction method. Each included element then “pushes” it’s UI information into this array.

var inst_triggers = new Array()
inst_triggers.push("#accordion@@accordion()")

finally when everything is assembled I need to trigger these UI elements, so in the master page I do the following.

$(function() {
    var it = inst_triggers.reverse();
    var it_len = it.length;

    for (e=0;e<it_len;e++){
        var trig_parts = it[e].split('@@');
    //do the jQuery UI element trigger here
    var eval_str = '$("'+trig_parts[0]+'").'+trig_parts[1];
    eval(eval_str);
    }

});

As we know “eval() ” is evil so I need an alternative to trigger or construct these page elements
Something like jQuery.uistuff.method('accordion'), but I cannot see this in the documentation (or at least I have not understood what I have read which is more likely)

Any suggestions, pointers further reading or references would be GREATLY appreciated.

Regards thanks to the collective neural network in advance !

Gus

Answer 1

Given the approach that you have posted, I’m not sure why you are using the @@ and splitting on it in order to determine your components. You could just as easily push an object to the “inst_triggers” array:

var inst_triggers = [];
inst_triggers.push({selector:"#accordion", method: "accordion"});

$(function() {
    var it = inst_triggers,
        it_len = it.length;

    it.reverse()

    for ( e=0; e < it_len; e++ ) {
        $(it[e].selector)[it[e].method]();
    }
});

example: http://jsfiddle.net/bstakes/uBpk5/