php - 如何在 AJAX 上接收 PHP 表，并将其显示在 DIV 中？

Question

我开始使用 AJAX，并且正在努力处理接下来的几件事。 我在 Wordpress 工作，使用自定义表格。 顺便说一下，这就是全局 $wpdb 存在的原因。

首先，我有一个 Select，当您选择一个选项时，ID 值将存储在 jQuery 的一个变量中。这是由

onchange="selectRequest(this)"


global $wpdb;
$Estado = $wpdb->get_results("SELECT * FROM cor_estado;");
?>
<p>Busqueda por Estado</p>
<select class="select" id="estado" name="estado" value="" type="text" onchange="selectRequest(this);">
    <option value="" disabled selected>Seleccione un estado...</option>
    <?php 
    foreach ($Estado as $Estados ) {
        echo "<option value='".$Estados->estado_id."' type='text'>".$Estados->nombre_estado."</option>";
    }
    ?>
    </select>

Select 将填充值上的 id 和名称。

这是我的 jQuery，但我在这里遇到问题，如果我将所有内容都留在 jQuery(document).ready(){CODE HERE} 上，函数 selectRequest(id) 将根本无法工作，我不知道这是否与我从选择中获取 ID 的方式有关。

这里变了，现在我正在尝试接收 HTML，我在“table.php”上创建了完整的表格，现在我正在尝试取回它

<script type="text/javascript">
 function selectRequest(id){ // id of select
    var selectVal = jQuery(id).val(); // currently selected 
    selectVal = selectVal.toString();
    alert(selectVal);
    jQuery.ajax({
        type:"POST",  
        url:"<?php echo get_template_directory_uri(); ?>/table.php",   
        dataType: "html",  
        data:{selectVal:selectVal},
         success:function(resultHtml){ 
            jQuery("#resultado").html(resultHtml);
        },
        error:function(resultHtml){   
            alert("What follows is blank: " + data);
        }  
       });  
    }
</script>

我的 PHP 目前是这样的，一个很大的变化是在 WHERE 中，因为我使用的是 INNER JOIN，我需要指定“estado_id”将在哪个表上，因为 Wordpress 使用表前缀，这个地方也有必要加上。

就像我之前说的，我决定在这里建立表格，并通过回显将它发送到 AJAX，我创建了 $table，每次在表格中创建一些东西时，我都会用“.=”添加它。

在没有“If(isset($_post['selectVal']))”的情况下在 table.php 中测试它，并且有一个静态 ID 它在 table.php 文档上工作，但是如果我回显 $table，我在 AJAX 上什么也得不到，它显示为空白。

    <?php  
 //table.php  
 global $wpdb;
 if(isset($_POST["selectVal"])){ 
    $Estado_id = $_POST["selectVal"];
     $Estado = $wpdb->get_results("SELECT * FROM cor_municipio INNER JOIN cor_estado ON cor_municipio.estado_id = cor_estado.estado_id WHERE cor_estado.estado_id = $Estado_id;");
       $table = "<table>";
        $table .="<thead>";
            $table .="<tr>";
                $table .="<th>Municipio</th>";
                $table .="<th>Estado</th>";
            $table .="</tr>";
        $table .="</thead>";
       $table .="<tbody>";
    foreach ($Estado as $row) {
        $table .="<tr>";
        $table .="<td>".$row->nombre_municipio."</td>";
        $table .="<td>".$row->nombre_estado."</td>";
        $table .="</tr>";
    }
        $table .="</tbody>";
    $table .="</table>";
    echo $table;
}
 ?>  

这是我要显示 echo $table 内容的 HTML div。目前，如果我选择一个选项，唯一发生的事情就是 P 元素消失。

    <div id="resultado">
      <p>Estado Seleccionado</p>
    </div>

新的问题是接收这个 echo $table 并在 AJAX 接收它的地方显示它。

Answer 1

不要接收 JSON 格式的数据，而是使用 HTML 格式的数据并直接在表格中替换您的数据。使用您的基本问题“每个选择选项中的信息量将不同”将得到解决。