繁体   English   中英

如何使用 AJAX 从 php 获取值

[英]how to get the value from php with AJAX

我想分别获取 2 个值,以便通过 AJAX 从 PHP 中自动填充第一个文件中的输入,但是当我在 console.log(data) 中获取所有数据时,我想分别检索它以便把它放在不同的标签中

<input id="regist" type="text" name="regist" onblur="passdata();">
<input id="atyp" type="text" name="atyp" >
<input id="mtow" type="text" name="mtow" >

<script>
$(document).ready(function(){})

function passdata() {
    var regist = $('#regist').val();

    $.ajax({
        type: 'post',
        url: 'checkdb.php',
        data: 'regist='+regist,
        success: function(data){
            var atyp = $('#myvalue1').val();
            var mtow = $('#myvalue1').val();
            $('#atyp').text(atyp);
            $('#mtow').text(mtow);
            alert (aty+mtow);
            console.log(data);
        }
    })
}
</script>

和PHP文件....当然与数据库连接

$regist = $_POST['regist'];

$conn = mysqli_connect($host,$user,$pwd,$db);
$sql= ("SELECT * FROM aircrafts where regist='$regist'");
$datas = mysqli_query($conn,$sql);

foreach ($datas as $row) {};

if(mysqli_num_rows($datas) == 0) {
    echo 'non ce niente';
} else { ?>

    <span id="myvalue1"><?php echo $atyp =  $row['atyp'];?></span>
    <span id="myvalue2"><?php echo $atyp =  $row['mtow'];?></span>

<?php };

?>

将您的 Ajax 请求更改为:

$.ajax({
    type: 'post',
    url: 'checkdb.php',
    data: 'regist='+regist,
    dataType: 'json', // NEW LINE
    success: function(data) {
        //var atyp = $('#myvalue1').val();
        //var mtow = $('#myvalue1').val();
        //$('#atyp').text(atyp);
        //$('#mtow').text(mtow);
        var atyp = data.atyp;
        var mtow = data.mtow;
        alert ('aty: ' + aty , 'mtow: ' + mtow);
        console.log(data);
    }
})

并在您的 PHP 中:更改这些行

else{?>
<span id="myvalue1"><?php echo $atyp =  $row['atyp'];?></span>
<span id="myvalue2"><?php echo $atyp =  $row['mtow'];?></span>
<?php };

到这正是行

else {
    echo json_encode( $row );
}

编辑

关于您的“DOM 事件”处理(“document onready”和“input#regist onblur”),我建议这样做。

HTML:

<!-- <input id="regist" type="text" name="regist" onblur="passdata();"> -->
<input id="regist" type="text" name="regist">
<input id="atyp" type="text" name="atyp">
<input id="mtow" type="text" name="mtow">

JavaScript:

function passdata(event) {
    $.ajax({
        type: 'post',
        url: 'checkdb.php',
        data: 'regist=' + $(event.target).val(),
        dataType: 'json',
        success: function(data){
            console.log(data);
        }
    })
}

$(document).ready(function(){
    // on blur event
    $('#regist').on('blur', passdata)
    // on input event | maybe this would be also an interesting option as it fires immidiately on input
    // $('#regist').on('input', passdata)
})

此引导程序将逻辑与标记分开,这通常是一种很好的做法。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM