I have a change event that is working fine but I need to get it to recurse.
So I have a function that is triggered on change that will "change" other drop downs based on a class selector (notice "drop downS", there could be more than one). This proxy change does not trigger the function and so fails. How can i get it to work?
$(document).ready(function () {
var activeDropBox = null;
$("select.drop-box").change(function () {
var questionId = $(this).attr("questionId");
var selectedAnswer = $(this).val();
activeDropBox = this;
alert(this.questionId);
$.ajax(
{
type: "POST",
url: answerChangedActionUrl,
data: { questionId: questionId, selectedValue: selectedAnswer },
success: function (data) {
SetElementVisibility(data.ShowElement, questionId);
}, error: function (XMLHttpRequest, textStatus, errorThrown) {
alert('XMLHttpRequest:' + XMLHttpRequest.responseText);
alert('textStatus:' + textStatus);
alert('errorThrown:' + errorThrown);
}
});
});
function SetElementVisibility(visible, questionId) {
// I would like each child to then trigger the change event...
$(".childOf" + questionId)[visible ? 'show' : 'hide']('slow');
// Suggested code
//$(".childOf" + questionId + " select").trigger("change");
if (!visible) {
$(".childOf" + questionId + " select").attr('selectedIndex', 0);
}
}
}
The suggestions so far seem to work, but as the change event triggers an ajax post it now seems to fail here. I'm going to play around with it but that is something for another question I feel.
This question is related to
javascript
jquery
javascript-events
Use the trigger() method
$(selector).trigger("change");
for me $('#element').val('...').change()
is the best way.
The parameterless form of the change() method triggers a change
event. You can write something like:
$(document).ready(function() {
$("#yourInitialElementID").change(function() {
// Do something here...
$(".yourDropDownClass").change();
});
});
$(selector).change()
Longer slower alternative, better for abstraction.
$(selector).trigger("change")
Use That :
$(selector).trigger("change");
OR
$('#id').trigger("click");
OR
$('.class').trigger(event);
Trigger can be any event that javascript support.. Hope it's easy to understandable to all of You.
Source: Stackoverflow.com