javascript inner/sub function returns issue - javascript

My Problem is that if validation_form function return false it stop execute and does not process other statement.
I need to execute all statement at once.
My code for validating form is as below.
jQuery("#submitsuggestevent").click(function (e) {
e.preventDefault();
var flag = true;
var event_title = $('#title');
var country = $('select[name="country"]');
var state = $('select[name="state"]');
var venue = $('select[name="venue"]');
var category = $('select[name="category"]');
flag = flag && validation_form(event_title);
flag = flag && validation_form(country);
flag = flag && validation_form(state);
flag = flag && validation_form(venue);
flag = flag && validation_form(category);
if(flag){
$('#frmevents').submit();
}
});
function validation_form(ele) {
if ($.trim(ele.val()) == '' || typeof(ele.val()) === 'undefined') {
return false;
}
else {
return true;
}
}

This could be the problem
flag = flag && validation_form(event_title);
flag = flag && validation_form(country);
flag = flag && validation_form(state);
flag = flag && validation_form(venue);
flag = flag && validation_form(category);
javascript runtime may be smarter and convert above code block to
flag=validation_form(event_title)&&validation_form(country)&&validation_form(state)&&validation_form(venue)&&validation_form(category);
As you know in && operations if left side evaluated to false right side is ignored(as false&&whatever is false anyway).
Solution is to have something like
var val_title = validation_form(event_title);
var val_country = validation_form(country);
etc and finally
flag = val_title&& val_country&&....

Related

I am trying to make a login screen with javascript but it does not load when open the page

I have made 2 variables named username and password and I want to test if they are both true but the prompt does not seem to pop up. I do not understand, I also am pretty new to code and really want to learn how to do this
var 1 = false;
var 2 - false;
function login() {
var username = prompt("Username");
var password = prompt("Password");
if (username == "wouterXD") {
1 = true;
} else {
1 = false;
}
if (password == "Wout2003!") {
2 = true;
} else {
2 = false;
}
};
if (1 = false && 2 = false) {
alert("Wrong Password and Username!");
login();
}
There is so much wrong with your code, this should work though.
What you got wrong is:
You cannot set variables using the - operator
You cannot compare in an if-statement using single =
You cannot name variables with numbers.
var unc = false; // username correct
var pwc = false; // password correct
while (!login());
function login() {
var username = prompt("Username");
var password = prompt("Password");
if (username == "wouterXD") {
unc = true;
} else {
unc = false;
}
if (password == "Wout2003!") {
pwc = true;
} else {
pwc = false;
}
if (unc && pwc){
return true;
} else {
return false;
}
};
var 1 = false;
means that a variable called 1 will get the value of false. But this is syntactically incorrect. It is invalid to name your variables with integer names. You are also confused about the meaning of =, which is the assignment operator. Let's see a simplified solution:
var uCorrect = false;
var pCorrect = false;
function login() {
uCorrect = (prompt("Username") == "wouterXD");
pCorrect = (prompt("Password") == "Wout2003");
if ((!uCorrect) && (!pCorrect)) {
alert("Wrong Password and Username!");
}
return uCorrect && pCorrect;
}
while (!login());
Or an extremely simplified solution, if you do not need to store these data:
function login() {
return (prompt("Username") == "wouterXD") && prompt("Password") == "Wout2003";
}
while (!login());
So many things are wrong with this code...
First of all, never name your variables as integers... so rename them to something more... suitable.
Secondly, your var 2 is wrong. You've got a subtraction sign not an equals.
Least but not last, your logical operator is also wrong.
Single equals sign is assigning values, in your if statement you should check if they are the same, so a double sign is needed like so
if(firstVariable == false && secondVariable == false){
}
You won't achieve the functionality you want anyway after correcting those mistakes. The last operator (the one I posted above) is outside the function body, i.e. it won't execute when the function is ran.
var firstVariable = false;
var secondVariable = false;
function login() {
var username = prompt("Username");
var password = prompt("Password");
if (username == "wouterXD") {
firstVariable = true;
} else {
firstVariable = false;
}
if (password == "Wout2003!") {
secondVariable = true;
} else {
secondVariable = false;
}
if (firstVariable = false && secondVariable = false) {
alert("Wrong Password and Username!");
login();
}
};

