CODEWITHSUNDEEP
javascriptjqueryhtml
Jr. Developer
Jr. Developer

Reputation: 67

Get Input Value Has Same id and name

I want get value with jQuery. I have some inputs has same id and same name. I need to get value comparing with input value. Example: 

<script>
  var num=$("#number").val();
  if(num > 0 && num <= 10)
  {
    //get value input id==1 and input name==low
    //get value input id==2 and input name==low
  }
  if(num > 10 && num <= 50)
  {
    //get value input id==1 and input name==med
    //get value input id==2 and input name==med
  }
</script>

<input id="number" type="text" />

<input id="1" name="low" type="hidden" value="15" />                
<input id="1" name="med" type="hidden" value="20" />
<input id="1" name="high" type="hidden" value="30" />

<input id="2" name="low" type="hidden" value="25" />                
<input id="2" name="med" type="hidden" value="40" />
<input id="2" name="high" type="hidden" value="30" />

Upvotes: 1

Views: 115

Answers (1)

Mamun
Mamun

Reputation: 68933

The attribute id must be unique in a document, use class instead. You can use the class with name attribute selector on input event like the following way:

$('#number').on('input', function(){
  console.clear(); // clear the previous output
  var num=$(this).val().trim();
  if(num > 0 && num <= 10){
    var low = $('.1[name=low]').val();
    console.log(low);
    var low2 = $('.2[name=low]').val();
    console.log(low2);
  }
  if(num > 10 && num <= 50){
    var med = $('.1[name=med]').val();
    console.log(med);
    var med2 = $('.2[name=med]').val();
    console.log(med2);
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="number" type="text" />

<input class="1" name="low" type="hidden" value="15" />             
<input class="1" name="med" type="hidden" value="20" />
<input class="1" name="high" type="hidden" value="30" />


<input class="2" name="low" type="hidden" value="25" />             
<input class="2" name="med" type="hidden" value="40" />
<input class="2" name="high" type="hidden" value="30" />

Upvotes: 2

Related Questions