CmdrTallen
CmdrTallen

Reputation: 2282

Applying jQuery function to dynamically added item

When adding a new textbox via jQuery append() function it appears jQuery is unable to apply a function to that textbox;

            $("#ulList").append("<li><span class=\"ui-icon ui-icon-circle-close remove\"/><em class=\"selectedWord\">" + selectedWord + "</em><input class=\"acf acfb-input ac_input\" type=\"text\" id=\"" + name + "\" name=\"" + name + "\" value = '' /></li>");

            $("#" + name).autoCompletefb();

The function I am attempting to apply to the newly added input is the autoCompletefb() method but it seems jQuery is unable to find the newly added object.

Ideas?

Upvotes: 0

Views: 408

Answers (3)

splatto
splatto

Reputation: 3217

Make sure that your dynamically added input item is fully loaded before trying to access it on the page. also, do you have a variable mixup? You use "name" as a variable in the first line as "formattedName" as the variable in the second line.

Upvotes: 0

Tyler Carter
Tyler Carter

Reputation: 61557

You have a spare semicolon in the wrong place

 $("#ulList").append("<li><span class=\"ui-icon ui-icon-circle-close remove\"/><em class=\"selectedWord\">" + selectedWord + "</em><input class=\"acf acfb-input ac_input\" type=\"text\" id=\"" + name + "\" name=\"" + name + "\" value = \"\" />" + "</li>");

Upvotes: 1

Paolo Bergantino
Paolo Bergantino

Reputation: 488394

You're giving the input an ID of the contents of the name variable and selecting an element with an id of the contents of the formattedName variable. What is the difference between the two? The code would work if they are the same.

Besides that, you have a JS error near the end of the append() call:

value = \"\" />";+ "</li>");

Probably want it to be:

value='' /></li>");

Upvotes: 1

Related Questions