my problem sounds pretty simple. I have divs with no id and class specified like this
<div style="position:relative; float:left">
<input type="text" onfocus="renderCalendar(event);" size="50" id="cal" name="cal">
<div class="wrappercal calwrapper">
<div class="yearmonth">
<table class="caltable"><tbody>
<tr><th width="80%" scope="col" colspan="5">
<select class="dtcombo year" onchange="changeCalendar()">
<option value="2000">2000</option>
<option value="2001">2001</option>
</select>
<select onchange="changeCalendar()" class="dtcombo month">
<option value="1">1</option>
<option value="2">2</option>
</select></th>
</tr>
</tbody>
</table>
</div>
</div>
</div>
There may be several similar divs in the page
I have a javascript function
function renderCalendar(event){
var triggerer=event.target.id; // THIS WILL GIVE THE ID OF TEXTBOX THAT TRIGGERED THIS FUNCTION.
$("#"+triggerer).parent().children(".wrappercal").children(".yearmonth").children(".caltable").children(".year").val(); //not working
}
The nest follows like this
Parent Div > wrappercal(div) > yearmonth(div) > caltable(table) > year(select)
my problem is to get value of combo with class “year” of the parent div of textbox that triggered the function.
Can anybody figure out where i went wrong? any suggestions?
P.S. Please bear I m not good with dom elements.
Thanks
Why not try this?
Can you check (using
console.log(event.target)and tracking) that the target element is really what/where it should be?EDIT
The problem is that
children()only searches through one level (deep) of child nodes and there is multiple levels between.caltableand.year(<tr><th>...). Usefind()instead (which will search recursively through your nodes). 😉See this for more info.