JavaScript - Onblur Not Working

okay. clearing a form. I have a clear button. when I push it, I want all the red text boxes and onblur messages to disappear. anyone have an idea on where i can start?

heres javascript
Code:

function isFormValid() 
{	
	var userF = document.getElementById('FName').value;
	var userL = document.getElementById('LName').value;
	var userPW = document.getElementById('pw').value;
	var userPW2 = document.getElementById('pw2').value;
	var userBDay = document.getElementById('BDay').value;
	var userEmail = document.getElementById('email').value;
	var NameFormat = /^[A-Za-z]{2,12}$/;
	var PWFormat = /^[A-Za-z0-9]{6,12}$]/;
	var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/;
	var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/;
	var retVal = true;
	var errorMsg = "";
	
	if (!NameFormat.test(userF))
		{
		assignErrorClass("FName");
		errorMsg = "First Name is required. 2-12 letters only\n";
		retVal = false;
		}
	if (!NameFormat.test(userL))
		{
		assignErrorClass("LName");
		errorMsg = errorMsg + "Last Name is required. 2-12 letters only\n"; 
		retVal = false;
		}
	if (!PWFormat.test(userPW))
		{
		assignErrorClass("pw");
		errorMsg = errorMsg + "Password is required. 6-12 letters or numbers only.\n";
		retVal = false;
		}
	if (userPW2 == "")
		{
		assignErrorClass("pw2");
		errorMsg = errorMsg + "Please Retype password.\n";
		retVal = false;
		}
	if ((userPW != userPW2) && (userPW2 !== ""))
		{
		assignErrorClass("pw2");
		errorMsg = errorMsg + "Passwords do not match.\n";
		retVal = false;
		}
	if (userBDay == "")
	{
		assignErrorClass("BDay");
		errorMsg = errorMsg + "Please Enter a Birthday.\n";
		retVal = false;
	}
	if ((!BDayFormat.test(userBDay)) && (userBDay !== "")) 
			{
				assignErrorClass("BDay");
				errorMsg = errorMsg + "Incorrect Birthday format\n";
				retVal = false;
			}
	if (badBirthday("BDay") && (userBDay !== "")) {
		assignErrorClass("BDay");
		retVal = false;
		errorMsg = errorMsg + "Invalid Birthday\n";
		}
		
	if (userEmail == "")
		{
		assignErrorClass("email");
		errorMsg = errorMsg + "Please Enter an Email address.\n";
		retVal = false;
		}
	if ((!EmailFormat.test(userEmail)) && (userEmail !== ""))
		{
		assignErrorClass("email");
		errorMsg = errorMsg + "Please Enter a valid Email address.\n";
		retVal = false;
		}
	if (!retVal)
		{
		alert( errorMsg);
		}
	return retVal;
}
         
function assignErrorClass(objName) 
{
	var obj = document.getElementById(objName);
	obj.className = "err";
}
function badBirthday( objName) {
	var obj = document.getElementById(objName);
	var dateStr = obj.value;
	var mn = dateStr.split("/")[0];
	var dy = dateStr.split("/")[1];
	var yr = dateStr.split("/")[2];
	var dateObj = new Date(yr,mn-1,dy);  //JavaScript and PHP number the months 0 to 11.
	if (dateObj.getFullYear() != yr || dateObj.getMonth()+1 != mn || dateObj.getDate() != dy) {
		return true;
	} else {
		return false;
	}
	}
              
function checkFName()
{
	var userF = document.getElementById('FName').value;
	var elementF = document.getElementById('labelFName');
	var NameFormat = /^[A-Za-z]{2,12}$/;
	if (!NameFormat.test(userF))
		{
		elementF.innerHTML = "First Name is required. 2-12 letters only";
		elementF.style.color = "red";
		}
	else
		{
		elementF.innerHTML = "";
		elementF.style.color = "green"; 
		}
}

