Question

好的所以我的页面上有一个div，它有一些代码用于选择输入中的显示选项组。然后在选择完成后在另一侧显示该组中的选项。我的html / php代码如下：

<div class="row">
    <div class="col-lg-6">
        <label class="control-label" for="productOptions">Select your
        product options</label> <select class="form-control" id=
        "productOptions">
            <option>
                Select an Option Group
            </option><?php foreach($DefaultOptions as $option): ?>

            <option value="<?php echo $option['GroupID']; ?>">
                <?php echo $option['GroupName']; ?>
            </option><?php endforeach; ?>
        </select>
    </div>

    <div class="col-lg-6" id="groupOptions">
        <label class="control-label">Group Options</label>
        <?php if($GroupOptions): ?>
        <?php foreach ($GroupOptions as $optionValue): ?>
        <?php echo $optionValue['optionName']; ?> <?php endforeach; ?>
        <?php endif; ?>
    </div>
</div>

默认情况下，在原始页面加载中，表单中不存在$GroupOptions，因为它是在用户选择要从中选择的组后设置的。我通过使用ajax到avoid page reload

来调用php脚本

$("#productOptions").change(function(){

    var GroupID = $(this).val();
    var dataString = 'GroupID=' + GroupID;
    //alert (dataString);return false;
    $.ajax({
      type: "POST",
      url: "#",
      data: dataString,
      success: function() {
        $("#groupOptions").html(dataString);
      }
    });
    return false;
});

然后ajax进入php调用，获取与数据库中的组id匹配的选项。

if(isset($_POST['GroupID']))
{
    $GroupID = $_POST['GroupID'];
    $sql = "SELECT * from `KC_Options` WHERE GroupID=$GroupID";

    $GroupOptions = $db->query($sql);
}

现在我希望refresh div #GroupOptions显示上述查询的结果，并将<?php if($GroupOptions): ?>设置为true。

我设法在ajax调用的success函数中用$("#groupOptions").html(dataString);刷新div。但这只能很好地返回dataString。（明显）。有没有办法真正刷新div。或者将信息从php调用传递给成功函数？

Answer 1

<强>更新

您当前的代码中有4个问题：

问题＃1和问题＃2 - 在单独的PHP脚本中，您不会回复任何回到Ajax的内容。您回显的任何内容都将作为变量返回success函数。只需根据您想要的格式添加echo语句。你的第二个问题是你试图在HTML部分回应它，其中$GroupOptions甚至不存在（Ajax只返回PHP脚本的输出，它不是include语句所以你的变量不在同一范围内。）

if(isset($_POST['GroupID']))
{
    $GroupID = $_POST['GroupID'];
    $sql = "SELECT * from `KC_Options` WHERE GroupID=$GroupID";

    $GroupOptions = $db->query($sql);

    //this is where you want to iterate through the result and echo it (will be sent as it to the success function as a variable)
    if($GroupOptions): 
      foreach ($GroupOptions as $optionValue): 
        echo $optionValue['optionName'];
      endforeach; 
    endif; 
}

在Ajax中，将一个名为data的变量添加到success函数中，该函数将接收PHP脚本的输出。另请注意，您的网址不正确，您需要发布到实际的外部文件，例如my_custom_script.php。：

$.ajax({
      type: "POST",
      url: "your_external_script.php",
      data: dataString,
      success: function(data) {
       if (data && data !== '') {
         //data will equal anything that you echo in the PHP script
         //we're adding the label to the html so you don't override it with the new output
         var output = '<label class="control-label">Group Options</label>';
         output += data;
         $("#groupOptions").html(output);
       } else {//nothing came back from the PHP script
         alert('no data received!');
       }
      }
    });

问题＃4 - 在你的HTML上，不需要运行任何PHP。只需更改：

<div class="col-lg-6" id="groupOptions">
        <label class="control-label">Group Options</label>
        <?php if($GroupOptions): ?>
        <?php foreach ($GroupOptions as $optionValue): ?>
        <?php echo $optionValue['optionName']; ?> <?php endforeach; ?>
        <?php endif; ?>
    </div>

到

<div class="col-lg-6" id="groupOptions">

</div>

希望这有帮助

Answer 2

您必须在成功回调函数中获取响应并实际在您的oho函数中给出响应

$（ “＃productOptions”）。变化（函数（）{

    var GroupID = $(this).val();
    var dataString = 'GroupID=' + GroupID;
    //alert (dataString);return false;
    $.ajax({
      type: "POST",
      url: "#",
      data: dataString,
      success: function(dataString) {        //take the response here
        // convert dataString to html...
        $("#groupOptions").html(newHtml);
      }
    });
    return false;
});

PHP：

if(isset($_POST['GroupID']))
{
    $GroupID = $_POST['GroupID'];
    $sql = "SELECT * from `KC_Options` WHERE GroupID=$GroupID";

    $GroupOptions = $db->query($sql);
    echo json_encode($GroupOptions );         //give a response here using json
}

使用jquery Ajax和PHP进行单个Div刷新

2 个答案: