使用ajax jquery運行php腳本

使用Codeigniter，我試圖讓用戶點擊一個提交按鈕後運行一個php腳本。我跟了不少的教程，並拿出了下面的代碼：使用ajax jquery運行php腳本

如果這將有助於看到實際的頁面，您可以訪問這裏：http://rickymason.net/townbuilder 客/客登錄（目前要求）

在我看來（結構.php），我有：

<div id="structures"> 
<h1>Build</h1> 
<form name="buildForm" id="buildForm" method="POST"> 
    <select name="buildID" class="buildClass"> 
    <option value="0" selected="selected" data-skip="1">Build a Structure</option> 
<?php foreach ($structures as $structure_info): ?> 
<option name='<?php echo $structure_info['str_name'] ?>' value='<?php echo $structure_info['str_id'] ?>' data-icon='<?php echo $structure_info['str_imageloc'] ?>' data-html-text='<?php echo $structure_info['str_name'] ?><i> 
    <?php echo $structure_info['timebuildmins'] ?> minutes<br><?php echo $structure_info['buy_gold'] ?> gold</i>'><?php echo $structure_info['str_name'] ?></option> 
<?php endforeach ?> 
    </select> 
    <div id="buildSubmit"> 
     <input class="button" type="submit" value="Submit"/> 
    </div> 
</form> 
</div> 
<div id="output"> Result here</div>

這創建我的選擇窗體，並在html中創建它。然後，我創建了一個.js文件來運行ajax：

$("#submit").submit(function(e){ 
e.preventDefault(); 
$.ajax({ 
type: "POST", 
url: '../php/build.php',   
data: "", 
dataType: 'json',      
success: function(data)   
{ 
    alert("success!"); 
} 
}); 
});

我試圖儘可能保持簡單，僅用於測試目的。 Javascript對我來說是新的，我覺得它出於某種原因非常困惑。從我可以收集的內容來看，這個腳本應該在提交按鈕被按下後激活。然後運行build.php腳本，如果它通過json返回一個回顯，它會提示成功。對？

我build.php下面的腳本是：

<?php 
    $query = "INSERT INTO user_structure (str_id, user_id) VALUES ('7', '7')"; 
    mysql_query($query) or die ('Error updating database');  
    echo "success"; 
?>

再次，很簡單...

不幸的是，當我點擊提交，頁面看起來「刷新」，但沒有任何反應。我不希望在頁面上發生任何事情，但數據庫也沒有收到任何值。

我沒有在控制器或模型中的build.php或build.js文件，它們在應用程序目錄之外，並且在CI uri/url結構之外訪問。

截至目前，我只是試圖通過點擊提交成功運行一個PHP腳本。我的最終目標是獲取爲表單創建的str_id值，然後將該變量和user_id傳遞到build.php文件中，創建數據庫條目，然後刷新頁面以顯示更新的數據庫信息。

很明顯，它不工作！任何幫助將不勝感激。

來源

2012-03-05 Ricky Mason

'回聲「成功」;'不會返回一個JSON字符串。你也不會阻止提交表單。你真的需要所有那些打開/關閉php標籤來建立你的選擇框嗎？ – PeeHaa 2012-03-05 16:43:49

首先，你沒有什麼ID =「submit」，jQuery應該選擇什麼？ – 2012-03-05 16:44:53

謝謝，我在發佈代碼之前刪除了id ='submit'。我這樣做是因爲我模仿的一個具體例子沒有，因爲我相信他們正在調用表單名稱。感謝您指出了這一點。 – 2012-03-05 16:59:52

該腳本時用一個具有元素ID「提交」（因爲你用"#submit"作爲選擇）

使用click事件，而不是提交

要麼你可以給一個ID，您提交這樣的

和使用這樣

$("#btnSubmit").click(function(e){ 
    // your rest of code 
});

或使用類名

$(".button").click(function(e){ 
    // your rest of code 
});

，但它始終是更好地使用id becaues會有隻有一個（也應該）元素用一個ID。不止一個元素可以具有相同的類。

來源

2012-03-05 16:44:19 Shyju

submit（）事件會很好，如果他有一個提交輸入與正確的ID，當然 – 2012-03-05 16:46:32

@DamienPirsy：是的兩個作品 – Shyju 2012-03-05 16:49:13

我添加id ='btnSubmit'提交標記。然後我將js改爲$（「＃btnSubmit」）。click（function（e）{。我仍然沒有對數據庫進行修改，這可能是由於build.php文件存在調用，並沒有通過控制器加載，它需要再次連接到數據庫？我會嘗試並報告回。 – 2012-03-05 17:04:12

添加action屬性爲您form：

<form action="build.php" name="buildForm" id="buildForm" method="POST">`

OR：

<form action="<?php /* Script code here */ ?>" name="buildForm" id="buildForm" method="POST">`

來源

2013-12-13 23:51:41

jQuery代碼的目標與不過的 '提交' 標識的元素，你的表格有「一個id buildForm'，因此代碼不會定位表單，當你點擊提交時，它會繼續執行正常的行爲，這將導致屏幕刷新。要解決這個問題，請在jQuery代碼中更改選擇器

$("#buildForm").submit(function(e){ 
    // the rest of the code here remains 
});

這應該修復它

來源

2017-07-21 04:36:46 Joshua

使用ajax jquery運行php腳本

回答

相關問題