我选择了一个可搜索的框,当我添加新元素时,该值应该添加到选择框中并被选中。
HTML
<td rowspan="3"><label>Value(s):</label>
<select id="selectpa_color" name="attribute_terms" tabindex="-1" class="chosen-select" multiple="" style="width: 350px; display: none;">
<option value="28">Red</option>
<option value="29">Blue</option>
<option value="31">Greens</option>
<option value="34">light</option>
<option value="41">light1</option>
<option value="62">new color</option>
</select>
<div class="chosen-container chosen-container-multi" title="" id="selectpa_color_chosen" style="">
<ul class="chosen-choices">
<li class="search-field">
<input type="text" style="width:25px;" autocomplete="off" class="default" value="Select Some Options" tabindex="8">
</li>
</ul>
<div class="chosen-drop">
<ul class="chosen-results">
</ul>
</div>
</div>
<!--<a href="javascript:void(0);" class="select_all_attributes" id="select_all_slug-color" onclick="selectAll(select_box-color,true)">Select All</a>
<a href="javascript:void(0);" class="select_no" id="select_no_slug-color">Select None</a>-->
<input type="button" class="prompt_button" value="Add new" id="pa_color|5">
</td>
Jquery:
jQuery(".prompt_button").click( function(e){
var taxonomy = jQuery(this).attr('id').split("|");
jPrompt('Enter a name for the new attribute term::', '', 'Prompt Dialog', function(r) {
if( r )
{
var formData = {category_name: r,category_parent:0,taxonomy:taxonomy[0],shop_id:taxonomy[1]};
e.preventDefault();
jQuery.ajax({
type: 'post',
url: baseurl+'ajax_functions/add_new_attribute_term/',
data: formData,
beforeSend: function(){
},
success: function(response){
alert(taxonomy[0]);alert(response);
jQuery('select#selectpa_'+taxonomy[0]).append(response);
}
});
}
});
HTML视图:
如果我将一些其他值附加到另一个id,它会追加,但是在选择框和ul li中也没有..
答案 0 :(得分:1)
那是因为你的选择器被错误地构造了。你所拥有的将尝试选择#selectpa_pa_color
而不是#selectpa_color
。
更改
jQuery('select#selectpa_'+taxonomy[0]).append(response);
到
jQuery('select#select'+taxonomy[0]).append(response).trigger('chosen:updated');
在旁注中,如果您使用的是id,则不必指定tagName,您可以jQuery('#select'+taxonomy[0])
更高效。