JavaScript - Unique Validation

Hi,

I'm using the following code to toggle checkbox checked and disabled attributes.

Code:

var f = false;
function tick(group) {
if (!f) {
   for (var i=0, len = group.length; i < len; i++) {
      group[i].disabled = true;
	  group[i].checked = true;
	  }
   }
else {
   for (var i=0, len = group.length; i < len; i++) {
      group[i].disabled = false;
	  group[i].checked = false;
	  }
   }
f == true? f=false:f=true;
}

The checkbox doing the js call uses onclick="tick(country)"

and the checkboxes that I want to toggle all have the same id e.g.

Code:

<label><input type='checkbox' name='uk[]' id='country' value='England' />England</label><br />
<label><input type='checkbox' name='uk[]' id='country' value='Scotland' />Scotland</label><br />

This all works correctly but does not validate.
I need to use unique id's for each name.
The easiest way (as each checkbox html is generated by php) is to append the value to the id i.e.

Code:

<label><input type='checkbox' name='uk[]' id='countryEngland' value='England' />England</label><br />
<label><input type='checkbox' name='uk[]' id='countryScotland' value='Scotland' />Scotland</label><br />

How can I modify the javascript function factor this in i.e. toggle where id contains country?

Hello all, new here Seems like a very nice place to be apart of.

I have my website www.gebcn.com. If you view source you will see all that I have done, but more importantly my problem. I have the JS code at the top there and I am unable to W3C validate my HTML because of the JS. I am using XHTML strict and would like to stay using it.

The JS I have at the top is my form validation code. I am able to do any validating that I need with this "snippet" of code, I have shrank it from my library version just to use for this newsletter. Until now W3C validating was not important now for some reason it is and I am faced with this problem.

I am not a Javascript guy more of a HTML/CSS guy and I can manipulate JS to suit my needs.

<problem>
I have tried to make this "snippet" of JS code an external file but receive multiple errors with the JS calling for the FORM NAME as it is not on the same page. The form NAME=NEWSLETTER is another problem, as W3C says I am unable to use attribute "NAME" in this location.
<problem>

I would like to keep the JS close to how it is now as I have a library to use this JS over and over again.

Any pointers in the right direction or solutions to my problem would be greatly appreciated.

Thanks! Hopefully it is not to hard huh

If there is anything anyone needs, the code pasted here, or anything else please let me know. Thanks again!

hi,
My script creates random numbers as shown in ;
2,5,8
1,4,5
8,9,4
5,3,3
1,1,2
2,5,8
5,3,3
......
......
but there are many duplications as in row1 and row6(2,5,8.)....row4 and row7
how can we modify the script so that there wont be any smilir lines..

thanks..

here is my script.


PHP Code:
<script>  

    keywords1 = ["1","4","5","7","2","3"];
    keywords2 = ["5", "9", "2", "10","11","6","4"];
    keywords3 = ["13", "1", "3", "4", "6","7","8","2"];
       
var toplam=0;
z1=keywords1.length
z2=keywords2.length
z3=keywords3.length

toplam=z1*z2*z3;
say=0;

zaman=setInterval("yaz()",500);
function yaz()
{ 
     var keyword1 = keywords1[Math.floor(Math.random()*keywords1.length)];
     var keyword2 = keywords2[Math.floor(Math.random()*keywords2.length)]; 
     var keyword3 = keywords3[Math.floor(Math.random()*keywords3.length)]; 
         
say++;

     document.getElementById("kutu").innerHTML+=keyword1+".."+keyword2+".."+keyword3;
     document.getElementById("kutu").innerHTML+="<br>";
     document.getElementById("kutu2").value=say;
     document.getElementById("kutu3").value=toplam;
if(say>=toplam) dur();
} 

function dur()
{
clearInterval(zaman);

}

</script> 
<input type=button value=yazz onclick="yaz()">..
.<input type=button value=dur bakalım onclick="dur()">
....<input type=text value="" id=kutu2  size=3>
....<input type=text value="" id=kutu3  size=3>
<div id="kutu" style="position:absolute;top:5;left:250;background-color:yellow;border-style:solid;border-width:5;border-color:red;"></div>
<div id="kutux1" style="position:absolute;top:5;left:350;background-color:yellow;border-style:solid;border-width:5;border-color:red;"></div>
</body>
</html> 