function checkLName()
{
	var userL = document.getElementById('LName').value;
	var elementL = document.getElementById('labelLName');
	var NameFormat = /^[A-Za-z]{2,12}$/;
	if (!NameFormat.test(userL))
		{
		elementL.innerHTML = "Last Name is required. 2-12 letters only";
		elementL.style.color = "red";
		}
	else
		{
		elementL.innerHTML = "";
		elementL.style.color = "green"; 
		}
}
function checkpw()
{
	var userPW = document.getElementById('pw').value;
	var elementPW = document.getElementById('labelpw');
	var PWFormat = /^[A-z0-9]{6,12}$/;
	if (!PWFormat.test(userPW))
		{
		elementPW.innerHTML = "Password is required. 6-12 letters or numbers only.";
		elementPW.style.color = "red";
		}
	else
		{
		elementPW.innerHTML = "Good Password";
		elementPW.style.color = "green"; 
		}
}
function checkpw2()
{
	var userPW2 = document.getElementById('pw2').value;
	var userPW = document.getElementById('pw').value;
	var elementPW2 = document.getElementById('labelpw2');
	if ((userPW != userPW2) && (userPW2 !== ""))
		{
		elementPW2.innerHTML = "Passwords do not match.";
		elementPW2.style.color = "red";
		}
	else if (userPW2 == "") 
		{
		elementPW2.innerHTML = "Please Retype password.";
		elementPW2.style.color = "red";
		}
	else
		{
		elementPW2.innerHTML = "Passwords Match";
		elementPW2.style.color = "green"; 
		}
}
function checkBDay()
{
	var userBDay = document.getElementById('BDay').value;
	var elementBDay = document.getElementById('labelBDay');
	var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/;
	if (userBDay == "")
		{
		elementBDay.innerHTML = "Please enter A Birthday.";
		elementBDay.style.color = "red";
		}
		else if ((!BDayFormat.test(userBDay)) && (userBDay !== "")) 
		{
			elementBDay.innerHTML = "Please enter mm/dd/yyyy format.";
			elementBDay.style.color = "red";
		}
		else if ((badBirthday("BDay")) && (userBDay !== ""))
		{
			elementBDay.innerHTML = "Please enter valid Birthday.";
			elementBDay.style.color = "red";
		}
	else
		{
		elementBDay.innerHTML = "";
		elementBDay.style.color = "green"; 
		}
}
function checkEmail()
{
	var userEmail = document.getElementById('email').value;
	var elementEmail = document.getElementById('labelEmail');
	var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/;
	if ((!EmailFormat.test(userEmail)) && (userEmail !== ""))
		{
		elementEmail.innerHTML = "Please enter a Valid Email address.";
		elementEmail.style.color = "red";
		}
	else if (userEmail == "") 
		{
		elementEmail.innerHTML = "Please enter an Email address.";
		elementEmail.style.color = "red";
		}
	else
		{
		elementEmail.innerHTML = "";
		elementEmail.style.color = "green"; 
		}
}

heres the html
Code:

<form action="mailto:hummdedum@felloff.com" method="post" name="form" onSubmit="return isFormValid();">

* First Name: <input type="text"  name="FName" id="FName" onblur="checkFName();"/><label id="labelFName"></label><br />
* Last Name: <input type="text" name="LName" id="LName"onblur="checkLName();"/><label id="labelLName"></label><br />



* Password: <input type="password" id="pw" name="Password" onblur="checkpw();"/><label id="labelpw"></label><br />
*Re-type Password: <input type="password" name="2Password" id="pw2" onblur="checkpw2();" /><label id="labelpw2"></label><br />


I am a: <br />
<input type="radio" name="status" value="fresh" /> Freshman<br />
<input type="radio" name="status" value="soph" /> Sophomore<br />
<input type="radio" name="status" value="jr" /> Junior<br />
<input type="radio" name="status" value="sr" /> Senior<br />



I am taking classes in the: <br />
<input type="checkbox" name="semester" value="fall" /> fall time<br />
<input type="checkbox" name="semester" value="spring" /> Spring time <br />



My favorite element is:
	<select name="element" id="element">
    	<option value="">select</option>
		<option value="fire">Fire</option>
		<option value="earth">Earth</option>
		<option value="water">Water</option>
		<option value="air">Air</option>
	</select><br />



*Birthday: mm/dd/yyyy<input type="text" id="BDay" name="Birthday" onblur="checkBDay();"/><label id="labelBDay"></label><br /> 



*E-Mail: <input type="text" id="email" name="Email" onblur="checkEmail();"/><label id="labelEmail"></label><br />


	<input type="submit" value="Submit" />
	<input type="reset" value="Clear" />

</form>

css i guess would be
Code:

