Question

My application is in ASP.net MVC3.

I have a table of elements. An element can have child elements, but a child element cannot. In the table, if the element has children, they are listed in a ul. A user can select the items in the list to remove it from that parent. When this happens, the element is removed from the list, and a partial view is rendered that makes a new row in the table for that element since it is no longer a child. Elements that are not children and don’t have children of their own are able to be combined with other elements by selecting the element you want to combine it with from a dropdown. My problem is that when you remove an element from a parent, the dropdown created for the table row in the partial view does not have the functionality needed.

I think that this may be due to the fact that my javascript function to combine elements is in the $(document).ready(function () {...}); and that dropdown is no there on page creation.

is there a way to add my $('.combineDropdown').change(function () {...}); to an element that has been created dynamically?

Answer 1

Why use jQuery at all for this? You can acheive the same result by outputting the dropdown with the onChange html attribute pointing to a javascript function to be executed.

Example:

<select onChange="myFunction(this)"><option>...</option></select>