dynamically adding parameters to the query

Lacrymology's Avatar


01 Apr, 2011 07:24 PM

I want to do this, but that $(this).attr() won't work.

        extraParams: "&action=suggest-submit&lookFor="+$(this).attr('data-lookfor'),

This is what I've tried, to check what's going on:


// extraParams: "&action=suggest-submit&lookFor="+this.getAttribute('data-lookfor'), // extraParams: "&action=suggest-submit&lookFor="+$(this).attr('data-lookfor'),

        start: function(){

both commented lines yield some error when uncommented, but that start function works fine, so the problem is that "this" doesn't exist in the context where it's used, so is there a way to do that? or to achieve it otherwise, anyways.. each input text field of the suggestable class has a data-lookfor property that needs to be sent to the ajax responder so it knows what kind of data is being looked for, that's all I need

  1. 1 Posted by Lacrymology on 01 Apr, 2011 07:26 PM

    Lacrymology's Avatar

    made a mistake with formatting up there, but the lines that don't work are both tries with the extraParams option in that second code block that got cut in half, sorry

  2. 2 Posted by shogo2040 on 15 Aug, 2012 11:02 PM

    shogo2040's Avatar

    I don't have a solution, but I have a "guess" on where the problem is inside the plugin.

    After some research, its not really just extraParams, but options in general seem to require some extra work for dynamic changes.

    Looking at extraParams, this option is binded only once within this code block of the plugin:

     return this.each(function(x){

    so when you dynamically change opts.extraParams, somehow we need to get the binding to run again so that the private method keyChange() will run and initialize the getJSON call with the new extraParams.

    How can we achive this?

    For similiar issues, I see others working around this by using javascript's built in "call" method, but currently, I don't understand this concept and I need to do more research on approaches such as this:


    If anyone can explain if we can use a similiar approach to dynamically add parameters, please join in!

  3. 3 Posted by shogo2040 on 16 Aug, 2012 10:20 PM

    shogo2040's Avatar

    I have a "workaround". Sorry this is not elegant but it will work. It requires that you:

    A. use the asHtmlID option.
    B. call the autocomplete plugin each time you change the option's extraParams

    My approach involves using html5's data attribute (for some reason I had issues using jQuery's $.data wrapper) and the approach is to attach extraParams to the input element of the plugin and to keep it updated in the following way:

    1. First find the if statement and add the following data-extraParams line

       if((d_type == "object" && d_count > 0) || d_type == "string"){
           $('#' + opts.asHtmlID).attr('data-extraParams', opts.extraParams);
    2. Change the getJSON call to use the html5 data attribute instead of the options extraParams:
      $.getJSON(req_string+"?"+opts.queryParam+"="+encodeURIComponent(string)+limit+$('#' + opts.asHtmlID).attr('data-extraParams'), function(data){

    I don't understand why the original opts.extraParams is locked on the value it was assigned the first time autosuggest was called, and does not use the new values after changing them, hence my html5 data workaround. I'm open to a better solution, but for now I'll have to use this one.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac