首页 > 解决方案 > 从php取回json数据而不重新加载

问题描述

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

这是我从中获取值的选择:

     <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>

值的变化由这个函数处理:

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

            }
        });
}

处理它的php是这样的:

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

$sql = "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."'";

$result = mysqli_query($link, $sql);

while($row = $result->fetch_array(MYSQLI_ASSOC))
{
    array_push($stack, $row["phone"]);


}
$stack = json_encode($stack);

$result->free();

现在我需要获取从数据库中获取的电话号码,并将它们作为一个值分配给我的输入字段之一。我需要在不刷新页面的情况下执行此操作。我很确定它是在 ajax 成功函数中以某种方式完成的,但我只是不知道如何。

标签: javascriptphpajaxforms

解决方案


你是对的,它是在success回调中完成的。其实很简单:<input type="hidden" name="phonenumbers" id="phonenumbers">在你的 HTML 中创建一个元素。

<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);
    }
  });
}

应该产生相同的结果。


推荐阅读