Question

我是javascript的新手，我基本上尝试创建一个显示文件名的下拉菜单。然后，用户将选择一个并从数据库中检索并打开到我的画布上的文件。我无法弄清楚如何将selectedText变量传递给我的php select语句。

我确定这一行是问题

$ st = $ _POST [＆＃39; selectedText＆＃39;];

数据库文件

  $st= $_POST['selectedText'];

try{

$stmt = $user->runQuery("SELECT canvas_json FROM Tactical_canvas WHERE canvas_name = ':st'");

$stmt->execute();
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);

} catch(PDOException $ex){
    echo $ex->getMessage();
}
echo $result[0]['canvas_json'];

javascript应该发送从下拉列表中选择的selectedText值。如果我使用警报，我可以看到正确的值被选中，但php没有收到它......

$("#Open").click(function(){
            openCanvas();
    });

    $("#select_option").on('change', function(){
        chooseCanvas();
    });


    function chooseCanvas(){

        var canvasSelect = document.getElementById("select_option");
        var selectedText = canvasSelect.options[canvasSelect.selectedIndex].value;


    $.ajax({
    type: 'POST',
    url: 'canvasLoadByName.php',
    data: {selectedText: selectedText},
    success: alert(selectedText + " has been selected!")

        });

    }

然后

openCanvas会显示所做的选择，如果我手动输入一个值来选择

，则效果很好

function openCanvas(){
    $.ajax({
    type: "GET",
    url: "canvasLoadByName.php",
    data: "json",
    success: function (result){
                canvas.loadFromJSON(result);
                canvas.renderAll();
                fabric.log(result);
            }
    });     

}

html

    <button type="button" class="btn btn-default button-group action cyan darken-4" data-toggle="modal" data-target="#uploadFile2">Upload2</button>

  <!-- Modal -->
  <div class="modal fade" id="uploadFile2" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Upload File</h4>
        </div>

       <?require'canvasLoad.php'
       ?> 
<option value="showAll" selected="selected">Choose a file to open</option>

<div id="select_box">
<option>Select canvas</option>
<select id="select_option">
       <?php
        foreach ($result as $row) {
        echo "<option>".$row['canvas_name']."</option>";
        }

?>
        </select>

</div>
        <div class="modal-footer">
         <button class="btn btn-default button-group action cyan darken-4" id="Open" data-dismiss="modal">Open</button>
          <button type="button" class="btn btn-default" data-dismiss="modal" id="Cancel">Cancel</button>
        </div>
      </div>

    </div>
  </div>
  </div>

Answer 1

编辑：

您可能需要在回显数据之前对json数据进行编码。

喜欢echo json_encode($result[0]['canvas_json']);

您需要使用分号来结束html文件中的require语句。

<?require'canvasLoad.php'
?>

应该是：

<?require'canvasLoad.php';
?>

文档：http://php.net/manual/en/function.require.php

编辑：打开PHP代码时，您还应确保使用<?php而不是<?。除非在php.ini文件中启用，否则将无法读取。

Answer 2

如果我没有错，你正在调用同一个文件＆＃34; canvasLoadByName.php＆＃34;来自2个ajax函数。一个ajax函数使用post方法，另一个使用get方法，根据你的代码spinet，你试图每次都发布变量＆＃34; $ st = $ _POST [＆＃39; selectedText＆＃39;];＆＃34 ;。你应该使用一些案例来处理这个问题，或者只使用＆＃34; isset（）＆＃34;解决问题的方法。

Answer 3

编辑＃2（警告，提前发帖）：我把您在初始问题中发布的代码略微修改了一下。我想你想得到这样的东西：

第1步：

第2步：

控制台中的其他调试输出：

数据库表架构：

dropdown.php：

<!doctype html>
<html>
<body>
<button type="button" class="btn btn-default button-group action cyan darken-4" data-toggle="modal" 
        data-target="#uploadFile2">Upload2
</button>
<!-- Modal -->
<div class="modal fade" id="uploadFile2" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Upload File</h4>
            </div>

            <?php require 'canvasLoad.php'; ?>
            <option value="showAll" selected="selected">Choose a file to open</option>

            <div id="select_box">
                <option>Select canvas</option>
                <select id="select_option">
                    <?php
                    foreach ($result as $row) {
                        echo "<option>" . $row['canvas_name'] . "</option>";
                    }
                    ?>
                </select>
            </div>
            <br><br>
            <div class="modal-footer">
                <button class="btn btn-default button-group action cyan darken-4" id="Open" data-dismiss="modal">Open
                </button>
                <button type="button" class="btn btn-default" data-dismiss="modal" id="Cancel">Cancel</button>
            </div>
        </div>

    </div>
