Ajax表单进度重定向

Question

I have a form which I have been trying to get a progress bar to work on. This form is in joomla and I have managed to get a Ajax progress bar to show when a file is being uploaded. However the usual habit of the form is that when it has been submitted, it will go to item page the form is associated with and will give a confirmation on that page saying that yes it was saved.

However with this new Ajax progress bar, the bar gets to 100% and looking in firebug it shows that both the POST and GET were both successful but the problem is that the browser stays on the form page without the original redirect to the same GET url?

Some of the code is as follows:

    JHTML::_('behavior.mootools');
    JHTML::_('behavior.formvalidation');

    $document =& JFactory::getDocument();

    $document->addScript('components/com_component/assets/validate.js');
    $document->addScript('jquery-1.7.js');
    $document->addScript('jquery.form.js');
    $document->addScript('custom.js');

    <form action="index.php" method="post" name="nameForm" id="idForm" enctype="multipart/form-data" class="form-validate">
<input type="file" name="item_file" id="item_file"/></td>

Then in the custom.js

$(document).ready(function()
{

    $('#item_file').change(function(){
        $('#submit').removeAttr('disabled');
    });

    $('#submit').change(function(){
        $('#progress').removeClass('hide');
    });


    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>");
    },

    complete: function()
    {

    },

    error: function()
    {


    }

};

     $("#idForm").ajaxForm(options);
});

Is there anything I can add to the custom.js so that the default action or redirect will still take place when the upload progress bar is complete.

Thanks.

Answer 1

Change your on success call of Ajax to go to the destination page:

  success: function()
    {
        $("#bar").width('100%');
        $("#percent").html('100%');
        //Go to new page
        window.location.href= 'index.php';

    },