[英]How i can make a selected drop down list using jQuery on ruby on rails 2.0 ?
[英]how to make drop down checkbox selected even i reload the page using Jquery and angular 4?
我使用集成了JQuery的angular 4,一旦选择了下拉字段,就不应更改包含下拉复选框的表单,即使我重新加载页面或直到重新选择也是如此。
dropdown.html:
<div class="chkdropdown">
Show and Hide Columns
<ul>
<li>
<input type="checkbox" class="hidecol" value="name" id="col_2" /> S NO
</li>
<li>
<input type="checkbox" class="hidecol" value="name" id="col_3" /> DrugName
</li>
<li>
<input type="checkbox" class="hidecol" value="salary" id="col_4" /> Generic Name
</li>
<li>
<input type="checkbox" class="hidecol" value="gender" id="col_5" /> Generic Combination
</li>
<li>
<input type="checkbox" class="hidecol" value="city" id="col_6" /> Dosage
</li>
<li>
<input type="checkbox" class="hidecol" value="email" id="col_7" /> VAT
</li>
</ul>
</div>
ang.component.ts:
$(document).ready(function(){
$(".hidecol").click(function(){
var id = this.id;
var splitid = id.split("_");
var colno = splitid[1];
var checked = true;
if($(this).is(":checked")){
checked = true;
}else{
checked = false;
}
setTimeout(function(){
if(checked){
$('#drug_table td:nth-child('+colno+')').hide();
$('#drug_table th:nth-child('+colno+')').hide();
} else{
$('#drug_table td:nth-child('+colno+')').show();
$('#drug_table th:nth-child('+colno+')').show();
}
}, 500);
});
});
在您的jquery中将此代码广告
$(document).ready(function(){
//here i checked localstorage values
var checkedvalues = JSON.parse(localStorage.getItem("checkedvalues"));
console.log(checkedvalues);
//created obj to store check values
var someObj={};
someObj.checked=[];
//looped through checkvalues from local storge ad add checked property to its values
$.each(checkedvalues, function(key, value) {
console.log(key,value);
$("#" + value).prop('checked', value);
console.log($("#" + value));
});
$(".hidecol").click(function(){
var id = this.id;
var splitid = id.split("_");
var colno = splitid[1];
var checked = true;
if($(this).is(":checked")){
checked = true;
//push chekced values in above created array.
someObj.checked.push($(this).attr("id"));
console.log(someObj.checked);
//add same values in local storage.
localStorage.setItem("checkedvalues", JSON.stringify(someObj.checked));
}else{
checked = false;
}
setTimeout(function(){
if(checked){
$('#drug_table td:nth-child('+colno+')').hide();
$('#drug_table th:nth-child('+colno+')').hide();
} else{
$('#drug_table td:nth-child('+colno+')').show();
$('#drug_table th:nth-child('+colno+')').show();
}
}, 500);
});
});
而这在HTML
<div class="chkdropdown">
Show and Hide Columns
<ul>
<li>
<input type="checkbox" class="hidecol" value="name" id="col_2" /> S NO
</li>
<li>
<input type="checkbox" class="hidecol" value="name" id="col_3" /> DrugName
</li>
<li>
<input type="checkbox" class="hidecol" value="salary" id="col_4" /> Generic Name
</li>
<li>
<input type="checkbox" class="hidecol" value="gender" id="col_5" /> Generic Combination
</li>
<li>
<input type="checkbox" class="hidecol" value="city" id="col_6" /> Dosage
</li>
<li>
<input type="checkbox" class="hidecol" value="email" id="col_7" /> VAT
</li>
</ul>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.