JQuery : How to call an inside plugin function with a <a href> generated by another function of this plugin?

Question

Hello everyone,

I'm making a little widget for my site using a search api I just made. Briefly, I want to retrieve last posts or top rated posts. I've got to tabs for that.

By default, on loading, I'm on recent posts. If I click on Top posts, I'd like to call a function inside my plugin that modify a var that tell to my search API to retrieve data in the right order.

I don't know if I'm very clear.. Please, take a look at my (simplified) code :

jQuery.fn.Widget=function(id_place,id_event,options){

// here, i tell that by default, you have to load latest posts
    var defaults = {
         launch : '1',   // in seconds
         max : '10',    // nmber posts to retrieve
         sort : 'last'
    };
    var options = $.extend({}, defaults, options);


// here the function I'd like to call to change the options.sort used to call the search API
    var change_tab = function(sort) {
        switch(sort){
            case 'last' : active[0] = ' class="active"'; break;
            case 'top' : active[1] = ' class="active"'; break;
            case 'info' : active[2] = ' class="active"'; break;
                        default: break;
        }
        options.sort = sort;
    }

// here, I try to call the change_tab function above, inside my plugin  
    $(".sort_top").click(function(){
        Widget(id_place,id_event,options).change_tab('top');
    }) ;

// here, an extract of me tab menu of my widget. With the link to change sorting method
    $("#myWidget").html('<a href="javascript:;" class="sort_top"><li'+active[1]+'>Top Questions</li>');


// here, I retrieve data an arrange it  
    jsonp_callback = function(data) {
        if ( data['results'].length > 0 ) {
            // do something
        }
    }

// here, I call my search API, with the param sort to retrieve data by time or popularity   
    widget_search = function() {

        $.ajax({
          dataType: 'jsonp',
          data: 'mydata&callback=?',
          jsonpCallback: 'jsonp_callback',
          url: 'http://myserver.com/search.php',
          success: function () {
          },
        });
    }

// call the getJSON and refresh function
    setTimeout("widget_search()",1000*options.launch);
    var auto_refresh = setInterval( function () { widget_search(); }, 1000*options.refresh);

};

Answer 1

Should be as easy as passing a variable on the data: section of the Ajax query, which will be passed to your data source as a GET (by default) You'd just condition your query to return the appropriate data based on this variable, then display it on the div of your choice as you're already seeming to do.