Hi

I've got about 40 check-boxes on my 1 form. These check-boxes all have names (obviously) but they are NOT all unique names. The number of UNIQUE names on my form is probably around 8 or 9 (the actual number is NOT important). Because some check-boxes use the same names as other. It's set up this way, please don't ask me to change it, I can't change it.

What's the syntax/method for looping through all the names? I was thinking I should do maybe a "for" loop;

Code:

for (var i = 0; i < fieldName.length; i++)

But I don't know how to hold a variable of the unique names to start with. Can someone help please?

I have the following code as shown below:

Code:

<html>
<script type="text/javascript">

var all = [];
var a = ["1234", "Jim", "Lab1", "5455"];
var b = ["1235", "Jack", "Lab1", "5459"];
var c = ["1236", "Jane", "Lab1", "5455"];
var d = ["1237", "June", "Lab1", "5458"];
var e = ["1238", "Jill", "Lab2", "5461"];
var f = ["1239", "John", "Lab2", "5462"];
var g = ["1240", "Jacab", "Lab3", "5465"];

all.push(a);
all.push(b);
all.push(c);
all.push(d);
all.push(e);
all.push(f);
all.push(g);

for(var i=0; i<all.length; i++){
	document.write(all[i] + "<br>");
}
</script>

</html>

How to I get the unique & in order of column 4 given that column 3 is given.

Example: If the user provide the value 'Lab1' for column 3, the Javascript will return me the following?

Code:

"Lab1", "5455"
"Lab1", "5458"
"Lab1", "5459"

