Question

我想通过java脚本添加一个下拉菜单点击到我的页面但是当添加它时它不会检索mysql值它只是打印下拉列表中的代码。任何建议：

的index.php

<script src="addInput.js" language="Javascript" type="text/javascript"></script>


<?php

include 'config.php';
include 'opendb.php';

$sql = "SELECT fullname FROM test";
$result = $conn->query($sql);
echo "<form action='process.php' method='post' <div id='dynamicInput'>
<select name='competitor1'>";
while ($row = $result->fetch_array()) {
$name = $row['fullname'];
echo "<option value='" . $row['fullname'] . "'>" . $row['fullname'] . "    </option>";
}
echo "</select> </div>";

echo "<input type='submit' /></form>";

?>
  <input type="button" value="Add another text input"      onClick="addInput('dynamicInput');">

addInput.js

var counter = 1;
var limit = 3;
function addInput(divName){
 if (counter == limit)  {
      alert("You have reached the limit of adding " + counter + " inputs");
 }
 else {
      var newdiv = document.createElement('div');
      newdiv.innerHTML = "Entry " + (counter + 1) 
      + "<?php mysqli_data_seek($result, 0); ?>"
      + "<br><select name='competitor2'>" 
      + "<?php while ($row = $result->fetch_array()) { echo \"<option value=\" . $row['fullname'] . \"/>\" . $row['fullname'] . \"</option>\";} ?>" + "</select>";
      document.getElementById(divName).appendChild(newdiv);
      counter++;
    }
 }

Answer 1

虽然你打算做的事情并不完全清楚，但是你似乎需要学习AJAX - 用外行术语来说，这是一种可以用来动态加载数据的技术，而无需加载一个全新的页面。我建议你看一下jquery的基础知识，它相对容易学习。

它在下拉列表中打印代码的原因是因为PHP无法通过javascript在客户端上处理，因此需要ajax。

您可以使用的另一种方法（粗略和繁琐）是在进行javascript调用之前先检索您需要的所有数据，然后通过JSON将这些数据传递给javascript

Answer 2

这是脚本可以帮助你。

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"</script>
<script>

    $( document ).ready(function() {
        $("#keyword").keyup(function() {
            var keyword = $("#keyword").val();
            if (keyword.length >= MIN_LENGTH) {
                $.get( "sqlquery.php", { keyword: keyword } )
                .done(function( data ) {
                    $('#data').html('');
                    var data = jQuery.parseJSON(data);
                    $(data).each(function(key, value) {
                        $('#data').append('<option value="' + value + '">' + value + '</option>');
                    })

                    $('.item').click(function() {
                        var text = $(this).html();
                        $('#keyword').val(text);
                    })

                });
            } else {
                $('#data').html('');
            }
        });

        $("#keyword").blur(function(){
                $("#data").fadeOut(500);
            })
            .focus(function() {     
                $("#data").show();
            });

    });
      </script>

sqlquery.php

<?php
     mysql_connect("localhost", "username",  "password");
    if(! $conn )
    {
      die('Could not connect: ' . mysql_error());
    }
    mysql_select_db('database');
    /* If connection to database, run sql statement. */
    $searchword = $_GET['select'];
        $fetch = mysql_query("SELECT word
                FROM table
            word='$searchword'
            ORDER BY word");

        /* Retrieve and store in array the results of the query.*/
        while ($row = mysql_fetch_array($fetch, MYSQL_ASSOC)) {
            $data[] = $row['word'];
        }

    echo json_encode($data); //This is what will be sent to the script above

    ?>

在Javascript中使用PHP来创建动态表单

2 个答案: