Develop Reference

If function not triggering after Boolean change?

I have a system where once a certain key is pressed, a Boolean changes to true and the program should trigger an if loop. However, once the key is pressed, the program 'locks up' and is unresponsive. (The program should be automatically moving the paddle, and the whole thing should be able to be turned off, but it seems as though it simply isn't activating.
Here's the offending code:
var aienable = false;
$(document).keydown(function(keyPressed){
if (keyPressed.keyCode == 192 && aienable == false){
aienable = true;
}
});
if (aienable == true){
var AIdrive = setInterval(function(){
$(document).keydown(function(keyPressed){
if (keyPressed.keyCode == 192 && aienable == true){
aienable = false;
}
});
if (aienable == false){
clearInterval(AIdrive);
}
},1000);
}
Note: The key used is `

In Your code
if (aienable == true){
is executed once, just after
var aienable = false;
And the condition is always false.
Changing value of aienable is executed when You press a key.
Secondary if should be inside keydown event handler just after first if

You will have to put the boolean condition code in a function and call it from inside the key down handler. the variable has value true after key pressing but the code is not being notified that as it has already been run.

How to specify whether event listeners can be called or not depending on a variable?

I have a variable which is assigned a value dependent on a value in a table in a db. How can I use this variable to specify whether certain event listeners are active and to specify whether particular links are shown.
For instance I have tried but did not successfully work:
var accessLevel = 0;
var userLoggedIn = "<?php Print($userLoggedIn); ?>";
var userlevel = "<?php Print($userLevel); ?>";
function map_initialize()
{
////CONCERNING THIS PART#########///
if (accessLevel >= 2){ //WHEN LOADED THIS IS NOT REGISTERING ANY RIGHT CLICK EVEN WHEN accessLevel is over 2!
google.maps.event.addListener(map, 'rightclick', function(event) {
//Some function that I don't want to run if accessLevel is <2
});
}
}
////THIS WORKS FINE BELOW JUST PROVIDING IT
if (userLoggedIn == true) {
if (userlevel == "0") {
accessLevel = 0;
console.log(accessLevel);
}
else if (userlevel == "1") {
accessLevel = 1;
console.log(accessLevel);
}
else if (userlevel == "2"){
accessLevel = 2;
console.log(accessLevel);
}
else if (userlevel == "3"){
accessLevel = 3;
console.log(accessLevel);
}
else if (userlevel == "4"){
accessLevel = 4;
console.log(accessLevel);
}
}
I don't know if this will make sense, but basically I want to be able filter certain available functions depending on what accessLevel's value is. Is this possible (specifically to use with google maps elements as well), and how can I do it.

You should change )}; to }); in the thirteenth line of the sample code.
Also change userLoggedIn == true to something like:
userLoggedIn.toLowerCase().trim() === "true"
Assuming possible values of $userLevel are TRUE, FALSE, true, false.

Solved it, All I had to do was swap the location of the if statement so that it was within the click event listener as so.
function map_initialize()
{
google.maps.event.addListener(map, 'rightclick', function(event) {
if (accessLevel >= 2){
//Some function that I don't want to run if accessLevel is <2
}
});
}

Checkbox is still showing true when unchecked jQuery

Ok, so I'm currently having an issue with the $.prop('checked') functionality. When unchecking some of my boxes, and using this function to read the checkboxes, all of them are still showing up as true when some of them should be showing up as unchecked. The part of the function that checks this is below, but some background: I'm using a table with input values in each td element and due to the way it's written, I'm having to gather all the info / validate / and check by using a td.each() function.
$("td", ele).each(function(idx){
var before = $('.e_content', this),
b_name = $('input:last[type!="hidden"], textarea:last, checkbox:last, select:last', this).attr('name'),
b_val = $('input[name="'+b_name+'"], select:last, textarea[name="'+b_name+'"]', this).val(),
b_chx = $('input:checkbox[name="'+b_name+'"]', this).prop('checked'),
after = function(){
before.hide();
$(ele).css("background", color);
$('td.edit', ele).show();
$('td.save', ele).hide();
$('span', this)
// WORKING ON TAKING THE VALUE OF THE .e_content FORM AND REPLACING THE SPAN WITH IT
.html(function(){
console.log(b_name+' : '+b_chx);
if(b_val != undefined && b_val != ''){
if(b_name == 'StageType'){
if(b_val == 1){ return 'Voice'; }
if(b_val == 2){ return 'Text'; }
if(b_val == 3){ return 'Email'; }
}
else if(b_name == 'qtrhour') {
return $('select', before).find(':selected').text();
}
else if(b_chx == true) { return '✓'; }
else if(b_chx == false) { return '✗'; }
else {
if(before.find('input:last').prop('type') != 'checkbox')
return b_val.replace(/\n\r?/g, '<br />');
}
}
})
.show();
};
$(this).html(after);
});
The problem is with this line:
b_chx = $('input:checkbox[name="'+b_name+'"]', this).prop('checked'),
It's coming up always as true even when the checkbox has been unchecked before the save button is hit. This function fires on the .save click event. Hopefully this is enough to determine what might be going wrong.

You can try the following,
$('input:checkbox[name="'+b_name+'"]', this).is(':checked');

To avoid issues regarding to checking or unchecking checkboxes, I normally use jQuery.attr()
$(...).attr('checked')
$(...).attr('checked','checked')
$(...).removeAttr('checked')
Also sometimes I check or uncheck them binding or triggering a .click() function.

Need help in Javascript onChange event

On change of a dropdown value, I need to confirm whether the user wants to change the value or changed it by mistake.
If user clicks on OK then system should apply the modification, otherwise the value should not change.
As of now I have written code as follows:
document.getElementById("dropdownid").onchange = function (){
var a = confirm("Do you want to change");
if (a == true){
return true;
}
if (a == false){
return this;
}
}
here am getting the confirm box but regardless of whether if I press OK or Cancel, the dropdown always shows the new value.

check this fiddle
var drop = document.getElementById("dropdownid");
var selected =drop.options[drop.selectedIndex]; //save selection initially
drop.onclick = function (e){
selected = drop.options[drop.selectedIndex]; // save current selection
}
drop.onchange = function (e){
var a = confirm("Do you want to change");
if (a == false) // no need to check for true
{
selected.selected=true; // if cancel, set the existing selected option
}
}

Please try this:
document.getElementById("dropdownid").onchange = function (){
var a = confirm("Do you want to change");
if (a == true)
{
return true;
}
if (a == false)
{
return false;
}
}

You can undo the selection like this:
document.getElementById("dropdownid").onchange = function (){
if (!confirm("Do you want to change")) {
if (typeof this.prevVal=='undefined') {
this.prevVal=this.options[0].value;
for (var i=0;i<this.options.length;i++)
if (this.options[i].defaultSelected)
this.prevVal=this.options[i].value;
}
this.value=this.prevVal;
} else {
this.prevVal=this.value;
}
}
Basically you save in an attribute the previously selected value, and you search for the default value if not changed yet.

try using this code
document.getElementById("dropdownid").onchange = function (eve){
var a = confirm("Do you want to change");
if (a == true){
return true;
}
if (a == false){
eve.preventDefault();
}
}

how to include multiple if statement conditions in jQuery

I have an if statement that needs to look like this:
UPDATE
$("input#textbox").keypress(function(e){
key==e.which;
if($("input#textbox").length <=7 && (key===13 || $("div#search-button").click())){
/////SOME FUNCTION////
};
});
I'm trying to execute the "SOME FUNCTION" area only if the input length is <=7 and either the enter button is pressed or the "search" button is clicked.
Furthermore, I want to combine these 2 different function initiators so that they execute the same function but don't know how to do it:
$("input#textbox").keypress(function(e){
FUNCTION A
};
AND
$("div#search-button").click(function(){
FUNCTION A
};

EDIT:
This is what you have to do:
I am assuming that you want the text length and not number of textboxes.
You want to execute FunctionA when enter is pressed on textbox or search button is clicked:
$("input#textbox").keypress(function(e){
key==e.which;
if (key === 13) // if enter is pressed
{
if ("#textbox").val().length >= 7) //if textbox has more than 7 characters
{
functionA();
}
}
});
$("div#search-button").click(function(){ functionA();});
HTH

This is how I would do it:
$("#search-button").click(function(){
$("#textbox").keypress(function(e,clicked){
(clicked || e.which===13) && $(this).val().length < 8 && functionA();
}).trigger("keypress",[true]);
});
function functionA(){
alert("hey!");
}