(I also posted this on stackoverflow, but haven't had any replies.)


I have a script that sends a POST to a php file, and gets a new integer (primary key). Then the script creates 3 new divs, with that ID included in them as an attribute.

Now, I need to be able to grab the ID and give it back to PHP when the user updates it. (It's currently a div, but later it will be an editable form.)

I was going to do this by creating a button in the same script that I use to create the divs, bearing the same integer and calling a function. The problem with this concept, is that I have no idea how to create a Unique variable to pass along to the function, so it knows which number to look at. Obviously, if I have only one variable that gets overwritten with each new entry - after all of the rows load, only the last row will have a variable that matches its id.

Another option is to find the value of all attributes that bear the name data-integer-question and pass its number/integer to a function, when the user does something like keyup enter. However, I have no idea how to do that.

obj.returnIntJson holds the integer that I've been talking about, which changes for each row.

rowNumberObj.qarowcontainer is just a reference for the parent div, which doesn't get edited by the user - you can ignore it.

The script gives a result like this: <div id="questioncolumn" class="questionColumnCSS" data-integer-question="701"></div>

Suggestions on how to proceed? Here's the code for one of the divs,

Thanks.

PHP Code:
    qaRowQuestion = document.createElement('div');
    qaRowQuestion.setAttribute('id', "questioncolumn");
    qaRowQuestion.setAttribute('data-integer-question', obj.returnIntJson);
    qaRowQuestion.setAttribute('class',"questionColumnCSS");

    qaRowQuestionParent = document.getElementById(rowNumberObj.qarowcontainer);
    qaRowQuestionParent.appendChild(qaRowQuestion); 

I'm installing a Disqus commenting system on a news site. Javascript attaches a comment thread to the end of a story page, based on the story's url.

Our issue is that many stories may have multiple urls, and we want a single comment thread on those stories.

A single story may have a url like this:
www.newspaper.com/ci_12345678
and this:
www.newspaper.com/entertainment/ci_12345678

Disqus provides an alternative
var disqus_identifier

I'd like to define disqus_identifier to the final 8-digit story ID, read from the url. Here's the way the code looks:

Code:

<div id="disqus_thread"></div>
<script type="text/javascript">
  /**
    * var disqus_identifier; [Optional but recommended: Define a unique identifier (e.g. post id or slug) for this thread] 
    */
  (function() {
   var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
   dsq.src = 'http://newspaper.disqus.com/embed.js';
   (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
</script>

I'm not sure how to define var disqus_identifier. Can anyone help me out?

Hi All,

I have a java script invoked within an ANT template. This java script as of now converts a text file to xml file.

Now, how would I do the schema validation of that XML file against an XSD in the javascript?

Saw many examples online but they were using MSXML or java classes

Would be glad to have any sort of suggestions..

Thanks

Hello to everyone

i need to validate a form Based on radio buttons and text box

my code so far
Code:

<html>
<head>
<title>My Page</title>
<script type="text/javascript">
function validate(thisform) {
document.getElementByName("bank");//text box
// validate myradiobuttons
   
radio = -1;
for (i=thisform.day.length-1; i > -1; i--) {
if (thisform.day[i].checked) {
radio = i; i = -1;
}
}
if (radio == -1) {
alert("You must select all values for the clock !");
return false;
}
 else
    {
    return true;
    }
	}
//bank code validation
if (document.getElementByName("bank").value.length>=6) {
 return true;
    }
else
    {
  alert("you must input maximum 6 digit (123456) !");
   return false;
    }
	}	

	</script>
</head>
	<body>
<form action="form-output.php" method="post" id="form">

          <input type="radio" name="day" value="f" onclick="dayofweek(this)" /> Sunday (default)
          <input type="radio" name="day" value="s" onclick="dayofweek(this)" /> Sun </p>

	        <input type="radio" name="month" value="a" onclick="dateformat(this)" /> 28th March 2010 (default) 
			<input type="radio" name="month" value="b" onclick="dateformat(this)" /> 28 March 2010 
			<input type="radio" name="month" value="c" onclick="dateformat(this)" /> 28th Mar 2010 
			<input type="radio" name="month" value="d" onclick="dateformat(this)" /> 28 Mar 2010 
			<input type="radio" name="month" value="e" onclick="dateformat(this)" /> 28/03/2010  
			<input type="radio" name="month" value="f" onclick="dateformat(this)" /> 28th March 10
			<input type="radio" name="month" value="g" onclick="dateformat(this)" /> 28 March 10
			<input type="radio" name="month" value="h" onclick="dateformat(this)" /> 28th Mar 10  <br/>

			<input type="radio" name="month" value="i" onclick="dateformat(this)" /> 28 Mar 10 
			<input type="radio" name="month" value="j" onclick="dateformat(this)" /> 28/03/10
			<input type="radio" name="month" value="k" onclick="dateformat(this)" /> 28th March 
			<input type="radio" name="month" value="l" onclick="dateformat(this)" /> 28 March 
			<input type="radio" name="month" value="m" onclick="dateformat(this)" /> 28th Mar
			<input type="radio" name="month" value="o" onclick="dateformat(this)" /> 28 Mar 
			<input type="radio" name="month" value="p" onclick="dateformat(this)" /> 28/03 </p>
			
			<input type="radio" name="time" value="a" onclick="timeformat(this)" /> 5:28:12 am (Default) 
			<input type="radio" name="time" value="b" onclick="timeformat(this)" /> 5:28 am 
			<input type="radio" name="time" value="c" onclick="timeformat(this)" /> 5:28:12 
			<input type="radio" name="time" value="d" onclick="timeformat(this)" /> 5:28 
			<input type="radio" name="time" value="e" onclick="timeformat(this)" /> 17:28:12 
			<input type="radio" name="time" value="f" onclick="timeformat(this)" /> 17:28 </p>
			 Input a short Bank Code
    <input type="text" name="bank" size="10"  onblur="JavaScript:alert('You must insert a Bank Code')"  /></br>

<input type="submit" name="submit" onclick="validate(form);return false;" value="Submit" />
<input type="reset" name="reset" value="reset" />
</form> 
</body>
</html>

i need on submit to validate if user select values from 3 radio groups and insert the proper data to text box.
if not i want to return the proper alerts
in text box also i want when lose focus to validate so i put this
Code:

onblur="JavaScript:alert('You must insert a Bank Code')"

it's ok?

Thanks in Advance

Hi, got my form here
Code:

<form method="POST" onsubmit="return validateFormOnSubmit1(this)" action="sendEmail.php">
    <p class="demo2">Receivers E-mail<a class="textFields"> 
      <input type="text" name="receiver" size="30" maxlength="35" /></a></p>
    <p class="demo2">Senders E-mail<a class="textFields2"> 
      <input type="text" name="sender" size="30" maxlength="35" /></a></p>
    <p class="btn" >
      <input name="Submit" type="submit" value="Send"/></p>
</form>

And that should call up this
Code:

function validateFormOnSubmit1(theForm) {
var reason = "";

  reason += validateEmail1(theForm.receiver);
  reason += validateEmail1(theForm.sender);
        
  if (reason != "") {
    alert("Some fields need correction:\n" + reason);
    return false;
  }

  return true;
}

function trim(s)
{
  return s.replace(/^\s+|\s+$/, '');
}

function validateEmail1(fld) {
    var error="";
    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off
    var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
    var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;
   
    if (fld.value == "") {
        fld.style.background = 'Yellow';
        error = "You didn't enter an email address.\n";
    } else if (!emailFilter.test(tfld)) {              //test email for illegal characters
        fld.style.background = 'Yellow';
        error = "Please enter a valid email address.\n";
    } else if (fld.value.match(illegalChars)) {
        fld.style.background = 'Yellow';
        error = "The email address contains illegal characters.\n";
    } else if (fld.value.length == 0) {
        fld.style.background = 'Yellow'; 
        error = "The required field has not been filled in.\n"
    } else {
        fld.style.background = 'White';
    }
    return error;
}

For some reason though the validation is not working. Is there anything obvious I am doing wrong?
cheers

Hey. Could someone point me in the direction of why this is not working, it worked in my last program, but not since I have changed things. I have a standard html form

Code:

 <form method="POST" onsubmit="return validate_form(this)" action="anniversaryPreview.php">
    <p class="demo5">Senders Name<a class="textFields2"> 
    <input type="text" name="sender" value="e.g. Love from Nick" size="30" maxlength="35" /></a></p>
    <p class="btn2" >
    <input type="submit" value="Preview"></p>
    </form>

And this should call up return validate_form(this) before bringing up the php page. Now the validator is just
Code:

function validate_required(field, alerttxt) {
        if (field.value == null || field.value == "") {
                alert(alerttxt);
                return false;
        }
        else {
                return true;
        }
}

function validate_form(thisform) {
        if (validate_required(thisform.name,"Please specify the receivers name.")==false) {
                thisform.name.focus();
                return false;
        }
        if (validate_required(thisform.sender,"Please specify the sender's name.")==false) {
                thisform.sender.focus();
                return false;
        }
}

(This is not in the html file, but its own seperate file)
I cant see if I have made any mistakes with the variables names or something, or what I am doing wrong. Dont get any errors, just nothing happens if I leave my forms fields blank. Anyone have an idea of whats going on here?

cheers

In my project i have a from which have several fields. The form is
<form name="reg" action="payment.jsp" method="post">
-----------
<tr> <td>First name:</td> <td><input type="text" name="firstname"/></td></tr>
--------------------------
<input type="submit" value="Next" onclick="fun()" />
------------
</form>
Then to validate the fields i have used JavaScript.They are validating rightly using a alert box. But when i am pressing ok of the alert box the control is passing to the page i have written in action of the form.I want when i will press ok it should come back to the same page.Only if all fields are then it should go to the page refereed in action. Can anyone help me?
The JavaScript code is
<script type="text/javascript">
function fun()
{
var x=document.forms["reg"]["firstname"].value;

if (x==null || x=="")
{
alert("First name must be filled out");


}

I keep getting validation errors for using && as and.

I've read to put "&amp;" in place of it, but whenever I do this, the code stops working.

I've tried seperate parenths, and still confused.

anyone help to make this work and validate at the same time?



if (first=="" && last=="")
first = last = "Unknown";


if (first == '')
document.writeln(last);
else if (last == '')
document.writeln(first);
else
document.writeln (last + ", " + first);

Hello,

I dont know if I am going about this the right way, but.. I am trying to validate an email address. If the email is a valid looking email address, it will render the submit button disabled to prevent dupe's while the rest of the script processes.

The email validation portion works, but, the part where it renders the form submit button disabled does not:

<script type="text/javascript">
function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@");
dotpos=value.lastIndexOf(".");
if (apos<1||dotpos-apos<2)
{alert(alerttxt);return false;}
else {return true; submit.disabled = true;}
}
}

function validate_form(thisform)
{
with (thisform)
{
if (validate_email(email,"Please enter a valid email address.")==false)
{email.focus();return false;}
}
}
</script>

Any guidance or help would be apreciated.

I'm having trouble changing the font color of my labels ONLY when I stop the form from submitting due to blank fields.

I'm not sure whether if just changing my CSS will achieve what I want, or am I going to have to add something to my if else statement, or both?


I would think I would need to change CSS to :

label.onfocus {
color:red;
}

but a little confused on what else.

Any help would be appreciated!

Code:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>Adam's Form Validation</title>


	<script type="text/javascript">

//<![CDATA[


		function validate() {
			var errors = new Array( );

		for( var x = 0 ; x < document.forms[ 0 ].elements.length ; x++ ) {
			if( document.forms[ 0 ].elements[ x ].type == "text" ) {
				if (document.forms[ 0 ].elements[ x ].value == "") {
			errors.push("*"+"The " + document.forms[ 0 ].elements[ x ].name + "field cannot be blank\n");
			document.forms[ 0 ].elements[ x ].className = "in_error"; }
					

		}
	
		if( document.forms[ 0 ].elements[ x ].type == "select-one" ) {
			if(document.forms[ 0 ].elements[ x ].selectedIndex !== 2) {
			errors.push("*"+"The " + document.forms[ 0 ].elements[ x ].name + " field cannot be blank\n");
			document.forms[ 0 ].elements[ x ].className = "in_error";	
		}
			
	}

}
		if( errors.length == 0 ) {
		return true;
		} else {
		clear_errors( );
		show_errors( errors );
		
		return false;	
		}
	}

	function clear_errors( ) {
		var div = document.getElementById( "errors" );
		while (div.hasChildNodes( ) ) {
		div.removeChild(div.firstChild);
	}
	}

	function show_errors( errors ) {
		var div= document.getElementById( "errors" );
		for( var x = 0 ; x < errors.length ; x++) {
		var error = document.createTextNode( errors[ x ] );
		var p = document.createElement( "p" );
		p.appendChild( error);
		div.appendChild( p );

	}

	}

	window.onload = function () {
		document.forms[ 0 ].onsubmit = validate;
	}	


//]]>	

	</script>

	<style type="text/css" media="screen">
	#errors {
		color: #F00;
	}	

	.in_error {
		border: 2px outset #f00;
	}


	</style>


</head>

<body>


<h1>Adam's Form Validation</h1>




<div id="errors"></div>

<form action="http://ingenio.us.com/examples/echo" method="post">

	<p>
		<label for="firstname">First Name: </label>
		<input type="text" name="firstname" value="" id="firstname"/>
	</p>

	<p>
		<label for="lastname">Last Name: </label>
		<input type="text" name="lastname" value="" id="lastname"/>
	</p>

	<p>
		<label for="middle">Middle Inital: </label>
		<input type="text" name="middle" value="" id="middle" maxlength="1" size="4"/>
	</p>

	<p>
		<label for="address">Street Address: </label>
		<input type="text" name="address" value="" id="address"/>
	</p>

	<p>
		<label for="city">City: </label>
		<input type="text" name="city" value="" id="city"/>
	</p>

	<p>
		<label for="state">State: </label>
		<input type="text" name="state" value="" id="state" maxlength="2" size="4"/>
	</p>

	<p>
		<label for="zip">Zip Code: </label>
		<input type="text" name="zip" value="" id="zip" maxlength="5" size="7"/>
	</p>

	<p>
		<label for="username">User Name: </label>
		<input type="text" name="username" value="" id="username"/>
	</p>

	<p>
		<label for="password">Password: </label>
		<input type="text" name="password" value="" id="password"/>
	</p>

	<p>
		<label for="password2">Confirm Password: </label>
		<input type="text" name="password2" value="" id="password2"/>
	</p>

	<p>

		<label for="agreement">Terms and Conditions:</label>
	<select name="agreement" id="agreement">
		<option></option>
		<option>No, I have not read the user agreement</option>
		<option>Yes, I have read and understand the user agreement</option>
		
	</select>
	</p>

	
	<p> <input type="submit" value="Register"/></p>

	
	</form>









</body>
</html>