Hi there, I have a table that looks like this:
The user can click the 'Add another category' link and another row is inserted. My issue is here: those two select boxes are linked, meaning that depending on what is chosen from the first one, the options are changed in the second one. When I clone this row, the new cloned row doesn't work properly - the first select box ('Publication') changes ALL of the 'Categories' choices in the second column. My HTML is structured so that the table row contains each of the possible <select> elements, each given an ID that corresponds to an ID number in the Publication <select>. For example, the Publication dropdown HTML is: <select name="publicationID" id="publicationID"> <option value="01" onClick="showSubMenu('0');"> Publication </ option> <option value="21" onClick="showSubMenu('21');"> Student </option> <option value="40" onClick="showSubMenu('40');"> Contract </option> <option value="99" onClick="showSubMenu('99');"> All Publications </ option> </select> As a result, I have 4 hidden select boxes corresponding to each of these Publication choices. Make sense? I feel like there must be a better way to organise this - can anyone advise me on how to do it? Above all, I can't seem to target the newly- cloned select boxes without grabbing them all. Thanks, Matt