</div>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
    $("#Open").click(function () {
        openCanvas();
    });

    $("#select_option").on('change', function () {
        chooseCanvas();
    });
    function chooseCanvas() {
        var e = document.getElementById("select_option");
        var selectedText = e.options[e.selectedIndex].text;
        $.ajax({
            type: 'POST',
            url: 'canvasLoadByName.php',
            data: {selectedText: selectedText}
        }).done(function (result) {
            alert(selectedText + " has been selected!");
            result = JSON.parse(result);
            console.log(result);
            *// do whatever you want with the json data here*
        });
    }
    //openCanvas should then display the choice made and is working perfectly if I manually input a value to select
    function openCanvas() {
        var e = document.getElementById("select_option");
        var selectedText = e.options[e.selectedIndex].text;
        $.ajax({
            type: "GET",
            url: "canvasLoadByName.php",
            dataType: "json",
            data: {selectedText: selectedText}
        }).done(function (result) {
            //canvas.loadFromJSON(result);
            //canvas.renderAll();
            //fabric.log(result);
            console.log(result); // debug output
            *// do whatever you want with the json data here*
        });
    }
</script>
</body>
</html>

canvasLoad.php

<?php
$pdo = new PDO('mysql:dbname=test;host=127.0.0.1', 'username', 'password');
try {
    $stmt = $pdo->prepare("SELECT * FROM tactical_canvas");
    $stmt->execute();
    $result = $stmt->fetchAll(PDO::FETCH_ASSOC);
} catch(PDOException $ex) {
    echo $ex->getMessage();
}

canvasLoadByName.php

$st = $_REQUEST['selectedText']; // I know, I know...
$pdo = new PDO('mysql:dbname=test;host=127.0.0.1', 'username', 'password');
try {
    $stmt = $pdo->prepare("SELECT canvas_json FROM tactical_canvas WHERE canvas_name = :st");
    $stmt->execute(array(':st' => $st));
    $result = $stmt->fetch(PDO::FETCH_ASSOC);
} catch(PDOException $ex) {
    echo $ex->getMessage();
}
echo json_encode($result);

如果它仍然不适合你，或者它不是你想要的，我很抱歉。如果出现问题，请随时提出。

<小时/> 编辑＃1：@Adam Patterson是对的，你需要输出json_encode（）。此外，区分是GET还是POST的情况也很有用。

在第

行

$stmt = $user->runQuery("SELECT canvas_json FROM Tactical_canvas WHERE canvas_name = ':st'")

使用命名参数（：st），但

$stmt->execute();

应该是

$stmt->execute(array(':st' => $st));

因此您的参数实际上会使用$ _POST变量中的值填充。这应该是您的应用程序无法正常工作的主要原因。

在Ajax GET请求中，

data: "json"

应该是

dataType: "json"

因为你没有发送“json”作为数据（我想）。

<?require'canvasLoad.php'
   ?>

缺少一个分号（并且＆lt;？php更适合更好的便携性，但最后是个人偏好）

Answer 4

我赞成所有人，因为你们都给了我很好的建议，所以非常感谢你的帮助。

我更改了我的javascript，因此只有方法用于选择工具和打开按钮，现在看起来似乎完美无缺。

我的noob大脑仍然不确定为什么它不能用我之前的格式工作，但显然与调用相同php文件的两个函数有关。

任何人都有兴趣或者感兴趣的是我必须改变的东西，这基本上只是将两个javascript函数（openCanvas和chooseCanvas）合二为一。

function chooseCanvas(){

    var canvasSelect = document.getElementById("canvas_name");
    var canvas_name = canvasSelect.options[canvasSelect.selectedIndex].text;


        $.ajax({
        type: "POST",
        url: "canvasLoadByName.php",
        dataType: "json",
        data: {canvas_name: canvas_name},
        success: function (result){

                alert(canvas_name + " has been selected!"),
                $("#Open").click(function() {
                    canvas.loadFromJSON(result);
                    canvas.renderAll();
                    console.log(result);

            });
        }
     });    

}

除了我将$ st更改为$ canvas_name。

之外，php保持不变

$canvas_name= $_POST['canvas_name'];


try {

$stmt = $user->runQuery("SELECT canvas_json FROM Tactical_canvas WHERE canvas_name = '$canvas_name'");

$stmt->execute();

$result = $stmt->fetchAll(PDO::FETCH_ASSOC);


} catch(PDOException $ex){
    echo $ex->getMessage();

}

echo ($result[0]['canvas_json']);

我尝试更改

$stmt->execute();

建议

（除了使用canvas_name而不是st

$stmt->execute(array(':st' => $st));

我的结果没有任何差异..

<强>干杯

为什么我从php获得未定义的索引

4 个答案: