/    Sign up×
Community /Pin to ProfileBookmark

Simple alert not working

Well I have a somewhat lengthy Javascript that I’ve written myself, with one component that I borrowed from somewhere else online, and all is well except for one thing: at the top of the script I define a variable named “glitch” to 0. Throughout the script, as it checks the form, if an error occurs it sets the variable glitch to 1 and throws an alert. This works. At the very bottom of the script I want to know if a glitch was found so that I can or cannot set a cookie, and it doesn’t work.

In fact, unless I comment out portions of the code I can’t get the if statement OR the alert(glitch) above it at the very bottom to work. It just ignores it. Why does this happen? Here’s my code. I’m sorry, this is probably a beast to look at. It seems that the IF statement at the bottom is totally neglected. It never returns “true” but the form can still be submitted so long as all the fields are filled out properly.

[CODE]<script language=”JavaScript” type=”text/javascript”>
function checkForm() {

var glitch = 0;

var div1 = document.getElementById(“divStartTime”);
var div2 = document.getElementById(“divEndTime”);
var div3 = document.getElementById(“divFirstName”);
var div4 = document.getElementById(“divLastName”);
var div5 = document.getElementById(“divPhoneNumber”);
var div6 = document.getElementById(“divEmailAddress”);

div1.style.color = “#000000”;
div2.style.color = “#000000”;
div3.style.color = “#000000”;
div4.style.color = “#000000”;
div5.style.color = “#000000”;
div6.style.color = “#000000”;

var thisLocation = <cfoutput>#id#</cfoutput>;
var timeAvailable = 1;
var thisDay = “<cfoutput>#DateFormat(today, “DDDD”)#</cfoutput>”;

var startTime = document.forms[“calendarmain”][“startTime”].value;
var endTime = document.forms[“calendarmain”][“endTime”].value;

if (eval(startTime) > 0 && eval(endTime) > 0) {
if (eval(startTime) >= eval(endTime)) {
alert(“The Start time must be earlier than the End time.”);
div1.style.color = “red”;
div2.style.color = “red”;
glitch = 1;
return false;
}
} else {
if (! eval(startTime) && eval(endTime) > 0) {
div1.style.color = “red”;
alert(“You must choose a Start time for your lesson.”);
glitch = 1;
return false;
} else if (! eval(endTime) && eval(startTime) > 0) {
div2.style.color = “red”;
alert(“You must choose an End time for your lesson.”);
glitch = 1;
return false;
} else {
div1.style.color = “red”;
div2.style.color = “red”;
alert(“You must choose a value for both Start and End time of your lesson.”);
glitch = 1;
return false;
}
}
<cfoutput query=”getSchedule”>
<cfset xTime = xTime + 1>
var xTime#xTime#A = #starttime#;
var xTime#xTime#B = #endTime#;
</cfoutput>
<cfset xTime = xTime + 1>
<cfif xTime eq 1>
var xTime1A = 0;
var xTime1B = 0;
</cfif>
if (thisLocation == 2 && thisDay == “Thursday” || thisLocation == 1) {
for (x = 1; x < <cfoutput> #xTime#</cfoutput>; x++) {
if (eval(startTime) < eval(“xTime” + x + “A”) && eval(endTime) < eval(“xTime” + x + “A”) || eval(startTime) > eval(“xTime” + x + “B”) && eval(endTime) > eval(“xTime” + x + “B”) || eval(startTime) < eval(“xTime” + x + “A”) && eval(endTime) == eval(“xTime” + x + “A”) || eval(startTime) == eval(“xTime” + x + “B”) && eval(endTime) > eval(“xTime” + x + “B”)) {
timeAvailable = 1;
} else {
timeAvailable = 0;
alert(“Sorry, but the time you selected is already reserved. Please choose a time that is not blocked out in the schedule on the right.”);
glitch = 1;
return false;
break;
}
}
} else {
timeAvailble = 0;
alert(“Lessons in New York can only be booked on Thursdays.”);
glitch = 1;
return false;
}

var startValue = “<cfoutput>#DateFormat(today, “dd.mm.yyyy”)#</cfoutput>, ” + startTime.replace(/.25/g, “”).replace(/.5/g, “”).replace(/.75/g, “”) + “:00:00”;

var re = /[.:]|, /,
date1 = startValue.split(re).map(Number),
date2 = “<cfoutput>#DateFormat(Now(), “dd.mm.yyyy”)#</cfoutput>, <cfoutput>#TimeFormat(Now(), “HH”)#</cfoutput>:00:00″.split(re).map(Number);

var diffMs = Date.UTC( date1[2], date1[1] – 1, date1[0], date1[3], date1[4], date1[5] ) – Date.UTC( date2[2], date2[1] – 1, date2[0], date2[3], date2[4], date2[5] );
var hours = diffMs / (3600 * 1000);

if (hours < 24) {
alert(“You must book your lesson at least 24 hours in advance.”);
glitch = 1;
return false;
} else if (hours > 1080) {
alert(“Please call our school to book a lesson more than 6 weeks in advance. The phone number is (XXX)-XXX-XXXX. Thank you.”);
glitch = 1;
return false;
}

var nameFirst = document.forms[“calendarmain”][“firstName”].value;
nameFirst = nameFirst.replace(/s/g, “”)

if (! nameFirst.length) {
document.forms[“calendarmain”][“firstName”].value = “”;
div3.style.color = “red”;
alert(“Please enter your First Name.”);
glitch = 1;
return false;
}

var nameLast = document.forms[“calendarmain”][“lastName”].value;
nameLast = nameLast.replace(/s/g, “”);

if (! nameLast.length) {
document.forms[“calendarmain”][“lastName”].value = “”;
div4.style.color = “red”;
alert(“Please enter your Last Name.”);
glitch = 1;
return false;
}

var phone = document.forms[“calendarmain”][“phoneNumber”].value;
phone = phone.replace(/s/g, “”);

if (! phone.length) {
document.forms[“calendarmain”][“phoneNumber”].value = “”;
div5.style.color = “red”;
alert(“Please enter your Phone Number.”);
glitch = 1;
return false;
}

var email = document.forms[“calendarmain”][“emailAddress”].value;
var atpos = email.indexOf(“@”);
var point = email.lastIndexOf(“.”);

if (atpos < 1 || point < atpos + 2 || dotpos + 2 >= email.length) {
document.forms[“calendarmain”][“emailAddress”].value = “”;
div6.style.color = “red”;
alert(“Please enter your Email Address.”);
glitch = 1;
return false;
}

alert(glitch);

if (glitch) {
return false;
} else {
document.cookie = ‘JSTEST=1; path=/;’;
return true;
}
}
</script>[/CODE]

