views:

53

answers:

3

With this code:

function setupRow(event, ui) {
        var textbox, // how do i get to the textbox that triggered this? from there
        // on i can find these neighbours:
        hiddenField = textbox.next(), 
        select = textbox.parents('tr').find('select');

        textbox.val(ui.item.Name);
        hiddenField.val(ui.item.Id);
        $.each(ui.item.Uoms, function(i, item){
            select.append($('<option>' + item + '</option>'));
        });             
        return false;
    }
    function setupAutoComplete(){
        var serviceUrl = "/inventory/items/suggest";
        $("input.inputInvItemName").autocomplete({
            source: function(request, response) {
                $.ajax({
                    url: serviceUrl,
                    data: request,
                    dataType: "json",
                    success: function(data) {
                        response($.map(data.InventoryItems, function(item) {
                            return {
                                value: item.Name
                            };
                        }));
                    },
                    select: function(event, ui) {
                        setupRow(event, ui);
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert(textStatus);
                    }
                });
            },
            minLength: 3,
            delay: 500
        });
    }

everything seems ok. Problem is the select handler never fires, not even the anonymous function that wraps my original delegate setupRow for debugging purposes is ever called.

anyone can see my error?

I also left a question in the comment: how do I get to the textbox that had the autosuggestion. Cannot use id here, because these text boxes are multiples and generated on the fly, interactively. Or is there another way to do the same thing?

Thanks for any help!

A: 
Kai
Sorry, I think you did not see the whole code, it is a scrollable div and might have cut away essential parts.$('.ui-autocomplete-input') would give me all of them, but I just need the active one.
Jan Limpens
+1  A: 

OP point of view

var textbox, // how do i get to the textbox that triggered this? from there
        // on i can find these neighbours:

My Point of view

have you tried,

var textbox = $(event.target);

or you can do this,

OP point of view

select: function(event, ui) {
       setupRow(event, ui);
},

My point of view

select: setupRow;

then

var textbox = this; // just a guess... wait.. 
Reigel
not yet, because I never reached that piece of code. But sounds reasonable enough!
Jan Limpens
yes, I use setupRows that way, but just to make super sure everything was right i wrapped it in this dummy function..._this_ could work, too, you are right...
Jan Limpens
A: 

ok, got a step closer by using

inputs.bind("autocompleteselect", setupRow);

now setupRow fires.

Now it seems, that the success callback transforms the data, I get returned.I need to find a way, to both display the right value in the dropdown, without destroying the requests response...

Any ideas?

Jan Limpens
You should append the original question with an "EDIT:" and this rather than posting as an answer to keep the relevent info together and not have this obscured by possible answers that are upvoted.
Mark Schultheiss
ok, I'll do that
Jan Limpens