对话框中的JQuery select没有附加选项

时间:2012-05-04 05:56:27

标签: php jquery dialog

我正在尝试使用JQuery对话框来执行类似于打开文件的对话框,但是我使用数据库中的记录来填充对话框而不是文件。

我遇到的问题是我似乎无法将html选项数据加载到我的对话框中的html选择中。我在Chrome中使用了Google Javascript调试器,并逐步完成了从我的PHP ajax调用的javascript代码。我看到没有错误,当我将它放入append语句时,我看到数据存在且格式正确。我不明白为什么它没有出现在我的html选择中。

感谢您的帮助。

下面是我的Ajax函数,它接收数据。

function doOpenAjax(filterStr)     {

    $.get(
        "contenteditServerAjax.php",
        {filter: filterStr },
        function(data) {
                            var optsArr = data.split('|~|');
                            var seloption = "";

                            $.each(optsArr, function(i) {
                                seloption += '<option value="' + optsArr[i] + '">' + optsArr[i] + '</option>';
                            });
                            $('#chooseArticleName2').find('option').remove().end();
                            $('#chooseArticleName2').append(seloption);
                        },
        "html"
        );

}

作为参考,这是我的php的一部分,其中包含jquery对话框:

<head>
<script>
$(document).ready(function() {

    var dlg = $("#opendiv").dialog({modal:true, height:550, width:650,
                        hide:{ effect: 'drop', direction: "down" },
                        autoOpen:false,
                        maxHeight: 1200,
                        maxWidth: 1200,  
                        minHeight: 250,
                        minWidth: 300, 
                        buttons: { "Open": function() { $('#state').val('Open Doc');        $('#contentform').submit(); $(this).dialog("hide"); },
                        "Cancel": function() { $(this).dialog("close");}}                            
    });
    dlg.parent().appendTo($("#contentform"));  

});
</script>

<div id="opendiv" name="opendiv" title="OPEN">

    <p align="center">Enter Name to Open Article as:</p>
    <p>
        Filter:
        <input name="docFilter2" id="docFilter2" type="text" value="$filter2" maxlen="64" size="28"/>&nbsp; &nbsp;
        <input name="LoadTitles2" id="LoadTitles2" type="button" value="Load Available Titles" 
                                onclick="doOpenAjax( $('#docFilter2').val() );"/>
    </p>
    <p>
        <div id="ajaxOutput2">
            <select name="chooseArticleName2" id="list2" size="8" style="min-width:92%"
                                        onchange="
                                        var mytext = $('#chooseArticleName2 :selected').text();
                                        $('#textBoxArticleName2').val(mytext);">
            </select>
        </div>
    </p>
    <p>
        Document:
        <input type="text" id="textBoxArticleName2" name="textBoxArticleName2" size="56"/>
    </p>
</div>

1 个答案:

答案 0 :(得分:0)

仅供参考,这样做会更有效:

$('#chooseArticleName2').empty().html(seloption);

比这个:

$('#chooseArticleName2').find('option').remove().end();
$('#chooseArticleName2').append(seloption);