How to call a function with the opposite boolean to what it was previously called with

Right, so I am making an Agario extension.
I want it so when you press a button (m) it will call a function (the setShowMass) function with the opposite boolean to what is was called with last time.
document.addEventListener('keydown',function(e){
var key = e.keyCode || e.which;
if(key == 71){
window.agar.drawGrid = !window.agar.drawGrid;
}
if(key == 77){
setShowMass(!massShown);
massShown = !massShown;
}
});
You can cache the result:
var oppositebool = true;
document.addEventListener('keydown',function(e){
var key = e.keyCode || e.which;
if(key == 71){
window.agar.drawGrid = !window.agar.drawGrid;
}
if(key == 77){
setShowMass(oppositebool);
oppositebool = !oppositebool;
}
});
You could also create a function that wraps another function and calls that function switching between true and false every time.
const trueFalse = (fn, initial) => {
return () => {
fn(initial);
initial = !initial;
}
};
const log = (bool) => console.log(bool);
const switchingLog = trueFalse(log, true);
switchingLog(); // true
switchingLog(); // false
switchingLog(); // true
You can create a wrapper function that remembers the last value. For example:
function callWithOppositeBoolean(func, startingValue) {
var bool = !startingValue;
return function() {
bool = !bool;
return func(bool);
}
}
Then you can use this to create a wrapped function that calls the original function, alternating with true and false:
var toggleShowMass = callWithOppositeBoolean(showMass, true);
toggleShowMass(); // showMass(true)
toggleShowMass(); // showMass(false)
toggleShowMass(); // showMass(true)

Only include a variable in an if statement, if another variable exists?

