jQuery ajax form submit - how to ensure dynamically loaded form's action is used
- by kenny99
Hi, i'm having a problem with dynamically loaded forms - instead of using the action attribute of the newly loaded form, my jquery code is still using the action attribute of the first form loaded. I have the following code:
//generic ajax form handler - calls next page load on success
$('input.next:not(#eligibility)').live("click", function(){
$(".form_container form").validationEngine({
ajaxSubmit: true,
ajaxSubmitFile: $(this).attr('action'),
success : function() {
var url = $('input.next').attr('rel');
ajaxFormStage(url);
},
failure : function() {
}
});
});
But when the next form is loaded, the above code does not pick up the new action attribute. I have tried adding the above code to my callback on successful ajax load (shown below), but this doesn't make any difference.
Can anyone help? Many thanks
function ajaxFormStage(url)
{
var $data = $('#main_body #content');
$.validationEngine.closePrompt('body'); //close any validation messages
$data.fadeOut('fast', function(){
$data.load(url, function(){
$data.animate({
opacity: 'show'
}, 'fast');
');
//generic ajax form handler - calls next page load on success
$('input.next:not(#eligibility)').live("click", function(){
$(".form_container form").validationEngine({
ajaxSubmit: true,
ajaxSubmitFile: $(this).attr('action'),
success : function() {
var url = $('input.next').attr('rel');
ajaxFormStage(url);
},
failure : function() {
}
});
});
});
});
