ajax和多個表單不提交

試圖使用ajax/php提交多個表單，並且我想根據哪個表單更改成功輸出，並且根據哪種形式，php處理頁面的回顯也應該不同。我沒有成功。ajax和多個表單不提交

我的html：

<form method="post" class = "teacher_account_form" id="pay_form" name="pay_form">     
    <input type="text" id="hourly_pay"> 
    <button type="submit" id="work_submit" name="work_submit"></button> 
</form> 
<div id = "pay_output"></div> 
<form method="post" class = "teacher_account_form" id="edu_form" name="edu_form">     
    <input type="text" id="edu_level"> 
    <button type="submit" id="edu_submit" name="edu_submit"></button> 
</form> 
<div id = "edu_output"></div>

我的JS：（不正確的輸出發送到正確的格）

$(document).ready(function() { 

var button_clicked; 
var output_div; 
$('.account_submit').click(function() { 
    button_clicked = $(this).attr('id'); 
    switch (button_clicked) 
    { 
     case "work_submit": 
      output_div = "pay_output"; 
      break;    
     case "edu_submit": 
      output_div = "edu_output"; 
      break;    
    } 
}); 

var options = { 
type: 'post', 
url: "https://stackoverflow.com/users/p_teacher_account_work", 
success: function(response) { 
    $('#' + output_div).html(response); 
} 
}; 

$('form').ajaxForm(options); 

});

我的PHP（不發送回送消息）

public function p_teacher_account_work() { 

    // set up view 
    $this->template->content = View::instance('v_users_teacher_p_account_work'); 

    if (isset($_POST['work_submit'])) 
    { 
     echo "Your work details were added"; 
    } 

    } 
    else if (isset($_POST['edu_submit'])) 
    { 
     echo "education details updated"; 
    } 
}

來源

2013-12-13 compguy24

http://stackoverflow.com/questions/7998050/submitting-multiple-forms-with-ajax?rq=1 – 2013-12-13 04:51:26

首先對於$('.account_submit').click，您沒有account_submit類。

其次，提交按鈕將跳過你的jQuery。嘗試更改爲正常按鈕或捕獲事件。

第三，我會親自沿着

$("#pay_form").submit();

和

$("#edu_form").submit();

來源

2013-12-13 04:55:16

你忘了），在選擇結束的。 – thealfreds

@thealfreds謝謝搭檔 –

你必須reinitialize您form optionsclicking上button後，所以可以不用changing的divs像路由器去，

var options = { 
    type: 'post', 
    url: "https://stackoverflow.com/users/p_teacher_account_work", 
    success: function(response,statusText, xhr,jqForm) { 
     $(jqForm[0]).next('div').html(response); 
    } 
}; 

$('form').ajaxForm(options);

讀docs

來源

2013-12-13 04:59:18

ajax和多個表單不提交

回答

相關問題