• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 652
  • Last Modified:

Triggering event from javascript

Here is my original question:

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_27833357.html

I thought I had this solved, but now I realize that it does not work in Firefox.  It works in Chrome.

So now I'm stuck once again with why my button does not become enabled after a date is picked from the calendar control.

I've created a miniature version of my program and have reproduced the problem.

HTML code:
<head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        <link rel="stylesheet" type="text/css" href="1-simple-calendar/tcal.css" />
        <script language="JavaScript" src="1-simple-calendar/tcal.js"></script>
        <script language="JavaScript" src="tcal_test.js"></script>
</head>
<body>
Name: <input type="text" id="name" name="name" value="" /><br />
<input type="text" autocomplete="off" id="scan_date" name="scan_date" class="tcal input" value="" />
<input type=submit id=btnSubmit name="submit" value="submit"></td>
</body>
</html>

Open in new window


tcal_test.js
function formValidation(oEvent){
        oEvent = oEvent || window.event;
        if(!oEvent){ return; } // Undefined oEvent did not work in Firefox.  Have to have this for FF.
        var txtField = oEvent.target || oEvent.srcElement;
        var chk=true;
        var msg=" ";
        var name = document.getElementById("name");
        var scan_date = document.getElementById("scan_date")
        if(name){
                if(name.value == ""){
                        chk=false;
                        msg = msg + "Please enter a name.";
                        name.focus = true;
                }
        }
        if(document.getElementById("scan_date")){
                if(scan_date.value == ""){
                        chk=false;
                        msg = msg + "Please select scan date.";
                        scan_date.focus = true;
                }
        }
        //alert(name + chk);
        // This check covers all controls
        if(document.getElementById("btnSubmit")){
                if(chk){
                        document.getElementById("btnSubmit").disabled = false;
                }
                else{
                        document.getElementById("btnSubmit").disabled = true;
                }
        }
};

window.onload = function () {
        var btnSubmit = document.getElementById("btnSubmit");
        if(btnSubmit){
                document.getElementById("btnSubmit").disabled = true;
        }
        if(document.getElementById("name")){
                var name = document.getElementById("name");
                name.onblur = formValidation;
                //name.onchange = formValidation;
        }
        if(document.getElementById("scan_date")){
                var scan_date = document.getElementById("scan_date");
                        //scan_date.onblur = formValidation;
                        scan_date.onchange = formValidation;
        }
        var chk=false;
};

Open in new window


I'm using Tigris calendar (1-simple-calendar):

http://www.softcomplex.com/products/tigra_calendar/tigra_calendar.zip

Then I made some modifications to the tigra caledar file tcal.js according to the link

http://www.softcomplex.com/forum/viewthread_5416/

The link suggested modifying the f_tcalCancel () function.  Before this modification, it did not work in Chrome.  After modification, it worked in Chrome but I did not test Firefox.  Now with firefox, I still have the problem.  It requires that after selecting a date, I have to select another text box and then blur out of that.

Please take a look and download my sample and see if there is a way to get this to work in Firefox.
0
mock5c
Asked:
mock5c
2 Solutions
 
dnzone88Commented:
From what i see, FF never pass in the oEvent value into the function formValidation so it will return on line 3 of your tcal_test.js code. Try remark the first 3 lines of your tcal_test.js and see if it work.
tcal-test.js
0
 
manjunathubCommented:
u can use eventlistners to do that  like below doe

       function addEventSimple(obj,evt,fn) { // asign eventHandlers
	if (obj.addEventListener)
		obj.addEventListener(evt,fn,false);
	else if (obj.attachEvent)
		obj.attachEvent('on'+evt,fn);
}

function removeEventSimple(obj,evt,fn) {//remove eventHandlers
	if (obj.removeEventListener)
		obj.removeEventListener(evt,fn,false);
	else if (obj.detachEvent)
		obj.detachEvent('on'+evt,fn);
}

window.onload = function () {
        var btnSubmit = document.getElementById("btnSubmit");
        if(btnSubmit){
                document.getElementById("btnSubmit").disabled = true;
        }
        if(document.getElementById("name")){
                var name = document.getElementById("name");
                addEventSimple(name, "blur", formValidation);
				name.onblur = formValidation;
                //name.onchange = formValidation;
        }
        if(document.getElementById("scan_date")){
                var scan_date = document.getElementById("scan_date");
                        //scan_date.onblur = formValidation;
                        //scan_date.onchange = formValidation;
						addEventSimple(scan_date, "change", formValidation);
        }
        var chk=false;
};

Open in new window

0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now