Question

我正在开发我的第一个ajax，jquery选择的应用程序，我对一个困扰我几天的问题感到愤怒。我试图动态填充选定的下拉列表。第一个下拉（1-automarke）正确填充第二个（2-automodell）没有显示任何内容：

HTML代码：

<table>
        <tr>        
            <td align="Left" valign="center"><p>Automarke ausw&auml;hlen</p></td>
            <td>&nbsp;&nbsp;&nbsp;&nbsp;</td>
            <td valign="center">
            <select data-placeholder="Bitte w&auml;hlen sie eine Automarke" id="1-automarke">
                </select>
            </td>
        </tr>

        <tr> 
            <td align="Left"><p>Automodell ausw&auml;hlen</p></td>
            <td align="Left">&nbsp;&nbsp;&nbsp;&nbsp;</td>
            <td>
            <select data-placeholder="Bitte w&auml;hlen sie ein Automodell aus" id="2-automodell">
                </select>
            </td>
        </tr>
</table>

JS代码：

$.getJSON(baseUrl()+'index.php?option=com_xy& ... &format=raw',{key:val},function(r){

        if (val == "Automarke") {
            $("#1-automarke").empty();
            $("#1-automarke").append('<option></option>');
        } else if (arrayVal[0] == "1-automarke") {
            $("#2-automodell").empty();
            $("#2-automodell").append('<option></option>');                 
        }


        //read key and values 
        $.each(r.items,function(k,v){               
            console.log(val+" - key:"+k+" value:"+v);
            if (val == "Automarke") {
                $("#1-automarke").append('<option value="'+k+'"'+connection+'>'+k+'</option>');
            } else if (arrayVal[0] == "1-automarke") {
                $("#2-automodell").append('<option value="'+k+'"'+connection+'>'+k+'</option>');        
            }

        });


        if (val == "Automarke") {       
            $("#1-automarke").trigger("liszt:updated");                 
            $("#1-automarke").prop("disabled", false);                                  
        } else if (arrayVal[0] == "1-automarke") {

            $("#2-automodell").trigger("liszt:updated");                    
            $("#2-automodell").prop("disabled", false);         

        }               

        refreshSelects();

从第一个下拉列表中选择一个值后（id =＆＃34; 1-automarke＆＃34;）我得到第一个字段的结果（id =＆＃34; 1-automarke＆＃34;），这是细：

HTML结果ID =＆＃34; 1-automarke＆＃34;：

  <td valign="center">
  <select id="1-automarke" data-placeholder="Bitte wählen sie eine Automarke" style="display:     none;">
  <option></option>
  <option value="Abarth">Abarth</option>
  <option value="Alfa Romeo">Alfa Romeo</option>
  <option value="Audi">Audi</option>
    <option value="Bentley">Bentley</option>
    ...
    </select>
    <div id="1_automarke_chosen" class="chosen-container chosen-container-single" style="width: 300px;" title="">
    <a class="chosen-single" tabindex="-1">
    <span>Audi</span>
    <div>
    <b></b>
    </div>
    </a>
    <div class="chosen-drop">
    <div class="chosen-search">
    <input type="text" autocomplete="off">
    </div>
    <ul class="chosen-results">
    <li class="active-result" style="" data-option-array-index="1">Abarth</li>
    <li class="active-result" style="" data-option-array-index="2">Alfa Romeo</li>
    <li class="active-result result-selected" style="" data-option-array-index="3">Audi</li>
    <li class="active-result" style="" data-option-array-index="4">Bentley</li>
    ...
    </ul>
    </div>
    </div>
    </td>

和第二个字段的代码（id =＆＃34; 2-automdell＆＃34;）<ul class="chosen-results"></ul>部分为空：

HTML结果ID =＆＃34; 2-automdell＆＃34;：

<td>
<select id="2-automodell" data-placeholder="Bitte wählen sie ein Automodell aus" style="display: none;">
<option></option>
<option value="80">80</option>
<option value="A1">A1</option>
<option value="A2">A2</option>
<option value="A3">A3</option>
<option value="A4">A4</option>
<option value="A5">A5</option>
<option value="A6">A6</option>
<option value="A7">A7</option>
<option value="A8">A8</option>
</select>
<div id="2_automodell_chosen" class="chosen-container chosen-container-single chosen-container-single-nosearch" style="width: 300px;" title="">
<a class="chosen-single chosen-default" tabindex="-1">
<span>Bitte wählen sie ein Automodell aus</span>
<div>
<b></b>
</div>
</a>
<div class="chosen-drop">
<div class="chosen-search">
<input type="text" autocomplete="off" readonly="">
</div>
<ul class="chosen-results"></ul>
</div>
</div>
</td>

AJAX部分工作正常，但我不知道为什么<ul class="chosen-results"></ul>为空。欢迎任何帮助

jquery-selected下拉字段为空

0 个答案: