create a unique id for select tag id when new row of data is added to a table

Question

My title is pretty accurate to my problem but I think I may be barking up the wrong tree with the solutions I've been trying. I'm new to javascript and web development in general so forgive me for my lack of verbiage.

My program creates a new row of data when a part is selected from a drop-down menu. The rows populate with the data from an SQL table with information about the selected part such as: category, part_name, price etc. One of the td elements in the table is a drop-down to change the quantity that looks like this

    <td>

      <select data-id = <?php echo $row["part_id"];?> id = "qty_dropdown"> 

      <option value = '1'> 1 </option>  

      <option value = '2'> 2 </option> 

      <option value = '3'> 3</option> 

      <option value = '4'> 4 </option> 

      <option value = '5'> 5 </option> 

      <option value = '6'> 6 </option> 

      <option value = '7'> 7 </option> 

      <option value = '8'> 8 </option> 

      <option value = '9'> 9 </option> 

      <option value ='10'> 10</option> 

      </td> </select>

This sits inside a loop that I use to get the data from the SQL table. My problem is figuring out how to get the selected value of quantity when the id for each row is always "qty_dropdown". I think I need to add a unique identifier at the end of the id, "qty_dropdown" so when a new row is created, the id of the select drop-down becomes something like, "qty_dropdown1" and so on.Also, data-id is the part id of the selected row so there's a possibility I could use that as part of my unique As I said, I'm not sure if I'm barking up the wrong tree and I definitely don't have too much experience. There may be a much easier way to solve this problem. Hopefully I'm explaining my problem well enough to understand. Let me know if you need to see more of my code. Thank for the help!

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

If your selects are created inside a loop you might want to use name instead of id. Ids are meant to be unique. If you use the name property you can access them on the client side in javascript space by using

var selectLists = document.getElementsByName("qty_dropdown");
var firstSelectList = selectLists[0];

create a unique id for select tag id when new row of data is added to a table

Sign up