Room of a pleinolijf

Ask yourself this: how do I want to be remembered ?


10 Comments

JavaScript Check on Valid Date

Whenever I have this combination of three DropDownLists to receive a date for input, I use this little script to validate whether the given date is an actual date or not. You know: preventing the user inputting 30 February or something like that.

I knicked it from some site or other, but I can’t remember where exactly, so if you recognize this script and believe I should give you credit, just let me know and I’ll fix things up.

function isDate(dateStr) {
var datePat = /^(\d{1,2})(\/|-)(\d{1,2})(\/|-)(\d{4})$/;
var matchArray = dateStr.match(datePat); // is the format ok?

if (matchArray == null) {
alert(“Please enter your birth date as dd/mm/yyyy. Your current selection reads: ” + dateStr);
return false;
}

day = matchArray[1]; // p@rse date into variables
month = matchArray[3];
year = matchArray[5];

if (month < 1 || month > 12) { // check month range
alert(“Month must be between 1 and 12.”);
return false;
}

if (day < 1 || day > 31) {
alert(“Day must be between 1 and 31.”);
return false;
}

if ((month==4 || month==6 || month==9 || month==11) && day==31) {
alert(“Month “+month+” doesn`t have 31 days!”);
return false;
}

if (month == 2) { // check for february 29th
var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
if (day > 29 || (day==29 && !isleap)) {
alert(“February ” + year + ” doesn`t have ” + day + ” days!”);
return false;
}
}
return true; // date is valid
}

function checkForValidDate(){
var ddlVMonth = document.getElementById(“_ctl0_DropDownListMaanden”);
var ddlVDay = document.getElementById(“_ctl0_DropDownListDagen”);
var ddlVYear = document.getElementById(“_ctl0_DropDownListJaren”);

if (!isDate(ddlVDay.value + ‘/’ + ddlVMonth.value + ‘/’ + ddlVYear.value))
{ return(false); }

return(true);
}

TechnoratiTechnorati Tags: ,


2 Comments

JavaScript : Preventing Form Submit When Closing Window

I have this page, on which I have a button. The button does nothing more than window.close(). But the problem is that the page contains a form onsubmit script, which checks to see if the sum of all dropdownlists equals 10.
So when I implemented the button to immediately close the window, it would trigger the submit on the form. To solve this, you have to write window.close();return false; instead of just window.close();.

You would think that when window.close() executes, the form won’t do a submit… I didn’t think this was obvious, that’s why I made a post about it. Hope it’s useful to someone.

TechnoratiTechnorati Tags: , , ,


1 Comment

Capturing the Closing of a Window (‘X’) in JavaScript

I used this for an application I’m currently developing.

I have a questionnaire that users need to fill out by selecting answers to questions. These questionnaires appear in fullscreen popup windows (as requested by the client), which are opened by the main web site. On this main site, I have an aspx page that keeps track of the status of these questionnaires (it calculates the percentage completed by counting the received answers to the questions).

After a recent demo, the client asked to update the status page not only when a questionnaire is completed, but also whenever a user closed the popup window manually. I needed a workaround, as the “body onUnload” wasn’t good in my case, because it would be triggered every time the user navigates to another page in the test, and also with each postback of the ASP.NET questionnaires).

I found a decent solution in the following.

On the questionnaire pages (the already popped up screens), I add the onUnload event to the body-tag, and I open a new, tiny popup window containing the following script:


if (this.opener.closed)
{
// the questionnaire popup was closed
// refresh the status page of the main site
var popup = this.opener;
popup.opener.location.reload(true);
}
else
{
// window wasn't closed
// user refreshed the page, clicked a link,
// or some other postback occured
// nothing needs to be done in my case, but it is possible
}
self.close();

Each test (consisting of a questionnaire, summary and HTML report) contains this kind of body tag: window.open('XListener.html', 'XListener', 'menubar=no,location=no,status=yes,copyhistory=no;').blur();

Of course you can add any window attributes you like, I had to shorten the list for layout reasons 🙂

Because nothing is contained in the page I call, you don’t want it to be very big (I set mine at 1×1, and open @ left=0, top=0). The blur() command forces the focus off of the window. Optionally, you could do self.focus() on the caller window, but because I immediately close the listener window, this is not necessary.

The only main drawback of this solution is the popup window, as the user will notice it flashing by… I haven’t yet tried if it can be done without loading an actual web page (XListener.html), but I’m afraid it’s the only way of seeing if another window has been closed or not…