jquery/ajax表單提交不起作用

我從一些教程網站獲得了表單提交的jQuery代碼，但是ajax沒有工作，我猜。當我提交表單時，它不會發生任何事情。我嘗試了一切，但沒有結果。jquery/ajax表單提交不起作用

這裏是我的jQuery代碼。

$("#summary").submit(function (event) { 
    event.preventDefault(); 
    var name = $("#name").val(); 
    var address = $("#address").val(); 
    var landline_number = $("#landline_number").val(); 
    var mobile_number = $("#mobile_number").val(); 
    var profile_email = $("#profile_email").val(); 
    var profile_statement = $("#profile_statement").val(); 
    var dataString = 'name='+name+'&address='+address+'&landline_number=' + landline_number + '&profile_email=' + profile_email + '&prof ile_statement=' + profile_statement + '&mobile_number=' + mobile_number; 
    $.ajax({ 
     type: 'POST', 
     data: dataString, 
     url: 'test2.php', 
     success: function (data) { 
      $('#hello').html(data); 
     } 
    }); 
});

HTML代碼

<form name="summary" id="summary" action="" method="POST"> 
<div class="profile-header"> 

    <table width="740"> 
    <tr> 
    <td> 
    <h2>Personal Detail:</h2> 
    </td> 
    <td> 
    <input type="text" id="name" name="name" /> 
    </td> 
    </tr> 
    </table> 
    </div> 
    <div class="profile-table-hide"> 

    <table width="740"> 
    <tr> 
    <td width="297"><p>Address Location</p></td> 
    <td width="10" class="divider"></td> 
    <td width="428"><input id="address" type="text" name="address" /></td> 
    </tr> 
    <tr> 
    <td><p>Landline Number</p></td> 
    <td class="divider">&nbsp;</td> 
    <td><input type="text" id="landline_number" name="landline_number" /></td> 
    </tr> 
    <tr> 
    <td><p>Mobile Number</p></td> 
    <td class="divider"></td> 
    <td><input type="text" id="mobile_number" name="mobile_number" /></td> 
    </tr> 
    <tr> 
    <td><p>Email Address</p></td> 
    <td class="divider">&nbsp;</td> 
    <td><input type="text" id="profile_email" name="profile_email" /></td> 
    </tr> 
    <tr> 
    <td><p>Personal Statement</p></td> 
    <td class="divider">&nbsp;</td> 
    <td><textarea id="profile_statement" name="profile_statement"></textarea></td> 
    </tr> 
    <tr> 
    <td></td> 
    <td class="divider">&nbsp;</td> 
    <td><input type="button" id="save1" value="Save" name="save1" /></td> 
    </tr> 
</table> 
</div> 
</form>

PHP文件

$sql = "INSERT INTO `profile_detail` (`ref`,`p_name`,`p_mob`,`landline_number`,`p_email`,`p_add`,`p_statement`) VALUES 
    ('$user_app_id','".$_POST['name']."','".$_POST['mobile_number']."','".$_POST['landline_number']."', 
    '".$_POST['profile_email']."','".$_POST['address']."','".$_POST['profile_statement']."') "; 
if (mysql_query($sql)) { 
echo "<script>window.top.location='index'</script>"; 
    } 
else { 
echo mysql_error(); 
}

來源

2013-11-21 Abeer

你在期待什麼？你在控制檯（F12）中遇到任何錯誤？ – adeneo

我期待提交表格時提交！但即使在主機上也沒有任何反應 – Abeer

請求中發送的後參數是什麼？檢查它在鉻/螢火蟲控制檯 –

單擊type =「button」的輸入元素將不會提交表單。您需要將其更改爲type =「submit」。

<td><input type="submit" id="save1" value="Save" name="save1" /></td>

來源

2013-11-21 14:13:09 Johan

woowwwwwwww，什麼是sily錯誤！感謝兄弟，你讓我的一天！ – Abeer

嘗試使用serializeArray()來發表您的數據

$.ajax({ 
    type: 'POST', 
    data: $('#summary').serializeArray() 
    url: 'test2.php', 
    success: function (data) { 
     $('#hello').html(data); 
    } 
});

來源

2013-11-21 14:04:20

我認爲你的問題是你正在從file：//協議運行代碼。像.php這樣的服務器腳本需要http：//協議。
爲了運行此操作，請查看Apache並嘗試運行該服務器。對於Linux，您應該將文件放入/ var/www中，但對於其他操作系統，我不確定。
祝你好運！

來源

2013-11-21 14:05:57 Atutouato

我在xamp上運行它。 – Abeer

嗯。對不起......我從那裏不知道。 – Atutouato

有兩個錯誤在你的代碼

首先更改

1.<input type="button" id="save1" value="Save" name="save1" /> 

to 

<input type="submit" id="save1" value="Save" name="save1" />

和第二

$('#hello').html(data);

我不能看到你的窗體中的任何招呼的ID，這樣做一個像

<div id="hello"></div>

謝謝

來源

2013-11-21 14:30:57 user7789076

jquery/ajax表單提交不起作用

回答

相關問題