Question

我的问题是我创建了一个带有php的表，当你进入页面时，它会在元素信息所在的位置下面显示。

我回复2个tr，一个带有文本，另一个有输入文本，一个选择和一个按钮来发送更改。我希望能够通过发送一个AJAX请求来更改每个元素的信息，该请求包含输入文本的值和我单击按钮时的选择。

我的PHP

<?php
$Municipios = $wpdb->get_results("SELECT * FROM cor_municipio INNER JOIN cor_estado ON cor_municipio.estado_id = cor_estado.estado_id;");
echo "<table>";
    echo "<tbody>";
        echo "<tr>";
            echo "<th>Municipio</th>";
            echo "<th>Estado</th>";
            echo "<th>Acciones</th>";
        echo "</tr>";
foreach($Municipios as $Eresult){
    echo "<tr>";
    echo "<td>".$Eresult->nombre_municipio."</td>";
    echo "<td>".$Eresult->nombre_estado."</td>";
    echo "<td><button class='editar' id='".$Eresult->municipio_id."''>Edit</button></td>";
    echo "</tr>";
    echo "<tr class='edit' id='edinfo_".$Eresult->municipio_id."'>";
    echo "<td>MUNICIPIO A CAMBIAR</td>";
    echo "<td>ESTADO A CAMBIAR</td>";
    echo "<td>PRESIONE BOTON PARA ACTUALIZAR</td>";
    echo "</tr>";
    echo "<tr class='edit' id='edit_".$Eresult->municipio_id."'>";
    echo "<td><input class='input' id='name_mun_".$Eresult->municipio_id."' value='".$Eresult->nombre_municipio."' placeholder='Nombre del municipio' type='text' autocomplete='off'>";
    echo "<td><select class='sel'type='text'>";
    echo "<option value='".$Eresult->estado_id."' selected>".$Eresult->nombre_estado."</option>";
    $r = $Eresult->estado_id;
    $A = $wpdb->get_results("SELECT * FROM cor_estado WHERE estado_id != 1 AND estado_id !=$r;");
    foreach ($A as $W ) {
        echo "<option value='".$W->estado_id."' type='text'>".$W->nombre_estado."</option>";
    }
    echo "</select></td>";
    echo "<td><button class='insertar'>Actualizar</button></td>";
    echo "</tr>";
}
    echo "</tbody>";
echo "</table>";
?>

我的jQuery

jQuery(document).ready(function() {
    jQuery(".edit").hide();
    var mun_id;
    var name_mun;
    var id_es;
    jQuery(".editar").click(function() { //this is the button displayed on the table
        mun_id = jQuery(this).attr('id'); // $(this) refers to button that was clicked
        jQuery(".edit").hide(500);
        jQuery("#edinfo_"+ mun_id).show(500);//show the row with text
        jQuery("#edit_"+ mun_id).show(500);//row with inputs
    });
     jQuery('#sp_'+mun_id).on('click',function(){//id of the button on the input row
        jQuery('#name_es'+mun_id).change(function() {//id of the select on the input row
            id_es = jQuery("option:selected", this).val();
        });
        name_mun = jQuery("#name_mun_" + mun_id).val();
        alert("su info es  id: " + mun_id + " municipio: " + name_mun + " estado: " + id_es);
    });
});
</script>

即使所选选项具有value属性，我也遇到了无法获取select值的问题。我试过设置一个if，但我无法做到。

我已经读过jQuery在页面加载时没有呈现的动态元素存在问题，并且.on（＆＃39; click＆＃39;，function）是使用的方法，但我不能让它工作，我不知道我是否需要搜索插件或类似的东西。

使用jQuery与动态元素及其动态Id

0 个答案: