We Keep Coding

How to check if the selected value of drop-down is set to No and Text-Box is blank using JavaScript

I have drop-down and text-box in a gridview and I am trying to check if the selected value of a drop-down is set to "No" and no comments is entered in the text-box then i want to show message. The requirement should be as long as the selected value of the drop down is set to No then comments must be entered in the text-box. My issue is that i am getting the message even if the drop-down is set to Yes or comments is provided when the drop down is set to No. Here is the code:
function validate() {
var flag = false;
var gridView = document.getElementById('<%= GridView1.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
var ddl = gridView.rows[i].getElementsByTagName('Select');
var areas = gridView.rows[i].getElementsByTagName('textarea');
if (ddl != null && ddl.length > 1 && ddl[0] != null && areas != null && areas.length > 1 && areas[0] != null) {
if (areas[0].type == "textarea" && ddl[0].type == "select-one") {
var txtval = areas[0].value;
var txtddl = ddl[0].value;
if (txtddl.value == "No" && (txtval == "" || txtval == null)) {
flag = false;
break;
}
else {
flag = true
}
}
}
}
if (!flag) {
alert('Please note that comments is required if drop down is set to No. Thanks');
areas[i].focus();
}
return flag;
}
</script>

You can do like this:
<script>
function validate() {
var flag = false;
var gridView = document.getElementById('<%= GridView1.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
var selects = gridView.rows[i].getElementsByTagName('select');
//var inputs = gridView.rows[i].getElementsByTagName('input');
var areas = gridView.rows[i].getElementsByTagName('textarea');
if (selects != null && areas != null) {
if (areas[0].type == "textarea") {
var txtval = areas[0].value;
var selectval = selects[0].value;
if (selectval == "No" && (txtval == "" || txtval == null)) {
flag = false;
break;
}
else {
flag = true;
}
}
}
}
if (!flag) {
alert('Please enter comments. Thanks');
}
return flag;
}
</script>

Try this:
$('#select').on('change', function () {
var text = $(this).find(":selected").text();
var textBox = $(this).parent().filter('input [name="InputName"]');
if(text == "no" && textBox.val() =="")
{
\\display your message
}
});

Checkbox in HTML turns off a function in a .js file

I am looking to make a checkbox that when unchecked, will turn off a certain function in a .js file. Can someone help me?
popup.html
HTML Check box:
content.js
Turn off this function:
var tweet = new Array();
var tweetName = new Array();
function linkSnipe() {
for (var i = 0; i < 5; i++) {
tweetName[i] = document.getElementsByClassName("fullname js-action-profile-name show-popup-with-id")[0].innerHTML;
tweet[i] = document.getElementsByClassName("js-tweet-text")[i].innerHTML;
}
if (tweet[0].match(shoeName) == shoeName && tweet[0].match(filterer) != filterer && tweet[0].match(filter2) != filter2) {
if(checkon == "Tweets"){
document.getElementsByClassName("twitter-timeline-link")[0].click();
update();
}
}
else if (tweet[1].match(shoeName) == shoeName && tweet[1].match(filterer) != filterer && tweet[1].match(filter2) != filter2) {
if(checkon == "Tweets"){
document.getElementsByClassName("twitter-timeline-link")[1].click();
update();
}
}
else if (tweet[2].match(shoeName) == shoeName && tweet[2].match(filterer) != filterer && tweet[2].match(filter2) != filter2) {
if(checkon == "Tweets"){
document.getElementsByClassName("twitter-timeline-link")[2].click();
update();
}
}
else if (tweet[3].match(shoeName) == shoeName && tweet[3].match(filterer) != filterer && tweet[3].match(filter2) != filter2) {
if(checkon == "Tweets"){
document.getElementsByClassName("twitter-timeline-link")[3].click();
update();
}
}
else if (tweet[4].match(shoeName) == shoeName && tweet[4].match(filterer) != filterer && tweet[4].match(filter2) != filter2) {
if(checkon == "Tweets"){
document.getElementsByClassName("twitter-timeline-link")[4].click();
update();
}
}
else if(checkon == "Tweets") {
location.reload();
}
}
setTimeout("linkSnipe()", 250);
}

When the checkbox is checked, redefine the function as:
<input type=checkbox ..... onchange="doit()">
function doit() {
window.linkSnipe=function() {}
}
I've used this too:
function doit() {
window['linkSnipe']=function() {}
}
If you want to turn the function on and off by the checkbox:
<input type=checkbox ..... onchange="doit(this)">
var linkSnipeSave = linkSnipe;
function doit(ck) {
if (ck.checked)
window['linkSnipe']=linkSnipeSave
else {
linkSnipeSave = linkSnipe; //not sure if this line is needed...pls test
window['linkSnipe']=function() {}
}
}

