从php获取json数据而无需重新加载

时间:2018-11-26 14:52:44

标签: javascript php ajax forms

我需要从表单向php发送值,根据发布的值从数据库获取数据,将所有数据存储在json中,然后将输入值更改为json的值。所有这些都无需重新加载页面,因为我不会丢失用户已经在表单中输入的内容。

这是我从中获得价值的选择:

PolygonObject

值的更改由以下功能处理:

     <select name="groupName" id="groupName" class="form-control message" onchange="group_select()">
        <?php 
            $user_id = $_SESSION["id"];
            $sql = mysqli_query($link, "SELECT group_name FROM SMAILY_groups WHERE user_id = '".$user_id."'");
            while ($row = $sql->fetch_assoc()){
                echo "<option value='".$row['group_name']."'>" . $row['group_name'] . "</option>";
            }
        ?>
        </select>

处理它的php是这样:

function group_select(){
    $.ajax({
            url:'send.php',
            type:'post',
            data:$('#smsForm').serialize(),
            success:function(data){

            }
        });
}

现在,我需要从数据库中获取电话号码,并将其作为值分配给我的输入字段之一。我需要执行此操作而不刷新页面。我很确定ajax成功函数中已经完成了它,但是我只是不知道如何。

2 个答案:

答案 0 :(得分:0)

您是正确的,它是在success回调中完成的。实际上,这非常简单:在HTML中创建一个<input type="hidden" name="phonenumbers" id="phonenumbers">元素。

<select name="groupName" id="groupName" class="form-control message" onchange="group_select()">
  <?php
  ...
  ?>
</select>
<input type="hidden" name="phonenumbers" id="phonenumbers" value="">

然后,在每个请求上,将返回的值附加到该<input>元素的值。不过不要忘记添加分隔符!我用逗号。

例如:

function ajaxSuccessHandler (data) {
  var hiddenInput = document.querySelector('#phonenumbers');
  if (hiddenInput.value.length >= 1) {
    // if there are already one (or more) numbers in the hidden input
    hiddenInput.value += ',' + data.join(',');
  } else {
    hiddenInput.value = data.join(',');
  }
}

您可以在success回调中调用该函数,也可以作为success回调的。所以这个:

function group_select(){
  $.ajax({
    url:'send.php',
    type:'post',
    data:$('#smsForm').serialize(),
    success: ajaxSuccessHandler
  });
}

或者这个:

function group_select(){
  $.ajax({
    url:'send.php',
    type:'post',
    data:$('#smsForm').serialize(),
    success: function (data) {
      ajaxSuccessHandler(data);
    }
  });
}

应该产生相同的结果。

答案 1 :(得分:0)

您可以尝试这个

 <select name="groupName" id="groupName" class="form-control message" onchange="group_select()">
    <?php 
        $user_id = $_SESSION["id"];
        $sql = mysqli_query($link, "SELECT group_name FROM SMAILY_groups WHERE user_id = '".$user_id."'");
        while ($row = $sql->fetch_assoc()){
            echo "<option value='".$row['group_name']."'>" . $row['group_name'] . "</option>";
        }
    ?>
    </select>

Javascript代码不要忘记将jquery包含在页面标题中

    <script>
    function group_select(){
    let groupName = document.getElementById('groupName').value;
        $.ajax({
                url:'send.php?groupName='+groupName,
                type:'GET',
                success:function(data){
                var obj = jQuery.parseJSON(data);
//Field to which you want to sent value
                document.getElementById('fieldName').value = obj.variableName;
                }
            });
    }
    </script>

send.php将看起来像这样

$groupName = $_GET["groupName"];
$user_id = $_SESSION["id"];
$stack = array();

    $result = mysql_query("SELECT phone FROM SMAILY_groups_numbers t1 INNER JOIN SMAILY_groups 
    t2 ON t1.group_id = t2.group_id WHERE t2.user_id = '".$user_id."' AND 
    t2.group_name = '".$group_name."'");
    $row = mysql_fetch_assoc($result);
    echo json_encode($row);