多个动态表动态地与AJAX同时运行

时间:2015-11-02 22:36:38

标签: php jquery mysql ajax

我正在尝试使用MySQL表中的数据动态加载2个表(在#txtHint#txtHint2中)。

我正在使用2个功能。但当时只加载一个表。我想我需要连接两个函数,但我不知道如何。

这是我的表单和脚本文件。我通过切换它的位置来检查这两个函数是否正常工作:

onchange="showDevices2(this.value), showUser(this.value) "

形式

<body>
    <div>           
        <input id="name" type="text" name="part_id" onchange="showDevices2(this.value), showUser(this.value) " />      
    </div>
    <div id="tables">    
        <div id="table1">
            <div id="txtHint"><b></b></div>
        </div>          
        <div id="table2">
            <div id="txtHint2"><b></b></div>
        </div>  
    </div>                  
</body>

global.js

function showUser(str) {
    if (str == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
    } else {
        if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtHint").innerHTML =  xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","../action/subs/getcalls.php/?q="+str,true);
    xmlhttp.send();
}
}


function showDevices2(str) {
if (str == "") {
    document.getElementById("txtHint2").innerHTML = "";
    return;
} else {
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtHint2").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","../action/subs/getdevices_list.php/?q="+str,true);
    xmlhttp.send();
    }
}

getdevices_list.php

<!DOCTYPE html>
    <html>
        <head>
            <style>
                table {
                    width: 100%;
                    border-collapse: collapse;
                }

                table, td, th {
                    border: 1px solid black;
                    padding: 5px;
                }

                th {text-align: left;}
            </style>
        </head>
        <body>

            <?php


                $q = intval($_GET['q']);

                include '../db/connect.php';

                mysqli_select_db($con,"ajax_demo");
                $sql="SELECT * FROM oz2ts_devices WHERE member_id = '".$q."'";
                $result = mysqli_query($con,$sql);

                echo "<table class=\"optable\">
                    <tr>
                        <th>Device ID</th>
                        <th>Name</th>
                        <th>Type</th>
                        <th>Make & Model</th>
                        <th>Memory</th>
                    </tr>";
                while($row = mysqli_fetch_array($result)) {
                    echo "<tr>";
                    echo "<td>" . $row['device_id'] . "</td>";
                    echo "<td>" . $row['device_name'] . "</td>";
                    echo "<td>" . $row['device_type'] . "</td>";
                    echo "<td>" . $row['make_model'] . "</td>";
                    echo "<td>" . $row['memory'] . "</td>";
                    echo "</tr>";
                }
                echo "</table>";
                mysqli_close($con);
            ?>
    </body>
</html>

getcalls.php

getdevices_list.php相同,但从不同的数据库表中获取数据。

两个表都有相同的用户ID。

1 个答案:

答案 0 :(得分:0)

更改您的onchange处理程序。

你有这个:

onchange="showDevices2(this.value), showUser(this.value)"

但不是逗号(,),而是应该有一个分号(;):

onchange="showDevices2(this.value); showUser(this.value)"

这应该允许你连接&#34;这两个函数(背靠背运行)。