【发布时间】：2018-11-01 12:49:10
【问题描述】：
<div class="container" style="padding-top:70px;">
<div class="panel panel-default">
<div class="panel-heading">
<h4>Transfer Batch</h4>
</div>
<div class="panel-body">
<div class="form-group">
<label for="title"></label>
</div>
<div class="col-md-6" style="margin-top: 20px;">
<label for="title">From Sub-location:</label>
<select id="from_sub_location" class="form-control" style="width:350px">
<option value="0">SELECT</option>
<option value="1">Reception principale</option>
<option value="2">Reception Alle Maternite</option>
<option value="3">Reception Alle Pediatriqui</option>
<option value="4">Reception immigration</option>
<option value="5">Carte de credit</option>
<option value="6">2e etage</option>
</select>
</div>
<div class="col-md-6" style="margin-top: 20px;">
<label for="title">To sub-location:</label>
<select id="to_sub_location" class="form-control" style="width:350px">
<option value="0">SELECT</option>
<option value="1">Reception principale</option>
<option value="2">Reception Alle Maternite</option>
<option value="3">Reception Alle Pediatriqui</option>
<option value="4">Reception immigration</option>
<option value="5">Carte de credit</option>
<option value="6">2e etage</option>
</select>
</div>
<div class="col-md-3"></div>
</div>
</div>
</div>
<div class="container">
<div class="card">
<div class="col-md-12" style="padding-top: 10px;padding-bottom: 10px;">
<div class="form-group">
<input type="text" id="medicineSearchBar" class="form-control" placeholder="Search..." >
</div>
<ul class="list-group" id="result"></ul>
<ul style="width:100%; max-height:300px; overflow-y: scroll;" id="li-psearch" class="dropdown-menu" role="menu"
aria-labelledby="menu1">
<li role="presentation" class="divider-search"></li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="card">
<table id="myclass" class="table table-bordered">
<tr id="mainTable">
<th scope="col">From</th>
<th scope="col">To</th>
<th scope="col">Reagent Name</th>
<th scope="col">Expiry Date</th>
<th scope="col">Quantity</th>
</tr>
<tbody id="results_body">
</tbody>
</table>
<button type="button" class="btn btn-primary" style="float: right;margin: 4px 2px;">Transfer</button>
</div>
</div>
</div>
</div>
@include('includes.foot')
<meta name="loc" content="{{Session::get('loc')}}"/>
<script>
var countries = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
limit: 10,
prefetch: {
// url points to a json file that contains an array of country names, see
// https://github.com/twitter/typeahead.js/blob/gh-pages/data/countries.json
url: "<?=asset('assets/img/data2.json');?>",
// the json file contains an array of strings, but the Bloodhound
// suggestion engine expects JavaScript objects so this converts all of
// those strings
filter: function (list) {
console.log(list);
return $.map(list, function (country) {
return {name: country};
});
}
}
});
countries.initialize();
$('#medicineSearchBar').typeahead(null, {
name: 'countries',
displayKey: 'name',
// `ttAdapter` wraps the suggestion engine in an adapter that
// is compatible with the typeahead jQuery plugin
source: countries.ttAdapter()
});
jQuery('#medicineSearchBar').on('typeahead:selected', function (e, datum)
{
//$('#extraControls').css('display','block');
//console.log('kl');
$('#results_body').append('<tr> <td scope="row">'+$('#from_location option:selected').text()+' <br>'+$('#from_sub_location option:selected').text()+' <\/td><td scope="row"> '+$('#to_location option:selected').text()+' <br> '+$('#to_sub_location option:selected').text()+' <\/td><td>'+datum\['name'\]+'<\/td><td>19-05-2018<\/td><td><input type="text" class="form-control" id="qty"></td><\/td></tr>');
//console.log($('#shipping_selector option:selected').text());
});
</script>
This is data2.json
\["Genouillère renforcée ($30)","Genouillère Small ($20)","Genouillères XXL ($20)","Knee brace long type ($50)","Nexcare First aid Cold pack ($25)","Orthèse de stabilisation ($55)","Orthopaedic back rest long ($125)","Paire Semelle orthopodéque ($280)","Prothèse pour immobilisation ($90)","Sac de sable de 500g ($25)","Slip orthopédique ($70)"\]
alert me that it is already selected if i select the same value of dropdown option(ie if i select Reception principale from first dropdown option and Carte de credit from second option and Genouillère renforcée ($30) from search list ) the second time for all three select option(including two dropdown option and one search bar) then i should display me alert .The alert should be shown on select of search bar list which is input field with id="medicineSearchBar" and above is two dropdown with id="from_sub_location" and id="to_sub_location" option which is already selected.
提醒我，如果我第二次选择相同的下拉选项值（即，如果我从第一个下拉选项中选择 Reception principale，从第二个选项中选择 Carte de credit，从搜索列表中选择 Genouillère renforcée ($30)），它已经被选中对于所有三个选择选项（包括两个下拉选项和一个搜索栏），那么我应该向我显示警报。警报应该显示在搜索栏列表的选择上，该列表是带有 id="medicineSearchBar" 的输入字段，上面是带有 id 的两个下拉列表="from_sub_location" 和 id="to_sub_location" 选项已被选中。
【问题讨论】：
标签： javascript jquery