Question

我想使用php和ajax创建动态搜索，然后使用复选框选择将插入数据库中另一个tabke的结果。

这里是查询表

中搜索的代码

<?php
    //include('../koneksi/koneksi.php');

    mysql_connect('localhost','root',''); //ini untuk koneksi databasenya
    mysql_select_db('aam'); // nama tabel 

    $key=$_GET['q'];
    $query = mysql_query("select * from dokter where nama LIKE '%$key%'");

    echo "
        <table border='1'>
          <tr>

                <th>Kode Dokter</th>
                <th>Nama</th>
                <th>Spesialis</th>
                <th>Alamat</th>
                <th>Kota</th>
                <th>Pilih</th>
            </tr>
    ";

    while($row = mysql_fetch_array($query))
    {
      //$array[] = $row['title'];
      echo "<tr>";
      echo "<th>" . $row['id_dokter'] . "</th>";
      echo "<th>" . $row['nama'] . "</th>";
      echo "<th>" . $row['spesialis'] . "</th>";
      echo "<th>" . $row['alamat'] . "</th>";
      echo "<th>" . $row['kota'] . "</th>";
      echo"<th> <input name='chkbox[]' type='checkbox' value='". $row['id_dokter'] ."'> </th>";
      echo "</tr>";
    }
    echo "</table>";


?>

上面的代码会在我的页面中生成一个表格。填充结果后，我使用此代码将我的选择提交到数据库

function kirimJadwal(){
    $(document).ready(function(e) {
        var checkboxdokter = new Array();
        $("form#formulir").on('submit', function(e){
            e.preventDefault();

            /*$("input:checked").each(function() {
                checkboxdokter.push($(this).val());
            });*/

            $.ajax({
                type: "POST",
                url: "Planning-kirim.php",
                dataType:"html",
                //data: {checkboxdokter:checkboxdokter},
                data: $("form#formulir").serialize(),
                success: function(data){
                    alert(checkboxdokter);
                }
            }); 
        });
    }); 
}

这是我用来放置结果的表格

<form method='post' action='Planning-kirim.php' name="formulir" id="formulir">
      </div>
      <label> Atur Jadwal</label>
      <a id="dt1" href="#" <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span></a>
      <input type="date" name="date">
      <input type="submit" id="kirim" value="Submit" />
      </form>

问题是，当填充结果时，每次点击它时，提交按钮都不会执行任何操作？我的任何功能都冻结了按钮???

Answer 1

尝试用以下内容替换您的javascript：

$(document).ready(function() {
    $("#formulir").on('submit', function(){

        $.ajax({
            type: "POST",
            url: "Planning-kirim.php",
            dataType:"html",
            data: $("#formulir").serialize(),
            success: function(data){
                alert("123");
            }
        }); 
            return false;
    });
});

用这个html：

$(document).ready(function() {
        $("#formulir").on('submit', function(){

            $.ajax({
                type: "POST",
                url: "Planning-kirim.php",
                dataType:"html",
                data: $("#formulir").serialize(),
                success: function(data){
                    alert("123");
                }
             
            }).done(function(){
                alert();
              }); 
                return false;
        });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form method='post' action='Planning-kirim.php' name="formulir" id="formulir">
      <label> Atur Jadwal</label>
      <a id="dt1" href="#" ><span class="glyphicon glyphicon-calendar" aria-hidden="true"></span></a>
      <input type="date" name="date">
      <input type="submit" id="kirim" value="Submit" />
      </form>

点击提交按钮，查看萤火虫。你会在那里找到发送的请求。所以javascript可以工作。

Answer 2

文档需要在函数之前加载。

 $(document).ready(function(e) {
kirimJadwal();
function kirimJadwal(){
    var checkboxdokter = new Array();
    $("form#formulir").on('submit', function(e){
        e.preventDefault();

        /*$("input:checked").each(function() {
            checkboxdokter.push($(this).val());
        });*/

        $.ajax({
            type: "POST",
            url: "Planning-kirim.php",
            dataType:"html",
            //data: {checkboxdokter:checkboxdokter},
            data: $("form#formulir").serialize(),
            success: function(data){
                alert(checkboxdokter);
            }
        }); 
    });
});

}

AJAX提交按钮已禁用

2 个答案: