473,399 Members | 2,858 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,399 software developers and data experts.

[Javascript] Change color in the field

263 100+
Hi all.

This code javascript not working... nothing error but not working... :(

I need change color in the fields of the form when fields is null...

My code:

Expand|Select|Wrap|Line Numbers
  1.  
  2. function validateForm(Qform) 
  3. {
  4.  
  5.   for (var a = 0; a < Qform.elements.length; a++) 
  6.  
  7.     {
  8.  
  9.     var field = Qform.elements[a];
  10.     var incorrect = new Array();
  11.         var no = 0;
  12.  
  13.           if (field.value.length <= 0) 
  14.         {
  15.             window.alert('K.O. !');
  16.             field.focus();
  17.             return false;
  18.  
  19.               } else { 
  20.                 incorrect[no] = "1";
  21.                 no++;
  22.  
  23.  
  24.                   }
  25.  
  26. }
  27.  
  28. for(j=0;j<no;j++) {
  29.           document.getElementById(incorrect[j]).style.color="#FF0000";
  30.   }
  31.  
  32. ....
  33.  
  34. <form action="" method="post" onSubmit="validateForm();">
  35.  
  36. <span id="1">Title </span>
  37. <input name="id" id="title" type="text" size="25" maxlength="6">
  38.  
  39. ....
  40.  
  41.  
Aug 29 '08 #1
3 2768
Dormilich
8,658 Expert Mod 8TB
some thought about the code

- you define validateForm() with a parameter (an object) but onsubmit there's no parameter given
- when defining the incorrect[] array elements you should assign the appropriate id otherwise getElementById() won't return something
- you redefine incorrect[] everytime you loop through the array, I think you should initialize it outside the for loop
Aug 29 '08 #2
Ferris
101 100+
Hi. There's too many problems in your code...so I rewrite your code...

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Test</title>
  6. </head>
  7. <script language="javascript">
  8. <!--
  9.  
  10. function validateForm(Qform)
  11. {
  12.     var incorrect = new Array();
  13.     var no = 0;
  14.     for (var a = 0; a < Qform.elements.length; a++)
  15.     {
  16.         var field = Qform.elements[a];
  17.  
  18.         if (field.value.length <= 0)
  19.         {
  20.             incorrect.push( field );
  21.             no ++;
  22.         }
  23.         else
  24.         {
  25.             field.style.backgroundColor="";
  26.         }
  27.     }
  28.     for( j=0; j<no; j++) 
  29.     {
  30.         incorrect[j].style.backgroundColor="#FF0000";
  31.     }
  32.  
  33.     if ( no > 0)
  34.     {
  35.         incorrect[0].focus();
  36.         return false;
  37.     }
  38.     else
  39.     {
  40.         return true;
  41.     }
  42. }
  43. -->
  44. </script>
  45.  
  46. <body>
  47. <form action="" method="post" onSubmit="return validateForm( this );">
  48. <span id="1">Title: </span>
  49. <input name="id" id="title" type="text" size="25" maxlength="6">
  50. <br />
  51. <span id="1">Content: </span><input name="content" id="content" type="text" size="25" maxlength="6">
  52. <br />
  53. <input id="submit" type="submit" value="OK" />
  54. </form>
  55. </body>
  56. </html>
  57.  
  58.  

I use incorrect array to save invalid field object,not index as you did. and pay attention to

onSubmit="return validateForm( this );

you should pass a form object into validateForm,and the function must return a bool value, return false means the form will NOT be submit. if you didn't return a value,the form will be submit everytime.


hope it helps.
Aug 30 '08 #3
viki1967
263 100+
Many thanks x your great help !!!
Kind regards
Viki
Aug 31 '08 #4

Sign in to post your reply or Sign up for a free account.

Similar topics

0
by: Gowhera Hussain | last post by:
Use This for Learning Only .... Do Not Try To Act Smart HACKING WITH JAVASCRIPT Dr_aMado Sun, 11 Apr 2004 16:40:13 UTC This tutorial is an overview of how javascript can be used to bypass...
12
by: Kevin Lyons | last post by:
Hello, I am trying to get my select options (courses) passed correctly from the following URL: http://www.dslextreme.com/users/kevinlyons/selectBoxes.html I am having difficulty getting the...
7
by: Trvl Orm | last post by:
I am working with 2 frames, Left and Right and the main code is in the left frame, which has been attached. Can someone please help me with this code. I am new to JavaScript and can't figure it...
34
by: Andrew DeFaria | last post by:
I thought this would be fairly straight forward but apparently it's not. Given the following html file: <!DOCTYPE html PUBLIC "-//w3c//dtd html 4.0 transitional//en"> <html> <head>...
5
by: John | last post by:
Hi, I have an asp.net form where if the user enters an incorect date I change the color of the textbox to red and also display a label field with a message saying the date is invalid. What I...
2
by: sorobor | last post by:
dear sir .. i am using cakephp freamwork ..By the way i m begener in php and javascript .. My probs r bellow I made a javascript calender ..there is a close button ..when i press close button...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.