使用AJAX將表單數據提交到PHP

我有一個問題，顯示一些動態創建的數據，並顯示完成後，提交的數據。使用AJAX將表單數據提交到PHP

HTML - form.html

<form name="myForm" id="myForm"> 
     <strong>Skills 1</strong>  
      <div> 
       <select name="Skills[]" id="Skills"> 
       <optgroup label="Programming"> 
        <option value="">-</option> 
        <option value="Javascript">Javascript</option> 
        <option value="C++">C++</option> 
        <option value="C#">C#</option> 
       </optgroup> 

       <optgroup label="Multimedia"> 
        <option value="Adobe Flash MX">Adobe Flash MX</option> 
        <option value="Adobe Fireworks">Adobe Fireworks</option> 
        <option value="Adobe After Effects">Adobe After Effects</option> 
       </optgroup> 
       </select> 
      </div> 

      <div> 
       <input type="text" name="SkillsNumber[]" id="SkillsNumber" placeholder="Number of year using" /> 
      </div> 

      <div> 
       <select name="SkillsGrade[]" id="SkillsGrade"> 
        <option value="">Select your skills grade</option> 
        <option value="Noob">Noob</option> 
        <option value="Amateur">Amateur</option> 
        <option value="Professional">Professional</option> 
       </select> 
      </div>    
     </div> 
    </form> 
<div id="result-set"></div>

*可以動態添加該選擇部分（最大爲3）

的jQuery

$(function(){ 
$("#myForm").submit(function(){ 
    var formData = $(this).serializeArray(); 
    console.log(formData); 

    $.ajax({ 
     type: "POST", 
     data: { 
      theData: formData 
     }, 
     url: "theresult.php", 
     success: function(result){ 
      $("#result-set").ajaxComplete(function() { 
        $("#result-set").html(result); 
       }); 
     } 
    }); 
    return false; 
});

PHP - theresult.php

<?php 
    $data = $_POST['theData']; 
    $enc = json_encode($data, true); 

    ... 
    .... 
    ..... 
?>

的問題是，我該怎麼辦，如果我有3個選擇（所以我有3個技能，3 SkillsNumber和3 SkillsGrade），並顯示在＃結果集它。已經開始在這裏開始。

對不起，對英文不好。福利局這裏... :)

來源

2012-12-26 Xtrader

u能顯示它在一個表.. – bipen

我不確定問題是什麼。你問如何顯示提交的結果？ – davidethell

使用.serialize（），而不是.serializeArray（）。 –

添加一個按鈕的形式像

<input type="button" value="submit" id="myBtn">

改變你這樣的代碼

$("#myBtn").submit(function(){

，寫你的成功的功能這樣

success: function(result){     
    $("#result-set").html(result); 
}

如果你想使用json數據作爲javascript對象，請設置像這樣的$ .ajax方法參數dataType: 'json'

來源

2012-12-26 13:03:41

哈哈，其實我已經創建了提交按鈕，我只是在這裏發佈我的表單的一部分。 – Xtrader

使用parse_str，讓您的數據：

PHP - theresult.php

<?php 
    parse_str($_POST['theData'], $params); 
    $Skills = $params['Skills[]']; // I am not sure about [] part, test it 
    $SkillsGrade = $params['SkillsGrade[]']; 
    $SkillsNumber = $params['SkillsNumber[]']; 

    echo "Skills: $Skills<br />"; 
    echo "SkillsGrade: $SkillsGrade<br />"; 
    echo "SkillsNumber: $SkillsNumber<br />"; 

    exit; 
?>

，並添加dataType: "html"到您的$。阿賈克斯（）的定義

來源

2012-12-26 13:11:09

使用AJAX將表單數據提交到PHP

回答

相關問題