CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Sam Carleton
Sam Carleton

Reputation: 1398

JQuery, how to find conditional list of div's with similar ID

I have a structure of html like this:

<input id="trigger0" type="hidden" value="Zero" />
<input id="trigerId0" type="hidden" value="8" />
<input id="trigger1" type="hidden" value="One" />
<input id="trigerId1" type="hidden" value="-1" />
<input id="trigger2" type="hidden" value="Two" />
<input id="trigerId2" type="hidden" value="6" />
<input id="trigger3" type="hidden" value="Three" />
<input id="trigerId3" type="hidden" value="4" />Testing:
<div >value</div>
<input type="text" name="fname" id='finalValue' size='200'>

I know that $("[id^='trigger']") will get all four trigger inputs. Is it possible to create a jQuery statement that will only return the trigger where the corresponding trigerId is NOT -1, in the code above, that would be trigger1, trigger3, and trigger4

Thanks in advance

Sorry folks, I cut/paste the wrong id, need to look at the trigerId values to determine if a trigger should be returned. In the real situation, the names are NOT the same, so I removed a g from trigerId to make sure $("[id^='trigger']") didn't get the trigerId.

Upvotes: 0

Views: 72

Answers (4)

Karl Wilbur
Karl Wilbur

Reputation: 6187

You could just use the attribute selector like this:

$('[id ^= "triggerId"][value != "-1"]')

EDIT:

Oh! You want the id='trigger# for the matched id='triggerId#. Do this:

var triggers = [];
jQuery('[id^="triggerId"][value!="-1"]').each(function() {
  var id = jQuery(this).attr('id').replace(/[^0-9]+/, '');
  triggers.push( jQuery('#trigger'+id) );
});

Upvotes: 0

Sam Carleton
Sam Carleton

Reputation: 1398

This is what I was looking for:

var finalValue = document.getElementById('finalValue'); 
$('[id^="trigger"]').
filter(function (index) {
    return $("#trigerId" + index).val() > -1;
}).
each(function (e, i) {
    finalValue.value = finalValue.value + " " + e + ":" + this.value
});

Upvotes: -1

Pranav C Balan
Pranav C Balan

Reputation: 115222

You can use filter() to filter from jQuery object

$('[id^="triggerId"]').filter(function() {
  return this.value != '-1';
}).each(function() {
  console.log(this.value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="trigger0" type="hidden" value="???" />
<input id="triggerId0" type="hidden" value="8" />
<input id="trigger1" type="hidden" value="???" />
<input id="triggerId1" type="hidden" value="-1" />
<input id="trigger2" type="hidden" value="???" />
<input id="triggerId2" type="hidden" value="6" />
<input id="trigger3" type="hidden" value="???" />
<input id="triggerId3" type="hidden" value="4" />

Upvotes: 0

AmmarCSE
AmmarCSE

Reputation: 30557

Use :not() while applying the condition to the value attribute itself

$('[id^="triggerId"]:not([value="-1"])') 


console.log($('[id^="triggerId"]:not([value="-1"])') );
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="trigger0" type="hidden" value="???"/>
<input id="triggerId0" type="hidden" value="8"/>
<input id="trigger1" type="hidden" value="???"/>
<input id="triggerId1" type="hidden" value="-1"/>
<input id="trigger2" type="hidden" value="???"/>
<input id="triggerId2" type="hidden" value="6"/>
<input id="trigger3" type="hidden" value="???"/>
<input id="triggerId3" type="hidden" value="4"/>

Upvotes: 2

Related Questions