0
ここに表示されている行の2行の検索可能なマルチセレクションを探しています:http://www.jqueryrain.com/?qmi2lw8Hですが、左側のボックスにajaxオートコンプリートを使用することができます。 jsonpの結果に基づいて 'abc'を含むすべてのものをボックスに埋めます。2ボックス検索可能なAJAX付きマルチ選択
私はこれまで複数選択ボックスが表示され、私はそれが作品の選択に手動でオプションをつけた場合、しかし、1つ<head>
<!-- BS CSS -->
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css" rel="stylesheet">
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Multiselect/BS -->
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://myip/multiselect.js" language="javascript" type="text/javascript"></script>
</head>
<body>
<form method="post" name="myForm">
<div class="row">
<div class="col-xs-5">
<select name="from[]" id="search" class="form-control" size="8" multiple="multiple"></select>
</div>
<div class="col-xs-2">
<button type="button" id="search_rightAll" class="btn btn-block"><i class="glyphicon glyphicon-forward"></i></button>
<button type="button" id="search_rightSelected" class="btn btn-block"><i class="glyphicon glyphicon-chevron-right"></i></button>
<button type="button" id="search_leftSelected" class="btn btn-block"><i class="glyphicon glyphicon-chevron-left"></i></button>
<button type="button" id="search_leftAll" class="btn btn-block"><i class="glyphicon glyphicon-backward"></i></button>
</div>
<div class="col-xs-5">
<select name="to[]" id="search_to" class="form-control" size="8" multiple="multiple"></select>
</div>
</div>
<script type="text/javascript">
jQuery(document).ready(function($) {
var $select = $('#search').multiselect({
search: {
left: '<input type="text" name="q" class="form-control" placeholder="Search..." />',
right: '<input type="text" name="q" class="form-control" placeholder="Search..." />',
}
});
$select.multiselect('disable');
$.ajax({
type: "POST",
url: "../terms_by_name.php",
dataType: 'jsonp',
data: {term: request.term},
success: function OnPopulateControl(response) {
list = response.d;
if (list.length > 0) {
$select.multiselect('enable');
$("#search").empty().append('<option value="0">Please select</option>');
$.each(list, function() {
$("#search").append($("<option></option>").val(this['Value']).html(this['Text']));
});
$("#search").val(valueselected);
}
else {
$("#search").empty().append('<option selected="selected" value="0">Not available<option>');
}
$("#search").multiselect('refresh'); //refresh the select here
},
error: function() {
alert("Error");
}
});
});
</script>
</form>
下の形式で利用可能なコードを使用して、任意の運を持っていなかった
左のオートコンプリートからは入力されません。 私はこのことにかなり新しいです。私は何が欠けていますか?
私は "request.term"を割り当てる必要があることを認識しています。私は左側の入力フィールドにIDを割り当てようとしましたが、getelementbyid()を使用して値を返しますが、値は返しませんでした。 – Bobert123
私はこれを削除しました。これはわかりません: $( "#search"選択された値); ASP.NETを使用していないので、 "response.d"を "response"に変更しました – Bobert123
ajaxタイプをGETに変更し、以下の行を変更しました: $( "#search")。append .val(this ['id']).html(this ['value'])); これは、私がハードウェアにrequest.term値 – Bobert123