There’s a little bit of ColdFusion in there which is run server-side. Essentially though, the very last IF statement above is totally ignored, along with the alert(glitch) above it. However, the script, otherwise, performs perfectly and runs very smoothly.

to post a comment
JavaScript

8 Comments(s)

Copy linkTweet thisAlerts:
@Logic_AliAug 02.2013 — the very last IF statement above is totally ignored, along with the alert(glitch) above it.[/QUOTE]

Any error messages in the console?
Copy linkTweet thisAlerts:
@tenfoldAug 03.2013 — Always check your error console.

You have an error here
[CODE]var thisLocation = < cfoutput > #id# < /cfoutput>;[/CODE]

And here
[CODE]var thisDay = "<cfoutput>#DateFormat(today, "DDDD")#</cfoutput > ";[/CODE]

And more I'm sure. Check your error console.
Copy linkTweet thisAlerts:
@MannequinauthorAug 03.2013 — I'm not really using a console, I'm coding this in Notepad. I'm doing this more as a favor for my old company and haven't been into hardcore programming for several years, so I don't have any robust development software. (Would you recommend something?) Anyway, you may be getting errors because you're seeing some server-side code embedded in the script so at face value it will read as broken. Here it is, same code, but with the server-side portion rendered into the script. Again, the script works except for the last part. I'm very curious why... and I guess this is more of a philosophical question that you might be able to answer without actually looking at the code. And the question is: why would an alert() not run assuming it was coded properly? I would imagine the code preceding it could have an impact on its ability to run if there were issues with that. But what if the code before it works? What if it does the job it's supposed to do, very precisely? How can then an alert() function not work? Why?

Anyway, here's the code, re-rendered. I've highlighted in bold/italics at the bottom the part that is neglected, yet everything above it works like a charm.

