Page 1 of 1

how to return a value to a document.getElementById()

Posted: Wed Jan 28, 2009 12:24 am
by tycoon79
pickle | Please use [ code=php ], [ code=text ], etc tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: :arrow: Posting Code in the Forums to learn how to do it too.


Hi all..what i'm trying to do is change the backgroundColor of my input text with js..

this the js part

Code: Select all

 
function CreateCFormArray(){
    var y=document.getElementsByName("cf");
    //alert(y[0].value);
        for(i = 0; i < y.length; i++) {
            if(y[i].id=='cf1' && y[i].value=='0'){
                             changeCssProp(name);                            
            }
            if(y[i].id=='cf2' && y[i].value=='0'){
                             changeCssProp(phone);
            }                           
        }   
}
var thefield;
function changeCssProp(thefield) {
document.getElementById(thefield).style.backgroundColor="#FF0000";
}
 
and this is the html part

Code: Select all

 
<form id="form1" name="form1" method="post" action="">
  <table width="100%" border="2" cellspacing="0" cellpadding="0">
    <tr>
      <td>name</td>
      <td>
          <label>
            <input type="text" name="name" id="name" />
          </label>
      </td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>phone</td>
      <td>
          <label>
            <input type="text" name="phone" id="phone" />
          </label>
      </td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>
          <label>
            <input type="button" name="Submit" value="Submit" onclick="CreateCFormArray()" />
          </label>
      </td>
      <td>
          <input name="cf" type="hidden" id="cf1" value="0" />
          <input name="cf" type="hidden" id="cf2" value="0" />
      </td>
      <td>&nbsp;</td>
    </tr>
  </table>
</form>
 
basicly what the script do is to check the hidden field cf with value of '0' if found it will execute changeCssProp(thefield)..but the problem is js return

error of document.getElementById(thefield) is null
can someone help me with..thanking you all in advance for reviewing my


pickle | Please use [ code=php ], [ code=text ], etc tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: :arrow: Posting Code in the Forums to learn how to do it too.

Re: how to return a value to a document.getElementById()

Posted: Wed Jan 28, 2009 12:41 am
by jothirajan
Just try this man

YOUR HTML CODE:

<form id="form1" name="form1" method="post" action="">
<table width="100%" border="2" cellspacing="0" cellpadding="0">
<tr>
<td>name</td>
<td>
<label>
<input type="text" name="name" id="name" />
</label>
</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>phone</td>
<td>
<label>
<input type="text" name="phone" id="phone" />
</label>
</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>
<label>
<input type="button" name="Submit" value="Submit" onclick="joe()" />
</label>
</td>
<td>
<input name="cf" type="hidden" id="cf1" value="0" />
<input name="cf" type="hidden" id="cf2" value="0" />
</td>
<td>&nbsp;</td>
</tr>
</table>
</form>

USE MY SCRIPT :

function joe()
{
var pname=document.getElementById('phone').value;
var name1=document.getElementById('name').value;
if(name1=="")
{
document.getElementById('name').style.backgroundColor="#FF0000";
document.getElementById('phone').style.backgroundColor="";
return false;
}
if(pname=="")
{
document.getElementById('phone').style.backgroundColor="#FF0000";
document.getElementById('name').style.backgroundColor="";
return false;
}

return true;
}


Thanks ...
JOE....come to me....if want more for your bucket

Re: how to return a value to a document.getElementById()

Posted: Wed Jan 28, 2009 1:38 am
by JellyFish
Could it be that you forgot the "quotation marks" around the argument you pass to changeCssProp? When you write:

Code: Select all

changeCssProp(name);
JavaScript doesn't interpret name as a string, but rather it interprets it as a variable. So unless you already defined name somewhere, then wrap quotes around name so that it is interpreted as a string literal:

Code: Select all

changeCssProp("name");
Do the same with the other changeCssProp call (i.e. wrap quotes around phone too).

Hope that solves the problem. :)

Re: how to return a value to a document.getElementById()

Posted: Wed Jan 28, 2009 1:42 am
by jothirajan
Neglect this changeCssProp(name);

and your blah blah....

Dont copy anything from your round...try from own......

But i have checked my above coding.....it;s good...working anywhere.....

Try this..if you got the thing.....then kiss my BASS

Thanks
JOE

Re: how to return a value to a document.getElementById()

Posted: Wed Jan 28, 2009 2:13 am
by tycoon79
Thanx a lot JellyFish your suggestion work..thank you man...also thank you jothirajan for your time reading my post and came out with a suggestion..really appreciate it