jquery to create advanced search query builder

Question

I am a newbie with javascript programming, but I found this javascript (MooTools) based query constructor very useful to implement in the website I am working on.

The live implementation can be found here http://opl.bibliocommons.com/search

I believe the same functionality is possible to achieve using jquery. I am looking at pointers on how to start! For eg the MooTools integrated js file instantiates a new Class and binds events to various form elements. How should this be replaced if I am using jquery?

Appreciate your ideas.

Balu

Answer 1

You can duplicate class functionality in jQuery and then bind events to different form elements just the same, you just need to get the syntax right:

$(function(){

Init = new function(){
    this.construct = function(){
        Actions.bind();
    }
}

Actions = new function(){
    this.bind = function(){
        $("#selector1").bind("click", function(){
            Actions.doActions();
        });

        $("#selector2").bind("change", function(){
            Actions.doActions();
        });
    }

    this.doActions = function(){
        //Do generic stuff here
    }
}

Init.construct();

});