If condition is true show button - javascript

I'm trying to make a button appear if condition "isauthenticated" is "true".
used this as a reference, but not sure what's wrong with my code.
<button id="authentic" type="hidden">test</button>
<script>
window.onload = function() {
var logedIn = ('{{isauthenticated}}')
if(logedIn == "true") {
document.getElementById('authentic').style.display = 'block';
} else {
document.getElementById('authentic').style.display = 'none';
}
}
</script>

Ok Guys, sorry for the bad question. This is what I was looking for
<script>
var isAuth = ('{{ user.isauthenticated}}');
if (isAuth) true;
document.getElementById("menuProfile").style.display="block";
document.getElementById("showProfile").style.display="none";
</script>

if logedIn is a boolean value you need to remove the "'s from the if(logedIn == "true") { line
or just check:
if(logedIn) {...

Please refer to Boolean Javascript documentatiion:
If the Boolean object has no initial value, or if the passed value is one of the following:
0,-0,null,"",false,undefined,NaN the object is set to false. For any other value it is set to true (even with the string "false")!
see what value does logedIn have before the if!

Related

How can I continue checking validation after first regex passes in javascript?

I have a regex in a javascript that is checked onclientclick. The code I have below works properly if the first check is false, I have a message displayed and it stops before submitting as I would like it to. However, if the first validation checks fine, I want it to check the next set of validations but it just skips the rest and submits. Am I missing something here?
<script type="text/javascript">
function checkall() {
var isValid21 = false;
var regex21 = /(0[0-9]|1[0-9]|2[0-3]):[0-5][0-9]/;
isValid21 = regex21.test(document.getElementById("TimeTest").value);
document.getElementById("spnError21").style.display = !isValid21 ? "block" : "none";
document.getElementById("TimeTest")
return isValid21;
var isValid2 = false;
var DDLOne = document.getElementById("DropDownA");
if (DDLOne.value == "") {
document.getElementById("spnError2").style.display = !isValid2 ? "block" : "none";
document.getElementById("DropDownA")
return false;
}
var submit = 0;
if (++submit > 1) {
alert('Give me a second.');
return false;
}
return true;
}
</script>
<asp:Button ID="Button1" runat="server" Text="Submit" onclientclick="return checkall();" OnClick="Button1_Click" />
Your code is returning immediately after the first check, which is why the second one is never checked. You'll need to change your code to return an aggregate of the two "checks" at the end of your function. Also, your submit variable is declared inside the scope function, which means it will always get initialized to 0. I think you need to declare that outside your function. In addition, what are those empty document.getElementById("...") calls for? They dont do anything. Finally, you are returning true at the very end of your function. You'll need to tweak your logic rules and return the aggregate of isValid21 and isValid2 at the end. You'll have to do the tweaking yourself, as we don't know the required business rules.With all that, I'm not sure that this logic is sound, but this should at least get you going in the right direction:
var submit = 0;
function checkall() {
var isValid21 = false;
var isValid2 = false;
var regex21 = /(0[0-9]|1[0-9]|2[0-3]):[0-5][0-9]/;
isValid21 = regex21.test(document.getElementById("TimeTest").value);
document.getElementById("spnError21").style.display = !isValid21 ? "block" : "none";
var DDLOne = document.getElementById("DropDownA");
if (DDLOne.value == "") {
document.getElementById("spnError2").style.display = !isValid2 ? "block" : "none";
isValid2 = false;
}
if (++submit > 1) {
alert('Give me a second.');
isValid2 = false;
}
//SOME OTHER LOGIC RULES THAT CHANGE isValid2 TO TRUE...
//YOU WILL NEED TO DO SOME ADDITIONAL LOGIC TWEAKING BEFORE THIS LINE. AS IT STANDS NOW, THIS WILL ALWAYS RETURN FALSE.
return isValid21 && isValid2;
}

Uncaught ReferenceError: parentsCheck is not defined

I am very new to JS, but am trying to create a checkbox that when checked will reveal a div with an id of "second_row", and when unchecked will hide it (unchecked by default). Am I missing some code? Is my syntax incorrect? I could really use some help. Thanks for givin a newbie a hand!
Html:
<input type="checkbox" name="under_18" id="under_18" class="check" value="under_18" form="contest_form" onclick="parentsCheck()" />
JavaScript:
<script>
function parentsCheck()
{
var check1 = document.getElementById('under_18'),
if (check1.checked === true) {
document.getElementById('second_row').style.display = 'block';
}
else if (check1.checked === false) {
document.getElementById('second_row').style.display = 'none';
}
}
</script>
P.S. Dont know if it matters, but the checkbox is in a table cell.
Your , at the end of the var statement should be a ;.
It's causing a SyntaxError, causing the JavaScript block to be effectively ignored, so parentsCheck() is never defined.
var check1 = document.getElementById('under_18');
http://jsfiddle.net/tYv28/
As an aside, check1.checked will always return a boolean, so you don't need to do the === true and === false comparison; the following will work just fine:
function parentsCheck()
{
var check1 = document.getElementById('under_18');
if (check1.checked) {
document.getElementById('second_row').style.display = 'block';
} else {
document.getElementById('second_row').style.display = 'none';
}
}
When using event handler attributes, JavaScript only recognizes functions in the global scope. Try defining the event handler in your JavaScript, which also has the benefit of being unobtrusive:
var el = document.getElementById('under_18');
el.onclick = parentsCheck; // <---- This
jsFiddle
Also, you need to change the , into a ;.

If statement in .aspx page

I am attempting to include an If statement in some Javascript on my .aspx page.
I declare FinishedPacking at the beginning of the page as False. Then when a user clicks the orderSubmit button, the if Statement evaluates if the value is indeed false, if so, display an alert. So far the if statement does not work. If I use just the alert with no if statement it displays the alert:
var FinishedPacking = false;
$("#orderSubmit").click(function (e) {
if (FinishedPacking = false) {
alert("The order is not finished.")
}
ClearScreen();
GetOrder();
}):
As stated if I do not include the if statement, the alert works when I click the order button. Not sure why this simple If statement is not being picked up.
You need the double-equals
if (FinishedPacking = false)
should be
if (FinishedPacking == false)
Try this
var FinishedPacking = false;
$("#orderSubmit").click(function (e) {
if (FinishedPacking == false) {
alert("The order is not finished.")
}
ClearScreen();
GetOrder();
}):
You need 2 ='s signs
if (FinishedPacking == false) {
You are trying to ASSIGN false to the variable FinishedPacking inside your condition (which is wrong) you want to COMPARE the values.

Why is my localStorage code not working?

I'm trying to make a div div disappear and stay gone even when the user comes back. It doesn't seem to do what I want. When I press the button, nothing happens. Not even the value of the localStorage changes...
localStorage.done = localStorage.done || false;
$('#myButton').addEventListener('click', function() {
if (!localStorage.done) {
localStorage.done = true;
$('#myDiv').style.display = "none";
}
});
You code for the localStorage is actually working (even if its suggested to use its getter/setter methods instead of direct property access).
Your problem is this:
$('#myButton').addEventListener('click', function() {
jQuery does not know about .addEventListener you want just to call .bind()
localStorage.done = localStorage.done || false;
$('#myButton').bind('click', function() {
if (!localStorage.done) {
localStorage.done = true;
$('#myDiv').hide();
}
});
localStorage only stores strings. Thus, localStorage.done = false serializes to "false". The following code will fix your problem (see JSFiddle):
localStorage.done = localStorage.done || "false";
document.getElementById('myButton').addEventListener('click', function() {
if (localStorage.done == "false") {
localStorage.done = "true";
document.getElementById('myDiv').style.display = "none";
}
});
Note, to avoid confusion with jQuery, I used standard DOM "getElementById". You can also consider using "0" and "1" instead of "true" and "false".
While this restriction is not present in the W3 Specification, it applies to current browsers. See this post for more information. Happy coding!

how to change textbox background color through javascript?

my javascript-
function validate_loginform(loginform)
{
var uid = loginform.uid.value;
var pass = loginform.pass.value;
if(uid == "")
{
color('uid');
return false;
}
if(pass == 0)
{
color('pass');
return false;
}
return true;
}
function color(traget)
{
var targetbox = document.getElementById(target);
targetbox.style.backgroundColor="red";
}
but background color is not getting changed even it is not returning fasle value. if I remove the color('uid'); nad put alert("user name required"); then this script is working fine.Whats wrong?
it backgroundColor in actual program I just missed it here only
With jQuery you could try this:
$("#textbox").css("background-color", "red");
dont call color function, change color inside if condition like-
if(uid == "")
{
//alert("You must enter User ID.","error");
loginform.uid.style.borderColor='red';
loginform.uid.focus();
return false;
}
Typo?
backgroungColor
^
Update
Typo?
function color(traget)
^^^^^^
{
var targetbox = document.getElementById(target);
Seriously, actual code does matter.
Beware your spelling. It should be "target", not "traget".
function color(traget)
You've spelt target wrong in your function header and background wrong in the last line of the function.
just remove the single quote (') from color('uid')
and write it as color(uid);

Categories