Aaron Palmer
Aaron Palmer

Reputation: 9012

Need help understanding jQuery .val() function

alert("data going into $hidden: " + selected.data[1]);

hidden.val(selected.data[1]);

alert("data now in $hidden: " + $hidden.val());

What would be a reason that $hidden.val() in the last line above would return undefined? I have verified that selected.data[1] contains an integer value.

Edit #1: Some additional context per comments: ($hidden is a hidden input field)

$.fn.extend({
    autocomplete: function(urlOrData, hidden, options) {
        var isUrl = typeof urlOrData == "string";
        var $hidden = $(hidden);
        options = $.extend({}, $.Autocompleter.defaults, {
            url: isUrl ? urlOrData : null,
            data: isUrl ? null : urlOrData,
            delay: isUrl ? $.Autocompleter.defaults.delay : 10,
            max: options && !options.scroll ? 10 : 150
        }, options);

        // if highlight is set to false, replace it with a do-nothing function
        options.highlight = options.highlight || function(value) { return value; };

        // if the formatMatch option is not specified, then use formatItem for backwards compatibility
        options.formatMatch = options.formatMatch || options.formatItem;

        return this.each(function() {
            new $.Autocompleter(this, options, $hidden);
        });

and...

$.Autocompleter = function(input, options, $hidden) {
        //... 

        function selectCurrent() {
            var selected = select.selected();
            if (!selected)
                return false;

            var v = selected.result;
            previousValue = v;

            if (options.multiple) {
                var words = trimWords($input.val());
                if (words.length > 1) {
                    v = words.slice(0, words.length - 1).join(options.multipleSeparator) + options.multipleSeparator + v;
                }
                v += options.multipleSeparator;
            }


            alert("data going into $hidden: " + selected.data[1]);

            $hidden.val(selected.data[1]);

            alert("data now in $hidden: " + $hidden.val());

Edit #2: More details.... I'm trying to use the jQuery autocomplete extension on a form with multiple textbox controls (each implement the autocomplete). There's a seperate button on the form beside each textbox that submits the form to a handler function that needs to find the value of the item selected and save it to the db. The way I thought to go about this was to include a hidden field on the form to hold the selected value.

Upvotes: 1

Views: 4663

Answers (2)

Aaron Palmer
Aaron Palmer

Reputation: 9012

Thanks Paolo Bergantino. I discovered that I wasn't passing the initial hidden in with a # in front of the hidden field id, so $hidden was never getting set properly. It was difficult for me to debug because the the autocomplete is inside an ascx control as an embedded resource. Once I ensured that the value of hidden was including the # it worked properly.

Upvotes: 1

Daniel Von Fange
Daniel Von Fange

Reputation: 6071

Could $hidden be a checkbox that is not checked?

Upvotes: 0

Related Questions