&lt;script language="JavaScript" type="text/javascript"&gt;
function checkForm() {

<i> </i> var glitch = 0;

<i> </i> var div1 = document.getElementById("divStartTime");
<i> </i> var div2 = document.getElementById("divEndTime");
<i> </i> var div3 = document.getElementById("divFirstName");
<i> </i> var div4 = document.getElementById("divLastName");
<i> </i> var div5 = document.getElementById("divPhoneNumber");
<i> </i> var div6 = document.getElementById("divEmailAddress");

<i> </i> div1.style.color = "#000000";
<i> </i> div2.style.color = "#000000";
<i> </i> div3.style.color = "#000000";
<i> </i> div4.style.color = "#000000";
<i> </i> div5.style.color = "#000000";
<i> </i> div6.style.color = "#000000";

<i> </i> var thisLocation = 1;
<i> </i> var timeAvailable = 1;
<i> </i> var thisDay = "Sunday";

<i> </i> var startTime = document.forms["calendarmain"]["startTime"].value;
<i> </i> var endTime = document.forms["calendarmain"]["endTime"].value;

<i> </i> if (eval(startTime) &gt; 0 &amp;&amp; eval(endTime) &gt; 0) {
<i> </i> if (eval(startTime) &gt;= eval(endTime)) {
<i> </i> alert("The Start time must be earlier than the End time.");
<i> </i> div1.style.color = "red";
<i> </i> div2.style.color = "red";
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }
<i> </i> } else {
<i> </i> if (! eval(startTime) &amp;&amp; eval(endTime) &gt; 0) {
<i> </i> div1.style.color = "red";
<i> </i> alert("You must choose a Start time for your lesson.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> } else if (! eval(endTime) &amp;&amp; eval(startTime) &gt; 0) {
<i> </i> div2.style.color = "red";
<i> </i> alert("You must choose an End time for your lesson.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> } else {
<i> </i> div1.style.color = "red";
<i> </i> div2.style.color = "red";
<i> </i> alert("You must choose a value for both Start and End time of your lesson.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }
<i> </i> }

<i> </i> var xTime1A = 9.00;
<i> </i> var xTime1B = 12.50;

<i> </i> var xTime2A = 12.50;
<i> </i> var xTime2B = 14.50;

<i> </i> var xTime3A = 15.00;
<i> </i> var xTime3B = 17.00;

<i> </i> if (thisLocation == 2 &amp;&amp; thisDay == "Thursday" || thisLocation == 1) {
<i> </i> for (x = 1; x &lt; 4; x++) {
<i> </i> if (eval(startTime) &lt; eval("xTime" + x + "A") &amp;&amp; eval(endTime) &lt; eval("xTime" + x + "A") || eval(startTime) &gt; eval("xTime" + x + "B") &amp;&amp; eval(endTime) &gt; eval("xTime" + x + "B") || eval(startTime) &lt; eval("xTime" + x + "A") &amp;&amp; eval(endTime) == eval("xTime" + x + "A") || eval(startTime) == eval("xTime" + x + "B") &amp;&amp; eval(endTime) &gt; eval("xTime" + x + "B")) {
<i> </i> timeAvailable = 1;
<i> </i> } else {
<i> </i> timeAvailable = 0;
<i> </i> alert("Sorry, but the time you selected is already reserved. Please choose a time that is not blocked out in the schedule on the right.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> break;
<i> </i> }
<i> </i> }
<i> </i> } else {
<i> </i> timeAvailble = 0;
<i> </i> alert("Lessons in New York can only be booked on Thursdays.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }

<i> </i> var startValue = "04.08.2013, " + startTime.replace(/.25/g, "").replace(/.5/g, "").replace(/.75/g, "") + ":00:00";

<i> </i> var re = /[.:]|, /,
<i> </i> date1 = startValue.split(re).map(Number),
<i> </i> date2 = "02.08.2013, 15:00:00".split(re).map(Number);

<i> </i> var diffMs = Date.UTC( date1[2], date1[1] - 1, date1[0], date1[3], date1[4], date1[5] ) - Date.UTC( date2[2], date2[1] - 1, date2[0], date2[3], date2[4], date2[5] );
<i> </i> var hours = diffMs / (3600 * 1000);

<i> </i> if (hours &lt; 24) {
<i> </i> alert("You must book your lesson at least 24 hours in advance.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> } else if (hours &gt; 1080) {
<i> </i> alert("Please call the school to book a lesson more than 6 weeks in advance. The phone number is (XXX)-XXX-XXXX. Thank you.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }

<i> </i> var nameFirst = document.forms["calendarmain"]["firstName"].value;
<i> </i> nameFirst = nameFirst.replace(/s/g, "")

<i> </i> if (! nameFirst.length) {
<i> </i> document.forms["calendarmain"]["firstName"].value = "";
<i> </i> div3.style.color = "red";
<i> </i> alert("Please enter your First Name.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }

<i> </i> var nameLast = document.forms["calendarmain"]["lastName"].value;
<i> </i> nameLast = nameLast.replace(/s/g, "");

<i> </i> if (! nameLast.length) {
<i> </i> document.forms["calendarmain"]["lastName"].value = "";
<i> </i> div4.style.color = "red";
<i> </i> alert("Please enter your Last Name.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }

<i> </i> var phone = document.forms["calendarmain"]["phoneNumber"].value;
<i> </i> phone = phone.replace(/s/g, "");

<i> </i> if (! phone.length) {
<i> </i> document.forms["calendarmain"]["phoneNumber"].value = "";
<i> </i> div5.style.color = "red";
<i> </i> alert("Please enter your Phone Number.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }

<i> </i> var email = document.forms["calendarmain"]["emailAddress"].value;
<i> </i> var atpos = email.indexOf("@");
<i> </i> var point = email.lastIndexOf(".");

<i> </i> if (atpos &lt; 1 || point &lt; atpos + 2 || dotpos + 2 &gt;= email.length) {
<i> </i> document.forms["calendarmain"]["emailAddress"].value = "";
<i> </i> div6.style.color = "red";
<i> </i> alert("Please enter your Email Address.");
<i> </i> glitch = 1;
<i> </i> return false;
<i> </i> }

[I][B] alert(glitch);
return false;[/B][/I]

[I][B] if (glitch) {
return false;
} else {
document.cookie = 'JSTEST=1; path=/;';
return true;
}[/B][/I]
}
&lt;/script&gt;


Thanks for taking the time to look at this.
Copy linkTweet thisAlerts:
@007JulienAug 03.2013 — It's not possible to test your script without HTML.

Open your browser console (with development tolls) and see the javascript errors or display many

if (window.console) console.log([I]someVariable[/I]); in your code to make tests...
Copy linkTweet thisAlerts:
@MannequinauthorAug 03.2013 — Oh wow, that worked! Thank you! Something very simple... the variable "dotpos" was not defined. It's located, of course, [b]directly above[/b] the code that isn't working. Defining it made everything function 100% correctly. Thank you! And thanks for informing me about the console. Good to know!
Copy linkTweet thisAlerts:
@tenfoldAug 03.2013 — I obviously can't run your code since I don't have the html or server-side code for it, but I can't spot any blazing errors.

You should use your error console [I](Ctrl+Shift+J in Firefox/Chrome)[/I] and possibly even use a debugger like Firebug if you're on Firefox (or another debugger if on a different browser).

As to why an alert wouldn't fire assuming the code was proper, there are 2 reasons:
[LIST]
  • [*]1- The DOM doesn't exist [I](alert is a DOM method, NOT a JavaScript native function)[/I]. I'm assuming your script runs after the DOM is loaded so that shouldn't be a problem.

  • [*]2- The alert was re-defined, which shouldn't be a problem in your case.

  • [/LIST]


    Another thing you could try is moving the alert upwards in the code until it fires, then you can somewhat pinpoint where it stops working.

    Try moving it up each time before an [B]if ()[/B] expression until the alert fires.



    [B]EDIT: Heh, I see you got it working just before I posted. Well... glad it works anyway. Yeah, error console is the most important tool along with a powerful debugger.[/B]
    Copy linkTweet thisAlerts:
    @MannequinauthorAug 03.2013 — I appreciate the response! I got rid of the "glitch" functionality altogether because it wasn't necessary in the end. And yes, I'm using Firefox with the developer toolkit that (I believe) comes with it. It spotted the JS error. Thanks again ?
    Copy linkTweet thisAlerts:
    @tenfoldAug 04.2013 — I use Notepad++ by the way. I love that program. I use the font Consolas in it, but Courier is good too.
    ×

    Success!

    Help @Mannequin spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 5.20,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...