脚本/功能会忘记所选的ID

时间:2016-02-23 23:57:17

标签: php jquery ajax

我正在尝试从具有2个函数的数据库中获取多个数据。第一个函数运行良好,但是当第二个函数开始运行时,似乎第二个函数忘记了ID。有人可以帮我解决这个问题吗?

首先,这是我的PHP脚本。

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "database";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
     die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT * FROM cus";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
     echo "<select class='form-control select2' name='cus_id' id='cus_id' onChange='getCus(this.value)' style='width: 100%;'>";
              echo "<option selected disabled hidden value=''></option>";
     // output data of each row
     while($row = $result->fetch_assoc()) {
                      echo "<option value='" . $row["cus_id"]. "'>" . $row["cus_id"].  " | " . $row["cus_name"]. "</option>";
     }                   
echo "</select>";
} else {
     echo "0 results";
}

$conn->close();

?>

用户可以选择option。选择(onChange事件)后,函数getCus被调用。这是函数getCus

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script> 
function getCus(selectedItem) { 
jQuery.ajax({ 
url: 'get5.php', 
method: 'POST', 
data: {'cus_id' : jQuery('#cus_id').val()},
success: function(response){ 
    jQuery('#cus_id').val(response); 
        jQuery('#cus_name').val(response);
        getCus2(response)

}, 
error: function (request, status, error) { 
alert(request.responseText); 
}, 
}); 
} 
</script>

此函数运行脚本get5.phpget5.phpcus_name发送到cus_name文本字段。到此为止一切正常。函数getCus启动一个名为getCus2的新函数。此功能如下所示:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script> 
function getCus2(response) { 

var selectedItem = jQuery('#cus_id option:selected').val();

jQuery.ajax({ 
url: 'get6.php', 
method: 'POST', 
data: {'cus_id' : response},
success: function(response){ 
    jQuery('#cus_id').val(response); 
        jQuery('#cus_cou').val(response);

}, 
error: function (request, status, error) { 
alert(request.responseText); 
}, 
}); 
} 
</script>

此脚本启动get6.php,与get5.php相同。唯一不同的是响应。当系统运行get6.php时,我没有收到回复。当我在firebug中查看POST时,我看到第一个函数将cus_id发送到get5.php。但是没有cus_id发送给get6.php。函数(/或php脚本)由于某种原因忘记了cus_id。

POST get5.php
200 OK
1020ms  
cus_id  23
Source
klant_id=23

我看不出什么是错的,原因是我的脚本忘记了选定的cus_id。有人能看到什么错了吗?

更新1:

cus_id HTML元素:

 echo "<select class='form-control select2' name='cus_id' id='cus_id' onChange='getCus(this.value)' style='width: 100%;'>";
          echo "<option selected disabled hidden value=''></option>";
 // output data of each row
 while($row = $result->fetch_assoc()) {
                  echo "<option value='" . $row["cus_id"]. "'>" . $row["cus_id"].  " | " . $row["cus_name"]. "</option>";
 }                   
echo "</select>";

1 个答案:

答案 0 :(得分:0)

您需要将元素传递给

getCus2(selectedItem)

但你没有参数就叫它。

你可以重构它而不是未使用的selectedItem,直接从getCus发送结果,所以在getCus2中你不需要从DOM中获取它:

在getCus中:

getCus2(response)

在getCus2中:

data: {'cus_id' : selectedItem},

更新:尝试删除改变值的行#cus_id,似乎不需要,可能会破坏它,因为你从第一个响应中设置了一些错误的值。从两个函数中删除此行:

jQuery('#cus_id').val(response); 

它应该是这样的:

function getCus2() { 
    var selectedItem = jQuery('#cus_id option:selected').val();
    console.log("getCus2 before ajax", jQuery('#cus_id').val());
    jQuery.ajax({ 
        url: 'get6.php', 
        method: 'POST', 
        data: {'cus_id' : jQuery('#cus_id').val()},
        success: function(response){ 
            console.log("getCus2 after ajax", jQuery('#cus_id').val());
            jQuery('#cus_cou').val(response);
        }, 
        error: function (request, status, error) { 
            alert(request.responseText); 
        }, 
    }); 
}