jQuery .val() Selector Confusion
- by Matt Dawdy
I've kind of written myself into a corner, and was hoping there was an "easy" way out. I'm trying to loop through a series of things on my page, and build a key:value pair. Here is my structure:
<div class="divMapTab" id="divMapTab34">
<div class="divFieldMap">
<select class="selSrc" id="selTargetnamex"><options....></select>
</div>
</div>
<div class="divMapTab" id="divMapTab87">
<div class="divFieldMap">
<select class="selSrc" id="selTargetnamex"><options....></select>
</div>
</div>
It's way more complicated than that, and there are many select elements inside of each divFieldMap div.
Here is my JS function that is building my string:
function Save() {
var sSaveString = '';
$('.divMapTab').each(function() {
var thisId = this.id;
$('.selSrc', "#" + thisId).each(function() {
var thisSubId = this.id;
//alert(thisSubId); <-- HERE IS THE PROBLEM
var sTargetCol = thisSubId.replace('selTarget', '');
var sValue = this.val();
sSaveString += sTargetCol + '¸' + sValue + '·';
});
});
}
On the line that has the alert box and the text "HERE IS THE PROBLEM" is that I'm trying to get the selected value of the "current" select input element, but the id of that element isn't unique (I thought it would be, but I screwed up). Is there a good way, inside of an "each" type of jQuery statement, to use "this" to get the exact select element that I really am looking for, even if it doesn't have a unique id?