使用 ajax jquery 运行 php 脚本答案

【问题标题】：using ajax jquery to run php script使用 ajax jquery 运行 php 脚本
【发布时间】：2012-03-05 16:39:50
【问题描述】：

使用 Codeigniter，我试图在用户单击提交按钮后运行 php 脚本。我遵循了很多教程，并提出了以下代码：

如果查看实际页面有帮助，您可以在此处访问：http://rickymason.net/townbuilder 来宾/来宾登录（当前需要）

在我看来（structures.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 文件中，创建数据库条目，然后刷新页面以显示更新的数据库信息。

显然，它不起作用！任何帮助将不胜感激。

【问题讨论】：

echo "success"; 不返回 JSON 字符串。此外，您不会阻止提交表单。此外，您真的需要所有这些打开/关闭 php 标签来构建您的选择框吗？
首先，你没有任何 ID = "submit" 的东西，jQuery 应该选择什么？
谢谢，我在发布代码之前删除了 id='submit'。我这样做是因为我模仿的一个特定示例没有它，因为我相信他们正在调用表单名称。感谢您指出这一点。

标签： php javascript mysql ajax codeigniter

【解决方案1】：

该脚本适用于 id 为“submit”的元素（因为您使用 "#submit" 作为选择器）

使用点击事件代替提交

您可以像这样为您的提交提供一个 id

并像这样使用

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

或使用类名

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

但是使用 id 总是更好，因为只有一个（并且应该是）带有 id 的元素。多个元素可以具有相同的类。

【讨论】：

submit() 事件会很好，当然，如果他有一个带有正确 id 的提交输入
我在提交标签中添加了 id='btnSubmit'。然后我将 js 更改为 $("#btnSubmit").click(function(e){。我仍然没有更改数据库。可能是因为，因为 build.php 文件正在调用，并且没有通过控制器加载，它需要再次连接到数据库？我会尝试并报告。
签入 firbug 以查看是否正在调用正确的文件（我的意思是路径）
谢谢大家。我能够根据给出的所有建议让它工作。在进行了一些小的更改之后，我决定将代码写入我的控制器。它目前正在工作！所以至少现在我有一些东西可以建立。

【解决方案2】：

为您的form 添加action 属性：

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

或者：

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

【讨论】：

【解决方案3】：

您的 jquery 代码以 id 为“submit”的元素为目标，但是，您的表单的 id 为“buildForm”，因此代码不以表单为目标，当您单击提交时，它只会继续其正常行为，即导致屏幕刷新，要解决此问题，请更改 jquery 代码中的选择器

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

这应该可以解决它

【讨论】：