1

这是我想要实现的目标，但我的谷歌搜索没有帮助：

我有一个按钮，可以动态地将新行添加到表中。我还在 javascript 中将一个选择组件添加到具有相同操作的单元格中。我希望该选择组件使用 sql select 语句中的值填充。当然，我不想在 JavaScript 中定义与数据库的连接。所以我想知道是否有一种方法可以调用 PHP 函数来检索值，然后将其存储在 JavaScript 中的变量中。

PS我知道PHP是服务器端而不是JS。但这肯定是可能的。

4

5 回答 5

2

这是一个使用 jQuery 的 ajax 和 php 的简单实现。

html

<select data-source-url="/category/list"></select>

使用 jQuery 的 JavaScript

$("select[data-source-url]").each(function(){
    var url = $(this).attr("data-source-url");
    var el = $(this);
    $.get(url, function(data){
        for (i=0;i<data.length;i++){
            el.append("<option>" + data[i] + "</option>");
        }
    },"json");
});

类别/列表端点（一个 php 脚本）

$list = array();
$list[0] = "category 1";
$list[1] = "category 2";
$list[2] = "category 3";
$list[3] = "category 4";
$list[4] = "category 5";

echo json_encode($list);

稍微解释一下：发生的情况是通过 JavaScript 客户端向 php 脚本发出请求，该脚本返回 JSON 中的值数组（基本上是 javascript 数据结构），这些值被动态添加到选择框中。

请注意，在页面初始加载时，选择框将为空。

于 2013-02-11T09:08:02.217 回答
1

是的，当然可以。要将 s php 变量存储在 js ariable 中，您可以这样做。在将其存储到 js 变量之前将所需的值存储在您的 php 变量中

var value = '<?php echo $value;?>';
于 2013-02-11T09:00:15.767 回答
1

Javascript 无法直接连接到数据库。

你想要AJAX。此功能的基本流程如下所示。

  1. 创建一个连接到数据库并获取您的选择元素的选项的 PHP 脚本（我们称之为 options.php）。此脚本应从数据库中获取选项并将它们输出为JSON数组。
  2. 在您的 javascript 中，您将创建一个对 options.php 的 ajax 请求。使用从该脚本返回的 JSON 数据，您将遍历每个元素并创建相应的选项元素并将其附加到您的选择元素内的 dom。

还可以考虑使用jQuery。它极大地简化了 ajax 并提供了跨浏览器的解决方案。

于 2013-02-11T09:00:45.827 回答
1

选项1

php在客户端使用类似这样的方法将包含所有可能值的数组传递给客户端：

var opt_values = [<?php echo $php_values; ?>]; //javascript array

或者

var opt_values = <?php echo json_encode($php_values); ?>; //json object

选项 2

另一种方法是发出 ajax 请求。编写一个返回JSON对象的 php 函数，然后您可以使用 jQuery ajax 方法操作结果：

PHP函数：

$json = array();
$result = mysqli_query ($connection, $query);
while($row = mysqli_fetch_array ($result))     
{
    $bus = array(
        'id' => $row['id'],
        'text' => $row['name']
    );
    array_push($json, $bus);
}

return = json_encode($json)

jQuery

$('#button-id').click(function(){
//adds a new row to a table dynamically
    $.ajax({
        type: "get",
        dataType: "json",
        url: "/get_values.php",
        success: function (response) {
            var $el = $("#myselect"); //get the select
            $el.empty(); // remove old options
            //Append the new values
            $.each(response, function(key, value) {
              $el.append($("<option></option>")
                 .attr("value", value.id).text(value.text));
            });
        }
    });
});
于 2013-02-11T09:25:29.500 回答
0

只是想我会把它放在那里，因为 w3schools 是我的朋友，我有点听从他们在这篇文章中所说的话。 W3Schools PHP & AJAX 通信

于 2013-02-11T11:16:32.053 回答