Welcome Guest, Not a member yet? Register   Sign In
jQuery Autocomplete - Passing Extra Parameters
#1

[eluser]Kyle Johnson[/eluser]
Ran into an interesting problem. I downloaded and slightly modified the autocompleter library to allow for POST data instead of GET data.

I didn't change anything else about the library. *Edit* I also disabled caching by commenting out a few lines.

So I am trying to have a autocomplete input box send off for its data, but I wanted to pass some optional extra parameters to it. The autocompleter library allows for this, but for some reason my 'serial' argument is being ignored, well it is passing an empty string to the POST data. (I downloaded Firebug 1.3 for Firefox so that I can verify the POST data).
Code:
$(document).ready(function(){
    $("#model").autocomplete(
        "/ci/ajax/master_model_id/",
        {
            onItemSelect:selectItem,
            //onFindValue:findValue,
            //formatItem:formatItem,
            extraParams:{"serial":$("#serial").val()+'as', "a":"testing"}, // why is the .val() not returning the value? it will pass 'as'
            delay:200,
            selectOnly:true,
            mustMatch:1
        }
    );
});

*** Slight update ***
I found out that the $("#serial").val(); only passes the initial value set to the form element with id="serial". Why is it not returning the most current value? Is it related to the function being withing the $(document).ready() event?
*** End update ***


The unmodified version can be found here.

modified code here
Code:
function requestData(q) {
        if (!options.matchCase) q = q.toLowerCase();
        var data = options.cacheLength ? loadFromCache(q) : null;
        // recieve the cached data
        if (data) {
            receiveData(q, data);
        // if an AJAX url has been supplied, try loading the data now
        } else if( (typeof options.url == "string") && (options.url.length > 0) ){
            $.post(options.url, jQuery.extend({p:q}, options.extraParams), function(data) {
                data = parseData(data);
                //addToCache(q, data);
                receiveData(q, data);
            });
        // if there's been no data found, remove the loading class
        } else {
            $input.removeClass(options.loadingClass);
        }
    };

second modified function
Code:
this.findValue = function(){
        var q = $input.val();
        alert(q);
        if (!options.matchCase) q = q.toLowerCase();
        var data = options.cacheLength ? loadFromCache(q) : null;
        var data = null;
        if (data) {
            findValueCallback(q, data);
        } else if( (typeof options.url == "string") && (options.url.length > 0) ){
            $.post(options.url, jQuery.extend({p:q}, options.extraParams), function(data) {
                data = parseData(data)
                //addToCache(q, data);
                findValueCallback(q, data);
            });
        } else {
            // no matches
            findValueCallback(q, null);
        }
    }
#2

[eluser]Kyle Johnson[/eluser]
I upgraded from the previous version to this version found at:
http://bassistance.de/jquery-plugins/jqu...ocomplete/

It seems to be much more confusing (in terms of coding) but I've figured out part of it at least.

Code:
$("#model").autocomplete(
        "/ci/ajax/master_model_id/",
        {
            extraParams: {serial: function() { return $("#serial").val(); } },
            delay:200,
            selectOnly:true,
            mustMatch:1
        }
    );

I think that would have worked on the older version as well, but there are other subtle improvements in the current library.




Theme © iAndrew 2016 - Forum software by © MyBB