.err {
	border: 2px solid #FF0000;}
#errMsg {
	font-size: 110%;
	color: #FF0000;}

super thanks!!!!!!
-pumpkin

I am trying to make an onblur that calls a function and passes it some text, for example:

onblur = "function("Hello")"

however this wont work as it is not even calling the function. I have tried all the different encapsulation tags I can think of but still no luck is there any way of doing it or can I assign the text to a variable and call the function in the onblur?

Thanks.:confused:

Realizing that form input placeholders aren't universally recognized among browsers, I began changing all of mine using onblur and onfocus handlers instead. As an example, I used the following code, which works in most cases:

Code:

<input type="text" name="example" maxlength="5" value="Example" onblur="if(this.value=='') this.value='Example';" onfocus="if(this.value=='Example') this.value='';"/>

At first, I coded all of the inputs without a value attribute. But, when the page initially loaded, the fields would load empty, and the value/placeholder wouldn't appear until the field had been "focused" and then "blurred" again. Adding the value attribute seemed to correct that problem, again, for the most part.

I have some text fields that appear only after I select a particular radio button or select option. Problem is, when the radio is clicked, the field appears, but even with the value attribute in place, the field appears void. I'm not sure what is different, or what I'm doing wrong. Here's the javascript code with the radio button (note:everything works except that the "placeholder" doesn't show when the field first appears):

Code:

function showfield() {
    document.forms[0].otherRelation.value = "";
    document.getElementById("newBox").style.display = "none";

    var r = document.forms[0].relation;
    var len = r.length;
    for (var i =0; i<len; i++) {
        if (r[i].checked && r[i].value == "Otherrelation" ) {
            document.getElementById("newBox").style.display = "inline";
        }
   }
}


<input type="radio" name="relation" value="Otherrelation" onclick="showfield()"/>Other
	<span id = "newBox" style="display:none">: 
		<input type = "text" name="otherRelation" size="35" value="Your Relationship" onblur="if(this.value=='') this.value='Your Relationship';" onfocus="if(this.value=='Your Relationship') this.value='';"/>
	</span>

Thanks for any help. Sorry so long.

Hi all,

I am working on a site which is in a frameset. There is content area, a footer and a workqueue on the right.

Now what I do is poll the workqueue every 30 seconds, check if there are any changes to any queues and if so, I make them go bold and red and play a beep. That's no problem, that works fine. The trouble is I am trying to make the title flash "New Item" if the window is out of focus (Minimised would be better but dont think that is possible to detect). The flashing bit is no problem, it's the triggering when the windows out of focus that is a problem.

Applying events to the window object doesn't work. The closest I have come to making it work is this, but it doesn't work in firefox...

Code:

	var debugwin = window.open("", "newwin", "width=300, height=300, scrollbars=1");
	debugwin.document.open();
	debugwin.document.write("<HTML><TITLE>Debug Window</TITLE><BODY>");
	debugwin.document.write("</BODY></HTML>");
	debugwin.document.close();

	function addDebug(msg) {
		debugwin.document.body.innerHTML = msg + "<BR/>" + debugwin.document.body.innerHTML;
	}

	<!--<frameset onblur="workitemAlerts.setItemAlerts(false);" onfocus="workitemAlerts.setItemAlerts(true);" id="titleframeset" rows="<%= HEADER_FRAME_RESTORED %>,*,<%= FOOTER_FRAME_HEIGHT %>" framespacing="0" border="0" frameborder="0">-->
	<frameset onblur="addDebug('Blur 1st frameset');" onfocus="addDebug('Focus 1st frameset');" id="titleframeset" rows="<%= HEADER_FRAME_RESTORED %>,*,<%= FOOTER_FRAME_HEIGHT %>" framespacing="0" border="0" frameborder="0">

		<frame onblur="addDebug('Blur frame 1');" onfocus="addDebug('Focus frame 1');" noresize scrolling="no" framespacing="0" border="0" frameborder="0" id="titlebar" name="titlebar" src="<wfmt:headerpage />">

		<frameset onblur="addDebug('Blur 2nd frameset');" onfocus="addDebug('Focus 2nd frameset');" id="mainframeset" cols="10,*,<%= MAIN_FRAME_RESTORED %>" framespacing="0" border="0" frameborder="0">
			<frame onblur="addDebug('Blur frame 2');" onfocus="addDebug('Focus frame 2');" noresize framespacing="0" border="0" frameborder="0" name="leftpad" src="mainColourFill.jsp" scrolling="no">
			<frame onblur="addDebug('Blur frame 3');" onfocus="addDebug('Focus frame 3');" noresize name="windmain" src="<wfmt:postloginpage />" scrolling="auto">
			<frame onblur="addDebug('Blur frame 4');" onfocus="addDebug('Focus frame 4');" noresize framespacing="0" border="0" frameborder="0" name="queues" src="workqueues.jsp" scrolling="no" style="BORDER-RIGHT: gray 1pt solid;">
		</frameset>

		<frame noresize scrolling="no" framespacing="0" border="0" frameborder="0" name="footerbar" src="footer.jsp">

	</frameset>