The following function is meant to check to see if a custom Date widget (javascript) is empty or not. Problem is, there are many variations of this widget where M/D/Y fields display, or it could be M/D or, M/Y.
Of course, I could hard code all the combinations as if checks, but is there a better way of saying "there are 3 possible nodes, that might have values...if x out of 3 nodes exist AND they all have values, set empty to false."
checkIfEmpty: function () {
var empty = true;
var mNode = this.getNode('month');
var month = mNode ? mNode.value : null;
var dNode = this.getNode('day');
var day = dNode ? dNode.value : null;
var yNode = this.getNode('year');
var year = yNode ? yNode.value : null;
if (month && day && year) {
empty = false;
}
return empty;
}
checkIfEmpty: function () {
var empty = true;
var dateParts = [];
var mNode = this.getNode('month');
if(mNode && mNode.value){
dateParts.push('month');
}
var dNode = this.getNode('day');
if(dNode && dNode.value){
dateParts.push('day');
}
var yNode = this.getNode('year');
if(yNode && yNode.value){
dateParts.push('year');
}
if (dateParts.length) {
empty = false;
}
return empty;
}
You can add to see if the node does not exist
if ( (!mNode || month) && (!dNode || day) && (!yNode || year) ) {
checkIfEmpty: function () {
var empty = false;
var mNode = this.getNode('month');
if(mNode && !mNode.value) {
empty = true;
}
var dNode = this.getNode('day');
if(dNode && !dNode.value) {
empty = true;
}
var yNode = this.getNode('year');
if(yNode && !yNode.value) {
empty = true;
}
return empty;
}
Trying to solve my own question - so far, this is the most efficient way of achieving what I am trying to do. Anyone, suggestions on how to make it even more efficient?
If the value property exists for all valid nodes then:
if(mNode && dNode && yNode){
empty = false;
}
Otherwise:
if(mNode && mNode.value && dNode && dNode.value && yNode && yNode.value){
empty = false;
}
I am not sure if I followed, but if you need that at least one to be true so empty is false then:
if(mNode || dNode || yNode) {
empty = false;
}
Again, if the value property is not standard for all nodes:
if((mNode && mNode.value) || (dNode && dNode.value) || (yNode && yNode.value)){
empty = false;
}
I think it's clearer if you think about it this way:
If (node && node.value) returns a truthy value then the date property exists otherwise the date property doesn't exist.

JavaScript true false not executing correctly in if else statement

For some reason when I'm using the true/false values and checking if at least one of the values is true, the if/else statement is not working correctly.
I have this:
$scope.checkValues = function (qId) {
var airport = $scope.airports[0].questID;
var destAirport = $scope.destAirports[0].questID;
var airportVal = isFalseOrUndefined($scope.answers[airport]);
var destAirportVal = isFalseOrUndefined($scope.answers[destAirport])
if (airportVal == false || destAirportVal == false) {
$surveyNav.skipPage = true;
}
}
function isFalseOrUndefined(val) {
if(val == null || val === false) {
return true;
} else {
return false;
}
}
In this image below, as you can see the value for airportVal is true, the other value for destAirportVal in that same scenario is true, but I'm still able to get correctly in to the if condition and set the scope value.
Does anyone see any issue?
You should be using === and !== operators when checking for equality in Javascript.
Javascript Comparison and Logical operators
op1 === op2 - Will check if op1 is explicitly equal to op2
op1 !== op2 - Will check if op1 is not explicitly equal to op2
Also: you can condense you isFalseOrUndefined function
Note 1: you are not actually checking if val is undefined.
To check if something is undefined: typeof val === 'undefined'
This is different than checking if a variable is null
Note 2: Keep in mind that your variables are not entirely clear here. airportVal will be equal to true when $scope.answers[airport] is false or null. Is this your intention?
$scope.checkValues = function (qId) {
var airport = $scope.airports[0].questID;
var destAirport = $scope.destAirports[0].questID;
var airportVal = isFalseOrUndefined($scope.answers[airport]);
var destAirportVal = isFalseOrUndefined($scope.answers[destAirport])
if (airportVal === false || destAirportVal === false) {
$surveyNav.skipPage = true;
}
}
function isFalseOrUndefined(val) {
return (val === null || val === false);
}
Your function should probably do what it claims to do:
function isFalseOrUndefined(val) {
return typeof val === 'undefined' || val === false || val === null || val === ''/* add this if you think it should be falsy*/;
}
But then, testing for !val should be sufficient:
$scope.checkValues = function (qId) {
var airport = $scope.airports[0].questID;
var destAirport = $scope.destAirports[0].questID;
if (!airport || !destAirport) {
$surveyNav.skipPage = true;
}
}

JS attribut-value onclick replace

I use codemirror and jquery to "simulate" an xml-editor in the browser. Some xml-Tags include an "on"-attribute with two possible values (true or false). Would it be possible to toggle these values at an onclick event? Is a codemirror/jquery plugin available?
EDIT :
self-coded solution.
function attrtoggle(){
var pos = editor.getCursor();
var line = editor.getLine(pos.line);
var index = line.indexOf("on=");
if(index > 0){
//define range
if ( pos.ch -3 < index || pos.ch - 9 > index)
return false;
var len = 10;
var replace_pos = index + 4;
if(line.charAt(replace_pos) == "t"){
//insert false
line = line.replace('true', 'false');
} else{
//insert true
line = line.replace('false', 'true');
}
edited = pos.line;
editor.setLine(pos.line, line);
}
}
Just add an event-handler for the onclick event
$(".CodeMirror").attr("onclick","javascript:attrtoggle()");
By far not perfect (bad design and so on) , but it works as expected:
Just trigger the function at an onclick event.
function attributeToggle(){
var transitions = {
"on": {
"false":"true",
"true":"false"
}
}
var pos = editor.getCursor(); // object {line, ch}
var token = editor.getTokenAt(pos);
var line = editor.getLine(pos.line);
try{
var prev_pos = token.start - 1;
var prev_token = editor.getTokenAt({'line':pos.line, 'ch':prev_pos});
if(prev_token.className == "attribute")
var attr = prev_token.string;
else
return false;
if(typeof transitions[attr] === "undefined") //nothing to replace
return false;
var current_val = token.string.toLowerCase().replace(/(['"])/g, "");
if(typeof transitions[attr][current_val] === "undefined")
return false;
var line_new = line.substring(0, token.start) + \
"\"" + transitions[attr][current_val] + "\"" + line.substring(token.end);
editor.setLine(pos.line, line_new);
} catch (e){
console.log(e);
}
}

Categories