下拉列表仅在我单击时第一次起作用然后它不会更改值

时间:2014-03-06 15:42:26

标签: javascript jquery drop-down-menu

我有一个脚本应该在下拉列表选择更改时自动更改值,并且它第一次更改值时有效,但第二次不起作用(在我尝试从一个中选择不同的值之后)之前选择的)

这是HTML:

<input id="search" placeholder="Search..." type="text"/> 

<label for="showbrand" class="filter">Brand:<select id="showbrand" data-bind=''>
<option value="">--select--</option>
<option value="">All</option>
</select></label>
<label for="showfrom" class="filter">From:<input type="date" id="showfrom"></label>
<label for="showto" class="filter">To:<input type="date" id="showto"></label>           
<a id="filterList" class="btn btn-primary pull-right" onclick="clickFilter();">Find</a><table id="dataTable" class="table table-condensed table-bordered">
<thead>
<tr>
<th>Campaign</th>
<th>Brand</th>
<th>Starts On</th>
<th>Ends On</th>
<th>Files</th>
<th>Edit</th>   
</tr>
</thead>
<tbody>
</tbody>
</table>
<div id="msg"></div>

JS:

$("#showbrand").change(function(){
var info = new Array();
info[0] = $("#showbrand").val();
if($("#showfrom").val() !== '' && 
$("#showto").val() !== ''){
info[1] = 'yes';
}
else{
info[1] = 'no';
}
info[2] = $("#showfrom").val();
info[3] = $("#showto").val();
info[4] = $("#search").val();

listCampaignsFiltered(info, 'dataTable', 0);
});



unction listCampaignsFiltered(info, tableName, limit){
var params = "&brand="+info[0]+
"&daterange="+info[1]+
"&from="+info[2]+
"&to="+info[3]+
"&limit="+limit+
"&search="+info[4];
$.getJSON(LOCAL_URI+"?action=campaignfiltered"+params, function(result) {
//console.log(JSON.stringify(result));
$('#'+tableName+" tbody").html('');
if(result.length > 0){
$("#msg").html(result.length+ " Records found.");
$.each(result, function(){
var $tr = '<tr><td>'+ this.campaign + "</td><td>"+
this.brandName+"</td><td>"+this.startson+
"</td><td>"+ this.endson +"</td></tr>";    
$('#'+tableName+" tbody").append($tr);
});
}
else{
$("#msg").html('No records found.');
}
});
}

2 个答案:

答案 0 :(得分:1)

要更改select元素,您可能需要不同的值,否则无论您选择哪个option,它都将始终具有相同的值。

我从未设置过没有值的select元素,因此我不能100%确定这是您的问题。如果这恰好是问题,请告诉我,否则我会删除答案。

此外,您的JS需要结束)才有效。

答案 1 :(得分:0)

是的,你应该在下拉列表中分配值,并在jquery中更正你的语法。 我认为以下代码可以帮助您

<script type="text/javascript" language="javascript" >
    $(document).ready(function () {
    $("#showbrand").change(function () {
        var info = new Array();
        info[0] = $("#showbrand").val();
        alert(info[0]);
    });
    });

</script>

<label for="showbrand" class="filter">Brand:
 <select id="showbrand" data-bind=''>
    <option value="1">--select--</option>
    <option value="2">test</option>
    <option value="3">All</option>
 </select>
</label>