I have popped up a little window to help me view debug away from the window so I can focus and blur and still see the output to see what events are triggering.

IE seems to trigger the events on the <frame> tags fine, which means I can achieve what I need to in IE, however FF isn't playing ball. Anybody know what I can do to detect if the window is out of focus.

TIA,
Dale

Hello,
I am new to JavaScript and I am asking for help with this problem.
I have a three textboxes in a form. Using OnBlur, I am attempting to call a function to add one to an input textbox to add 1 to the cost.
As the user enters text into textbox01, the number 1 appears in the input box about cost, as the user enters text into textbox02, the input box displays 2 and the user enters text into textbox03, the input box displays 3.

My JavaScript is as follows:
<script type="text/javascript">
//copies contents of first textbox to second textbox
function copyValue() {
var textbox1 = document.getElementById("textbox1");
var textbox2 = document.getElementById("textbox2");

var textbox3 = document.getElementById("textbox3");

var txtAttendee = document.getElementById("txtAttendee");
var input_A = document.getElementById("input_A");

textbox2.value = textbox1.value;
txtAttendee.value = 1;
input_A.value = 1;

}
</script>

In the form I have this:
<input type="text" id="textbox3" style="background-color:yellow" onblur="copyValue();" />

I would greatly appreciate ANY help with being able to calculate costs, perhaps using the JavaScript ++/-- operators.

Thank you in advance for your time and assistance.

Hey all,

I'm trying to write what I thought to begin with would be a simple script. All it will do is go out and find every textarea, then change the onblur/onfocus functions to something that I created. Here's my problem, when I am going through each textarea object, I can't seem to find a way to reference the object from within the function. See down in that for loop? When I say tAreaSniffer(i), the i ends up being overwritten each time. This makes the value of i in each object to be 3(since there are 3 textareas). I have used javascript in the past, however now I am getting back into it and having trouble.

Thanks guys,

Here's my code:

Code:

<html>
	<head>
	</head>
	
	<body>
		<form>
			<textarea name="t1" rows="4" cols="20"></textarea>
			<textarea name="t2" rows="4" cols="20"></textarea>
			<textarea name="t3" rows="4" cols="20"></textarea>
		</form>
		
		<script type="text/javascript">
			
			var sniffer;
			var textareas = document.getElementsByTagName('textarea');
			var counter = 0;
			
			function tAreaSniffer(tArea)//, oldCont)
			{
				alert(tArea);
				//var curCont; = tArea.value;
				counter++;
				sniffer = setTimeout(function(){tAreaSniffer(tArea)}, 1000);
			}
			
			
  			for(var i=0; i<textareas.length; i++)
  			{
				textareas[i].onfocus = function(){tAreaSniffer(i);};//, textareas[i].value);};
				textareas[i].onblur = function(){clearTimeout(sniffer);};
  			}
  			
			alert("HEYO");
 		</script>

	</body>
</html>

Hi

I've just found out that a piece of code is not working as expected in certain browsers - but the way in which it goes wrong is not consistent, so maybe it's something wrong with my code.

Oddly enough, it works exactly as I was expecting when viewed in IE.

Here's the code... any help would be much appreciated.

Thanks


Code:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>

<script type="text/javascript">
	function fillboxAddress() {
		if (document.getElementById('tbAddress').innerHTML == '') 
			{ 
			document.getElementById('tbAddress').innerHTML = 'Address';
			}
	}
	
	function clearboxAddress() {
		if (document.getElementById('tbAddress').innerHTML == 'Address') 
			{ 
			document.getElementById('tbAddress').innerHTML = ''; 
			}
	}
</script>

</head>

<body>

<p><textarea name="tbAddress" rows="2" cols="20" id="tbAddress" onfocus="clearboxAddress()" onblur="fillboxAddress()">Address</textarea></p>

</body>

I have an onfocus event that makes a textarea large and then an onblur event that sets it back to a smaller textarea. If I click the textarea the onfocus event is triggered but if I go straight to submit the form the onblur event is triggered and the form is not submitted unless i hit submit twice. How can i get the form to submit? Can i put an "if" statement in the onblur event to see if the form is being submitted then just submit the form otherwise run the onblur event?