You could simply have a Boolean variable that changes with the state of your check box. You could then put an if statement around the function call that will only trigger if the checkbox is checked.
http://jsfiddle.net/W5P8X/
//initialize some variables.
bike_checked = false;
car_checked = false;
//get elements by their ID from html
bike = document.getElementById("bike");
car = document.getElementById("car");
//add event listeners to the html elements we found above
bike.addEventListener("click", toggle_bike, false);
car.addEventListener("click", toggle_car, false);
//toggle bike_checked variable on click
function toggle_bike(){
if(bike_checked == true)
bike_checked = false;
else
bike_checked=true;
current_state();
}
//toggle car_checked variable on click
function toggle_car(){
if(car_checked == true)
car_checked = false;
else
car_checked=true;
current_state();
}
//output current state.
function current_state(){
if(car_checked == true)
alert('Car checked');
if(bike_checked == true)
alert('Bike checked');
}
I answered with only javascript and no jQuery, but you could probably make it a bit more concise with jQuery.
I hope this helps.

javascript form validation radio buttons

I trying to do some validation on a form with radio buttons in it. I can get the text elements to work fine but the radio buttons don't seem to like me.
function validateAll(theForm)
{
var err=0;
var fields;
for (var i=0; i<theForm.elements.length; i++)
{
fields =theForm.elements[i];
if(fields.type == "text" || fields.type == "textarea")
{
if(fields.value == "" || fields.value == null){
err++;
validateText(fields.id);
}
}
else if(fields.type == "radio"){
validateRadio(fields)
}
}
if(err > 0){return;}else{document.myform.submit();}
}
function validateText(id)
{
var x=document.forms["myForm"][id].value;
if (x==null || x=="")
{
var text = id+"Text";
document.getElementById(text).style.visibility ="visible";
return;
}else {
var text = id+"Text";
document.getElementById(text).style.visibility="hidden";
return;
}
}
function validateRadio(radios)
{
var id = radios.id;
var text;
for (i = -1; i < radios.length; ++i)
{
if (radios[i].checked) {
text = id+"Text";
document.getElementById(text).style.visibility="hidden";
return true
}}
text = id+"Text";
alert(text);
document.getElementById(text).style.visibility ="visible";
return false;
}
I am just calling it with a input button. Any ideas on why its not working? It turns the text on find but dose not turn it off.

How do unselect after the target has changed IE?

I am working with a dynamic element list of checkboxes and I am at a lose as to how I can go about deselecting the elements after I've processed the request: http://jsfiddle.net/Arandolph0/k7uLg/15/
document.attachEvent('onclick', function (e) {
var myBtn = document.getElementById('mybutton')
var target = e.srcElement;
if (target.name == "mycheckbox1" || target.name == "mycheckbox2") {
if(target.checked){
myBtn.disabled = false;
// list.addRecord(target);
} else if(!list.hasItems()) {
myBtn.disabled = true;
target.checked = false;
}
if(list.hasItems()) {
myBtn.disabled = false;
}
}
});
function someFunction() {
alert("Some function");
}
Here's the Html:
<input type="button" id='mybutton' value="Click" disabled onclick="someFunction()"/>
<input type="checkbox" name='mycheckbox1' />
<input type="checkbox" name='mycheckbox2' />
So, in summary after the button has 'do something' how would I then deselect the checked checkboxes?

You could get all of the checkbox elements by type and then set them to false.
function unselect() {
var elements = document.getElementsByTagName('input');
for(var i = 0; i < elements.length; i++)
{
if(elements[i].type.toLowerCase() == 'checkbox')
elements[i].checked = false;
}
}
It isn't very sexy but it gets the job done.

you just need to use
$("input:checkbox").removeAttr("checked");
this will uncheck all the checkboxes. I have also attached working copy of your code.
$(document).click(function (event) {
var myBtn = document.getElementById('mybutton');
var target = event.target;
if (target.name == "mycheckbox1" || target.name == "mycheckbox2") {
if(target.checked){
myBtn.disabled = false;
// list.addRecord(target);
} else if(!list.hasItems()) {
myBtn.disabled = true;
target.checked = false;
}
$("input:checkbox").removeAttr("checked");
if(list.hasItems()) {
myBtn.disabled = false;
}
}
});
I hope this will be able to solve your problem.

Checkbox and input field value

I have a check box which will change the value of a textfield to 1 when checked and change it back to zero when unchecked, how can I do this? I want it in javascript.

<input type="checkbox" name="foo" onclick="document.getElementById('idtextfield').value = +this.checked;" />

You can do like this:
var chk = document.getElementById('checkbox_id');
var txt = document.getElementById('textbox_id');
chk.onclick = function(){
if (this.checked === true){
txt.value = '1';
}
else{
txt.value = '0';
}
};

window.onload = function() {
var checkBox = document.getElementById('idofcheck');
if (checkBox == null) {
return;
}
checkBox.onclick = function() {
var textField = document.getElementByd('ifoftextfield');
if (textField == null) {
return;
}
if (this.checked) {
textField.value = '1';
} else {
textField.value = '0';
}
};
};

if(document.getElementById("checkbox1").checked)
{
document.getElementById('textbox1').value=1;
}
else
{
document.getElementById('textbox1').value='';
}