A question about ajaxSubmit
Hello;
I use AjaxSubmit to upload photos before the user submits the form. So when a user selects a photo, the script submits the form in a div. The form id is #template_form.
The issue is I "also" have a submit button in the form that I want it to submit the form normally without anything to do with Ajax. So when users click on submit, it takes them to the next page.
My problem now is the form gets submitted in the div no matter what (even when submit button is pressed).This is the script below. I believe I need to change $("#template_form").ajaxSubmit(options); part with something like $("#file_field").ajaxSubmit(options);
Can anyone give me some help? Thank you.
I use AjaxSubmit to upload photos before the user submits the form. So when a user selects a photo, the script submits the form in a div. The form id is #template_form.
The issue is I "also" have a submit button in the form that I want it to submit the form normally without anything to do with Ajax. So when users click on submit, it takes them to the next page.
My problem now is the form gets submitted in the div no matter what (even when submit button is pressed).This is the script below. I believe I need to change $("#template_form").ajaxSubmit(options); part with something like $("#file_field").ajaxSubmit(options);
Can anyone give me some help? Thank you.
- <script>
$(document).ready(function()
{
var options = {
beforeSend: function()
{
$("#progress").show();
//clear everything
$("#bar").width('0%');
$("#message").html("");
$("#percent").html("0%");
},
uploadProgress: function(event, position, total, percentComplete)
{
$("#bar").width(percentComplete+'%');
$("#percent").html(percentComplete+'%');
},
success: function()
{
$("#bar").width('100%');
$("#percent").html('100%');
},
complete: function(response)
{
$("#message").html("<font color='green'>"+response.responseText+"</font>");
},
error: function()
{
$("#message").html("<font color='red'> ERROR: unable to upload files</font>");
}
};
$("#template_form").ajaxSubmit(options);
});
</script>