Code:

<style type="text/css"> 
 
 
  .textarea {
          background-color: #ffffff;
          color: black;
          font-family: Arial, sans-serif;
          font-size: 8pt;
          font-weight: normal;
          border-style: solid;
          border-width: 1px;
          border-color: aaaaaa;
          height: 18px;
          width: 50%;
          overflow: hidden;
            
 
          }   
          
  .textarea2 {
          background-color: #ffffff;
          color: black;
          font-family: Arial, sans-serif;
          font-size: 8pt;
          font-weight: normal;
          border-style: solid;
          border-width: 1px;
          border-color: aaaaaa;
          height: 100px;
          width: 50%;
          overflow: auto;
          
          }                
  
  


</style>

</head>

<body>

<script>

function enlargeBox(v,n,c){
 
document.theForm.elements[n].className='textarea2';

 

 
 
}


</script>


<form method="POST" name="theForm" action="newProcess.php">



site<br>
        <textarea 
    class = "textarea" 
    name  = "site" 
    onblur  = "this.className='textarea'" 
 
    onfocus = 'enlargeBox(this.value,this.name,this.className)' rows="1" cols="20"> this is a test for this new texfield to textareathis is a test for this new texfield to textareathis is a test for this new texfield to textareathis is a test for this new texfield to textareathis is a test for this new texfield to textareathis is a test for this new texfield to textareathis is a test for this new texfield to textarea</textarea> 
 <br>
 
 Contact:<br>
 
<input type="text" onclick="this.select();" name="contact" value="" class="textfieldlp" size="50">

<p>&nbsp;</p>
<p><input type="submit" value="submit" name="B1"></p>

</form>

Hi,

I have an input element (textbox) on a webpage, and capture the onblur event of the input (textbox) control to do validation. My problem is that when the page is closed or the user click on another window the onblur event of my textbox gets called too.

I need the onblur event handler to be called only when the textbox loses focus b/c another element on the SAME webpage gets focus, but not when the user clicks on another window or closes the browser window.

What is the right way to accomplish this?

Thanks in advance,

Richard

I need some help as this is driving me crazy.

I have a onblur, focus with this code for the columns of footer filter.

Code:

$("tfoot input").keyup( function () {
		/* Filter on the column (the index) of this element */
		oTable.fnFilter( this.value, $("tfoot input").index(this) );
	} );
	
	$("tfoot input").each( function (i) {
		asInitVals[i] = this.value;
	} );
	
	$("tfoot input").focus( function () {
		if ( this.className == "search_init" )
		{
			this.className = "";
			this.value = "";
		}
	} );
	
	$("tfoot input").blur( function (i) {
		if ( this.value == "" )
		{
			this.className = "search_init";
			this.value = asInitVals[$("tfoot input").index(this)];
		}
	} );

I am clearing the input fields with this.

Code:

