时间戳

首页 > 解决方案 > 如何在第二个ajax完成后选择输入选项，JQuery

php - 如何在第二个ajax完成后选择输入选项，JQuery

问题描述

我正在使用 ajax 将数据从 mysql 加载到 php。我想为我的网站创建编辑功能。此编辑将是模态的。在使用先前的 ajax 加载单选输入类别后，使用选项（子类别）选择输入是由 ajax 加载的。

我尝试了几个 jquery 事件来更改选择选项，但没有一个起作用。这是我的模态文件中的脚本代码。

<script>    
    $(document).ajaxComplete(function() {
        $("#editexp'.$poz.'").on("shown.bs.modal", function(){
            $("input[name=payment'.$poz.'][value='.$method.']").prop("checked", true);

            $("input[name=kategoria'.$poz.'][value='.$catid.']").prop("checked", true);

            var category = '.$catid.';
            var poz = '.$poz.';
            $.ajax({
                url:"expense_subcategory_change.php",
                method:"POST",
                data:{category:category,
                    poz:poz
                },
                success:function(data){
                    $("#subcategory'.$poz.'").html(data);
                }
            });

            $("input[type=radio][name=kategoria'.$poz.']").change(function(){

                var category = $(this).val();
                var poz = '.$poz.';
                $.ajax({
                    url:"expense_subcategory_change.php",
                    method:"POST",
                    data:{category:category,
                        poz:poz
                    },
                    success:function(data){
                        $("#subcategory'.$poz.'").html(data);
                    }
                });
            });


        });
    });

    $("#subcategory'.$poz.'").ajaxComplete(function() {
         $("#subcategory'.$poz.' ").find("option").each( function() {
              var $this = $(this);
              if ($this.val() == '.$subcatid.') {
                 $this.prop("selected","selected");
                 return false;
              }
         });
    });
</script>

我也试过这个：

    $("#subcategory'.$poz.'").ajaxComplete(function() {
          $("#subcategory'.$poz.' option[value='.$subcatid.']").prop("selected","selected");
    });

这两个函数也没有用于#subcategory 的 ajaxComplete 或用于文档的第二个 ajaxComplete

带有选项的输入正在加载，但始终选择第一个选项。

这是我的费用子类别更改代码的主要部分：

$result = mysqli_query($connection,"$sql_query");

$output .= '<select class="mb-3 w-50-100 " name="subcategory'.$poz.'">';

while($row = mysqli_fetch_array($result))
{
    $output .= '<option value="'.$row['id'].'" >'.$row['sub'].'</option>';  
}

$output .= '</select>';

echo $output;

标签： phpjqueryajax

解决方案

问题出在您的选择器中。您在选择元素中使用“名称”，但使用“#”（id）在 dom 中搜索元素。将您的 PHP 代码更改为：

$output .= '<select class="mb-3 w-50-100 " id="subcategory'.$poz.'">';

我用你提供的第二种方法进行了测试，因为它看起来更干净

$("#subcategory'.$poz.' option[value='.$subcatid.']").prop("selected","selected");

请参阅此处的解决方案（简化代码）https://jsfiddle.net/79kugn60/

推荐阅读