无法在 jquery 模式窗口中填充下拉列表

Unable to populate dropdown in jquery modal window

本文关键字：填充 下拉列表 窗口 模式 jquery      更新时间：2023-09-26

单击"创建新按钮"时，我弹出了一个带有下拉列表的模态窗口表单。我正在通过 ajax 填充下拉列表填充用户数据（）。我可以看到调用已成功进行，但仍然无法在下拉列表中看到数据。 帮助我弄清楚我做错了什么，谢谢。

      <form id="formAddUser" action="#" title="Add User to Group" style="display: none;">       
     <label for="userId"><strong>User Id</strong></label>
      <select name="" id="userId" rel="0">
            <option>Select</option>              
     </select>  
     <label for="active"><strong>Active</strong></label>
     <select name="actvUsr" id="actvUsr" rel="1">
            <option value="Y">Yes</option>
            <option value="N">No</option>
    </select>  
   <button id="userGrpOk" >OK</button>
   <button id="usrGrpCancel">Cancel</button>
   </form>
    <button type="button" id="addusr">CREATE NEW</button>

爪哇语

  var userDtl = $( "#formAddUser" ).dialog({
        autoOpen: false,
        width: 350,
        modal: true,
        });
       // open modal form.
       $( "#addusr" ).button().on( "click", function() {
               populateUserData();
               userDtl.dialog( "open" );
           });

 function populateUserData() { 
    var userDataXML = ajax data
    $.ajax({
        type : "POST",
        url : getUserdata',
        data : userDataXML,
        dataType : "json",
        contentType : "application/xml; charset=utf-8",
        async : false,
        success : function(jqXHR, textStatus,response) {
            var shtml='';
            $.each(jqXHR,function(index, data) {
                shtml+='<option value="'+data.name+'">'+data.name+'</option>';
                $("#userId").html("");
                $("#userId").html(shtml);
            });
        },
        error : function(jqXHR, textStatus, errorThrown) {
            alert("error");
        }
    });

}

如果您确定：

  • 您正在输入success回调函数，
  • jqXHR 数据是正确的，

然后在您的$.each()中尝试此操作：

使用 jQuery 向<选择>添加选项？

这将给你：

success : function(jqXHR, textStatus,response) {
    var $select = $("#userId");
    $.each(jqXHR,function(index, data) {
        $select.append('<option value="'+data.name+'">'+data.name+'</option>');
    });
}
<小时 />

编辑 ：请注意，您在success函数中融化了参数顺序。j查询文档 说：

成功

类型：函数（任何数据，字符串文本状态，jqXHR jqXHR）

相关文章：