$("input:button").click(function(e) {	$('#col1').val(''); 
					$('#col2').val('');
					$('#col3').val(''); 
					$('#col4').val('');
 					$('#col5').val('');

Including a reset of the filters, but won't bore with that, it works, the filters for the columns are all released and reset.

My issue is the tfoot fields are cleared just fine, but remain blank. The onblur values do not refill the fields until I click in, then click out of the input field. Do I need to adjust for the clearing of the input field in the original focus and onblur? Or do I need a better reset of the the .val('') statement with a tweak to let the onblur function to show.

Thanks, any help really appreciated.
Tom

Hi,

I have a problem in javascript, where entering a value in the textbox during onblur I am doing a refresh to bring in the
updated records from the DB , before the on blur refresh is completed if the user clicks the search button (onclick)
during the first click nothing is happening as the refresh is still going on. During the second click when the on blur refresh
is completed it will open a popup.

The problem here is I am unable to disable/inactivate the search button untill the refresh is completed as well as I dont have any control over the
refresh time as well. This is like already an event is in progress and where we are invoking another event which is not having
any effect. In such case how i can handle this scenario?

Thanks.

Hi everyone. New programmer here trying to get fix this one specific issue I am having and I could use some help. Using Javascript, ASP.net with C# code behind.

I am validating a textbox using the onblur event. It is being validated in that it must have an alphanumeric entry before the user tabs off of it to the next box.

The validation part works, the part that doesn't work is that I get the validation alert textbox if I close the window. I have a workaround in that I am assigning that textbox a character using windo.onberforeunload but I know that isn't right.

Here is what I have so far...

Code behind on Page_Load...

Code:

txtCLBRTNWC.Attributes.Add("onblur", "return reqVLD(this)");

here is my textbox field...

Code:

                   <asp:TextBox ID="txtCLBRTNWC" runat="server" Width="75" MaxLength="4"
                       ontextchanged="txtCLBRTNWC_TextChanged" TabIndex="1"
                       onkeyup="clbwclngCHK(this);" ></asp:TextBox>

And here are the 2 functions being used...
Code:

function reqVLD(alphanumericChar)
{
    var chk = /^[a-zA-Z0-9]+$/;
//    var boxid = document.getElementById("<%=txtCLBRTNWC.ClientID%>").value;
//    var matchArray = boxid.match(chk);
    if(document.getElementById("<%=txtCLBRTNWC.ClientID%>").value.match(chk))
    {
    return true;
    }
    else
    {
    document.getElementById("<%=txtCLBRTNWC.ClientID%>").focus();
    document.getElementById("<%=txtCLBRTNWC.ClientID%>").value = "";
    alert("Please enter a Work Center.");
    return false;
    }   
}

function clbwclngCHK(obj_in)//When txtCLBRTNWC entry hits the max of 4 auto focuses to next box.
{
if (obj_in.value.length == 4) document.getElementById("<%=txtSTRTDT.ClientID%>").focus();
}

Here is my work around...
Code:

window.onbeforeunload = function ()
{                                  
document.getElementById("<%=txtCLBRTNWC.ClientID%>").value = "1";
}

Summary. User has to enter something in box before they can move on. This is checked and validating using an onblur event. Problem is, the onblur event fires if closing\exiting the window.

I know there has to be a better way of doing this. Any advise or help would be greatly appreciated.

Thanks
Will

Hi,

I'm having some problems with some javascript events firing in the wrong order under certain workflows. Here's the gist of it:

I have a form with many fields, mostly input type = text. Each field as an OnBlur and OnFocus event tied to javascript functions.

IE's website (http://msdn.microsoft.com/en-us/libr...=vs.85%29.aspx) states that "The onblur event fires on the original object before the onfocus or onclick event fires on the object that is receiving focus." and that is exactly what happens when tabbing through the fields.

The tricky part is that it doesn't perform this way when CLICKING to another field. When clicking to another field it performs the new field's OnFocus first, and then the first field's OnBlur event after. This is bad because the OnFocus sets a global variable's value to whatever value is in that box at the time it gets focus and if the onblur validation fails, that value is inserted back into the box. So what's happening is the validation for field 1 fails and the value from field 2 is then written into field 1.

This also seems to only happen when the page is opened as a modal window as opposed to just opening the page on it's own. It doesn't happen in FireFox, I've only been able to get it to happen on IE 8 + (haven't tried any other browsers.)

Anyone else have this happen to them? Does it sound like an IE bug?

Thanks

Hello all,

As this is an active javascript programming forum...i'm really hoping i'll get a solution for my problem...please help me out....

I have a html: text inside a logic:iterate block like this..

<logic:iterate name="AllocationsForm" property="newSearchAllocations" id="allocations" indexId="myindex" >
<html:text name="allocations" property="newStartDate" indexed="true"
onblur="allocationTest(this, " + myindex + ");" />
</logic:iterate>

i want to write a onblur event for this text field inorder to validate it. Is it the correct way i wrote or something i need to make a change in the above code inorder for the javascript to work. Can we really able to write a onblur event for a indexed text field that is inside a logic:iterate block.

please let me know. Thanks in advance.

Hi everyone,

The following code has an onblur event in the input fields so that if someone clicks out of the field without typing something in it, the original label, ie. 'First name' is reinserted into the field. The field is also being validated by some php code, however the onblur event creates a problem because the form still submits even if a name isn't typed into the field. It's assuming that 'First name' is an entry and therefore isn't validating it correctly.

It was suggested that on the submit event of the form, there would be a function that checks if the value is First Name then return false, but then otherwise return true. As my javascript skills are very basic, I wondered if someone could help me with this code to solve this issue?

Appreciate any help.

Code:

        <input id="firstname" name="firstname" type="text" value="First name" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" />          
                    <?php
if (ValidatedField('index_965','index_965'))  {
  if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "1" . ",") !== false || "1" == ""))  {
    if (!(false))  {
?>
            <span style="color: red"> First name is required </span>
            <?php //WAFV_Conditional index.php index_965(1:)
    }
  }
}?>