Question

I have two span’s which contain a HTML text box with same id say “field1”. Based on a drop down value, only of these two span’s are shown in the screen at a given time. Either one of the span’s is shown or none of them are shown.

I am using .hide(); and .show(); in prototype js to show and hide these span’s based on the drop down value. But whenever I try to get the value by $F('field1'); on submit, I only get the first HTML text box’s value(which is empty).

Is there a way I can solve this to get the value of visible HTML text box value?

Answer 1

Use class. ID for an element should be unique as it’s an ID 😉

1. select all elements with specified class name. you will get an array of elements having specified class name.

   var eleCollection = document.getElementByClassName("anyClassName");
   

2. After this, u can loop through this array of elements and get their values

   for(element in eleCollection) {
       var thisValue = element.getAttribute("value");
      console.log("Element: ",element," value: ",value);
   }