我有以下组合框元素的渲染
<div class="combobox-container">
<input type="hidden" name="MySelection" value="">
<div class="input-group">
<input class="combobox form-control" type="text" autocomplete="off" placeholder="Select">
<ul class="typeahead typeahead-long dropdown-menu">
<li class="" data-value="val1">
<li class="active" data-value="val2">
<li data-value="val3">
<li data-value="val4">
<li data-value="val5">
</ul>
<span class="input-group-addon dropdown-toggle" data-dropdown="dropdown">
<span class="caret"></span>
<span class="glyphicon glyphicon-remove"></span>
</span>
</div>
</div>
呈现类似
的组合在我从这个组合中选择选项后,我正在进行渲染,如
现在某些用户操作后我正在重置其默认状态的组合框,所以我使用以下代码
$('#MySelection').val(undefined);
这实际上改变了价值,正如我所料,但ui elemenent保持完整,它出现了 而我想表现为
我试过$('#MySelection').data('combobox').refresh();
但这没有帮助。
更新
有人建议我尝试移动$('#MySelection').data('combobox').refresh();
在文件的最后,因为我在firebug中遇到错误
TypeError:$(...)。data(...)未定义')。data('combobox')。refresh();
但它没有帮助。我甚至尝试在所有jquery init文件之后添加_Layout.cshtml
文件,但也没有任何进展。
答案 0 :(得分:1)
更新:试试这个:
自举-组合框:
$('#MySelection').val('');
$('#MySelection').data('combobox','refresh');
$(document).ready(function(){
$('.combobox').combobox()
$("#reset").on("click",function(){
$('.combobox').val('');
$('.combobox').data('combobox','refresh');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js" type="text/javascript"></script>
<script src="http://formvalidation.io/vendor/bootstrap-combobox/js/bootstrap-combobox.js" type="text/javascript"></script>
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" media="screen" rel="stylesheet" type="text/css">
<link href="http://formvalidation.io/vendor/bootstrap-combobox/css/bootstrap-combobox.css" media="screen" rel="stylesheet" type="text/css">
</head>
<body>
<h1>Vertical Form</h1>
<div class="form-group">
<label>Turns this</label>
<select class="combobox input-large form-control">
<option value="">Select a State</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
</select>
</div>
<button id="reset">Reset</button>
答案 1 :(得分:0)
使用以下代码设置所选索引0
$('#MySelection').prop('selectedindex',0);
答案 2 :(得分:0)
您的元素<input type="hidden" name="MySelection" value="">
的名称为MySelection
。
使用$('#MySelection').val(undefined);
你试图通过它的ID(不是名字)来调用它。
请尝试$('input[name=MySelection]')
。
答案 3 :(得分:0)
这对我有用:
$('#MySelection').val('');
$('#MySelection').data("combobox").clearElement();
$('#MySelection').data('combobox').refresh();
答案 4 :(得分:0)
经过多次搜索,我发现 @mikeblum's solution 适合我。
$('#element').data('combobox').clearTarget();
$('#element').data('combobox').clearElement();