dom question and form validation

Discussion in 'JavaScript' started by progfrog, Mar 26, 2008.

0
  1. #1
    hi-
    does any of you know why this function doesn't work?

    

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>MyForm</title>
<style type="text/css">
.loud{
  border: 3px double red;
  background-color: yellow;
  color: blue; 
  width: 100px;
  padding: 30px; 
  margin: 20px;
  
} 



</style>

<script type="text/javascript"> 
var text;
function Validform(Form1){
 
 var MyName = document.getElementById("name1");
 if( Form1.MyName.value=="")
 text = "Name is required"; 
  }
  
  
   var getDiv = document.getElementById("eroorBox");
   getDiv.innerHTML=text;
 

   
  
</script>




</head>
<body>
   
    <form name="MyForm" onSubmit="return ValidForm('MyForm')" action="http://www.htmlcodetutorial.com/cgi-bin/mycgi.p"/>
     
				<table style="width: 90%;" align="left">
                  <tr>
                   <td>
                   Your errros:
                   
                   </td>                 
                  <td>
                  <div class="loud" id="errorBooks">
                  </div>
                  </td>
                  </tr>
                  
					
					<tr>

						<td style="width: 200px">
							Name
						</td>
						<td>
						<input id="name1" size="25" maxlength="50" value="" />
						</td>
					</tr>
					<tr>
	               
	                        <td>
							Age
							</td>
						<td>
						   <input name="Age" size="25" maxlength="50" value="" />
						</td>
					</tr>
					<tr>
						<td>

						Email adress:
						</td>
						<td>
							<input name="em" size="25" maxlength="50" dir="ltr" value="" />
						</td>
					</tr>
					<tr>
                        
                        <td><input type="radio" value="Male" id= "radio1" Name="radio group" checked/> Male
                        <input id="radio2" type="radio" value= "Female" Name="radio group" /> Female</td>
		                
						</tr>
						<tr>
						<td align="left">Comments:
						</td>
						<td>
						 <textarea cols="24" id="Message" rows="6" style="width:25%";></textarea> 
						 </tr>
					
                        
                        
				
				    <tr>
						<td>
						</td>
						<td>
							<input type="submit" value="submit" name="Submit" />
						</td>
					</tr>
				</table>

				</form>
    Code (markup):

     
    progfrog, Mar 26, 2008 IP
  2. So1

    So1 Peon

    Messages:
    45
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #2
    use, for example
    <input type="button" value="submit" onClick="Validform(document.MyFrom);">
    instead of
    <input type="submit" value="submit" name="Submit" />
    then correct this:
    <form name="MyForm" onSubmit="return ValidForm('MyForm')" action="http://www.htmlcodetutorial.com/cgi-bin/mycgi.p"/>
    with
    <form name="MyForm" action="http://www.htmlcodetutorial.com/cgi-bin/mycgi.p"/>
    your function, in this case, will be
    <script type="text/javascript">
    var text;
    function Validform(Form1){

    var MyName = document.getElementById('name1');
    if( MyName.value=="")
    text = "Name is required";
    getDiv = document.getElementById('errorBooks');
    getDiv.innerHTML=text;

    }
    else Form1.submit();
    </script>

    Not understand, why u pass Form object as a parameter and then use document.getElementById...
    Look:
    <span id="errors_container"></span>
    <form name="F1">
    <input type="text" name="my_name" />
    <input type="button" onClick="my_validate_func(document.F1);" value="Send data & validate">
    </form>

    <script type="text/javascript">
    function my_validate_func(form_obj)
    {
    var name = form_obj.my_name.value;
    if (name=="")
    document.getElementById('errors_container').innerHTML = "OMG! ITS A ERROR!";
    else form_obj.submit();
    }
    </script>
    It's more logically way.

    U have SOOOO MUUUCH errors in code... :) And wonder why this don't work. Funny. Learn HTML and using JS-objects. And why u dont specify some names for INPUT fields? Like this:
    <input id="name1" size="25" maxlength="50" value="" />
    u'll get data through whe QUERY_STRING in server-side script (in ur case it "http://www.htmlcodetutorial.com/cgi-bin/mycgi.p")? Very silly method.
     
    So1, Mar 26, 2008 IP