運行Ajax查詢刷新與PHP文件

我目前正在一個多步驟的查詢表格上，可以發現格：http://jsfiddle.net/xSkgH/47/。運行Ajax查詢刷新與PHP文件

我試圖通過jQuery AJAX提交的變量（process.php將處理處理），並刷新DIV 最後一步與在process.php股利稱爲結果。我怎樣才能做到這一點？

我迄今爲止設法使用malsup（http://jquery.malsup.com/form/）使用jQuery表單插件來完成此操作，現在需要使用jQuery AJAX方法將其作爲嚴格的規範。

這是我一直在使用的代碼（與jQuery的形式插件）：

// prepare the form when the DOM is ready 

$(document).ready(function() { 
var options = { 
    target:  '#result', 
    beforeSubmit: showRequest, 
    success:  showResponse 
}; 

// bind to the form's submit event 

$('#task5_booking').submit(function() { 
    $(this).ajaxSubmit(options); 
    return false; 
    }); 
}); 

// pre-submit callback 

function showRequest(formData, jqForm, options) { 
    var queryString = $.param(formData); 
    // alert('About to submit: \n\n' + queryString); 
} 

// post-submit callback 

function showResponse(responseText, statusText, xhr, $form) { 
    $('#last-step').fadeOut(300, function() { 
    $('#result').html(responseText).fadeIn(300); 
    }); 
}

非常感謝！

來源

2012-04-16 CJS

使用jQuery.ajax處理的最後一步：

http://api.jquery.com/jQuery.ajax/

else if (whichStep == 'last-step') { 
     $.ajax({ 
      url:'urltophp.php', 
      data: {}, // your data 
      dataType: 'json', //your datatype 
      type: 'POST', //or GET 
      success: function(r) { 
       //your callback here... 
      } 
     }); 
    }

編輯：

$('#task5_booking').submit(function(e) { 
    $(e).preventDefault(); //prevent the default form submit() 

    var formData = $(this).serialize(); //serialize the form fields data... 


    $.ajax({ 
     url:'urltophp.php', 
     data: formData, // your data 
     dataType: 'json', //your datatype 
     type: 'POST', //or GET 
     success: showResponse 
    }); 

    //$(this).ajaxSubmit(options); 
    //return false; 
    //}); 
});

更改此：

function showResponse(responseText, statusText, xhr, $form) { 
    $('#last-step').fadeOut(300, function() { 
    $('#result').html(responseText).fadeIn(300); 
    }); 
}

要這樣：

function showResponse(responseText) { 
    $('#last-step').fadeOut(300, function() { 
     $('#result').html(responseText).fadeIn(300); 
    }); 
}

來源

2012-04-16 14:08:01 Ropstah

我已經更新的問題，以顯示我目前使用的方法。我怎樣才能將它實現到你提供的代碼中？ – CJS 2012-04-16 14:10:31

@CJS：請參閱更新的答案...... – Ropstah 2012-04-16 14:17:38

@CJS：請雙檢答案，我忽略了一些東西，再次更新... – Ropstah 2012-04-16 14:21:39

使用http://api.jquery.com/load/。這就像使用.ajax一樣簡單，並且符合您的要求。

$('#last-step').load(url, data, function(){})發送一個post請求，並填充'last-step'的html內容，並將任何url打印到響應html中。

來源

2012-04-16 14:15:15 Rodik

你能給我舉個例子嗎？ – CJS 2012-04-16 20:18:44

運行Ajax查詢刷新與PHP文件

回答

相關問題