modifying form-field-name with a function parameter

keyman2007 · May 31, 2007

Hi, all...

I am trying to do something that seems pretty elementary, but I am stumped.

I want to do the same JS edit on a number of form fields, so rather than code the edit in 10 locations, I wanted to make a function that takes the form-field-name as a parameter (qq) to do the edit. An idea like the following, except the code doesn't work.

(I know there are other ways to do these edits, but I am asking how to replace the segment in the document field-name with a variable):
==================================
test("lastname") // call the function, passing field-name
if (pp == 1) {
alert("No periods allowed in this field")
return false
}

test("firsname") //call the function, passing field-name
if (pp == 1) {
alert("No periods allowed in this field")
return false
}

function test(qq) {
var pp = 0
for (var i=0; i <= document.idform.qq.value.length; i++) {
if (document.idform.qq.value.charAt(i) == "."
{
pp=1;
}
}
}
[/color red]
==================================

BillyRayPreachersSon · May 31, 2007

Something like this should work:

Code:

function test(qq) {
	var pp = 0;
	var theForm = document.forms['idform'].elements;
	var theField = theForm[qq];
	for (var loop=0; loop<theField.value.length; loop++) {
		if (theField.value.charAt(loop) == '.') pp = 1;
	}
}

Hope this helps,
Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

BillyRayPreachersSon · May 31, 2007

Of course, you'd also want to:

Code:

return (pp);

at the end of the function!

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

keyman2007 · May 31, 2007

Thanks very much, Dan. It was very helpful for me comparng the two versions of code.

I think my problem was mostly related to the fact that I was not RETURNing the value pp. I am now, but still for some reason, the value is not being returned. I have an "alert" display of pp inside the function just before the return, and it is correctly set to '1'; and a second alert display just after the line where the function is called: there it displays as '0'!

BillyRayPreachersSon · May 31, 2007

You need to assign the returned value to "pp" - you're not doing that in your code above.

Code:

var pp = test('whatever');

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

keyman2007 · Jun 1, 2007

Worked immediately! Thanks again, Dan. [medal]

TobyWallis · Jul 11, 2007

HI. I'm trying to do something similar but also having problems.

I'm creating a form with dynamic fieldnames from a MySQL database. So the forms are named with a variable element $i using PHP as follows: Price$i, Quantity$i and Total$i.

I then pass these parameters to a calculate function as: echo "<input type=text name=\"Quantity$i\" value=\"\" onFocus=\"startCalc(Price$i,Quantity$i,Total$i);\" onBlur=\"stopCalc(Price$i,Quantity$i,Total$i);\" size=\"4\" maxlength=\"4\" class=\"qtyfield\">";

I declare the function startCalc thus:
function startCalc(StartPriceBox,StartQuantityBox,StartTotalBox){...etc

But I get an error StartPriceBox is undefined.

Any ideas?

Many thanks

===Toby===

BillyRayPreachersSon · Jul 11, 2007

Try putting string delimiters around your parameters:

Code:

onFocus=\"startCalc([!]'[/!]Price$i[!]'[/!], [!]'[/!]Quantity$i[!]'[/!], [!]'[/!]Total$i[!]'[/!]);\"

Hope this helps,
Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

TobyWallis · Jul 11, 2007

Thanks, Dan, but I still get an error.

TobyWallis · Jul 11, 2007

I think the problem is more basic, to do with how I'm calling one function within another.

I tried the following script and got "Undefined" in the second function. Am I being really stupid??

Code:

<script language="JavaScript">
<!--
function myFunction1(a1,a2,a3)
{
b1=a1.value;
b2=a2.value;
b3=a3.value;
document.write('FROM myFunction1 PARAMETERS:<br>b1='+b1+'<br>b2='+b2+'<br>b3='+b3);
myFunction2(b1,b2,b3)
}
function myFunction2(w1,w2,w3)
{
x1=w1.value;
x2=w2.value;
x3=w3.value;
document.write('<p>FROM myFunction2 PARAMETERS:<br>x1='+x1+'<br>x2='+x2+'<br>x3='+x3);
}
//-->
</script>

OUTPUT (after entering values 2,4&6):

FROM myFunction1 PARAMETERS:
b1=2
b2=4
b3=6
FROM myFunction2 PARAMETERS:
x1=undefined
x2=undefined
x3=undefined

Thanks for any help!

===Toby===

BillyRayPreachersSon · Jul 11, 2007

This is because you're trying to get the ".value" property of a number - which doesn't exist.

Either:

- Fix function 2 to not use the ".value" syntax, or
- Pass "a1, a2, a3" through to funxtion 2 instead of "b1, b2, b3".

Hope this helps,
Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

TobyWallis · Jul 12, 2007

Hi. I tried both ways and still have problems:

- Fix function 2 to not use the ".value" syntax

I tried:

Code:

function myFunction1(a1,a2,a3)
{
//b1=a1.value;
//b2=a2.value;
//b3=a3.value;
document.write('FROM myFunction1 PARAMETERS:<br>a1='+a1+'<br>a2='+a2+'<br>a3='+a3);
myFunction2(a1,a2,a3);
}
function myFunction2(a1,a2,a3)
{
x1=a1;
x2=a2;
x3=a3;
document.write('<p>FROM myFunction2 PARAMETERS:<br>a1='+a1+'<br>a2='+a2+'<br>a3='+a3);
}

- gives values of [object] for a1, a2 and a3 in myFunction1

- Pass "a1, a2, a3" through to funxtion 2 instead of "b1, b2, b3".

I tried:

Code:

function myFunction1(a1,a2,a3)
{
b1=a1.value;
b2=a2.value;
b3=a3.value;
document.write('FROM myFunction1 PARAMETERS:<br>b1='+b1+'<br>b2='+b2+'<br>b3='+b3);
myFunction2(a1,a2,a3);
}
function myFunction2(a1,a2,a3)
{
x1=a1.value;
x2=a2.value;
x3=a3.value;
document.write('<p>FROM myFunction2 PARAMETERS:<br>w1='+x1+'<br>x2='+w2+'<br>x3='+w3);
}

- gives a Permission Denied error at function 2 on the first ".value" line

I'm sure I'm missing something basic, sorry to come back to you again! Thanks for any help

===Toby===

BillyRayPreachersSon · Jul 12, 2007

In the first instance you have also modified function 1 (why change this as well?!)... Not sure why the second isn't working.

Hmm.. are you running these functions AFTER the page has loaded? If so, the document.write in function1 might be clearing out the contents of the page, thus rendering a1, s2, and a3 as undefined.

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

Olavxxx · Jul 12, 2007

I see your problem..
You are a bit confused..

The name of the function variables inside the () does not have to have the same names as the variables you pass to them.

Eg. you can do:

Code:

theFunction("blah", strFoo, strbar);

function theFunction(strText, strTitle, strAlt) {
// do something
}

However, what you did, is that you call function2 with variables that are not set.

Code:

function myFunction1(a1,a2,a3)
{
b1=a1.value;
b2=a2.value;
b3=a3.value;
document.write('FROM myFunction1 PARAMETERS:<br>b1='+b1+'<br>b2='+b2+'<br>b3='+b3+'</p>');
myFunction2([b]b1,b2,b3[/b]);
}
function myFunction2(a1,a2,a3)
{
x1=a1.value;
x2=a2.value;
x3=a3.value;
document.write('<p>FROM myFunction2 PARAMETERS:<br>w1='+x1+'<br>x2='+w2+'<br>x3='+w3+'</p>');
}

Try this code!
I havent tried it, but I believe it should be a bit better now.

Olav Alexander Mjelde

http://www.volvo-power.net

Admin & Webmaster

BillyRayPreachersSon · Jul 12, 2007

However, what you did, is that you call function2 with variables that are not set.

But b1, b2, and b3 were set...

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

TobyWallis · Jul 12, 2007

Thanks for the pointers, DaButcher, but it still doesn't work. I used:

Code:

<script language="JavaScript">
<!--
function myFunction1(a1,a2,a3)
{
b1=a1.value;
b2=a2.value;
b3=a3.value;
document.write('FROM myFunction1 PARAMETERS:<br>b1='+b1+'<br>b2='+b2+'<br>b3='+b3+'</p>');
myFunction2(b1,b2,b3);
}
function myFunction2(a1,a2,a3)
{
x1=a1.value;
x2=a2.value;
x3=a3.value;
document.write('<p>FROM myFunction2 PARAMETERS:<br>[b]x1,[/b]='+x1+'<br>x2='+[b]x2[/b]+'<br>x3='+[b]x3[/b]+'</p>');
}//-->
</script>

(note, I corrected the last document.write as it was using obsolete variable names)

- and it produces these results:

FROM myFunction1 PARAMETERS:
b1=1
b2=2
b3=3

FROM myFunction2 PARAMETERS:
x1=undefined
x2=undefined
x3=undefined

...any more ideas? [ponder]

BillyRayPreachersSon · Jul 12, 2007

As previously asked:

Are you running these functions AFTER the page has loaded?

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

TobyWallis · Jul 13, 2007

Sorry, Dan. Yes, the page loads and the input is via a form:

Code:

<body>
<form action="" method="post" name="Form1">
<p>
  <input name="first" type="text">
  </p>
<p>
  <input name="second" type="text">
</p>
<p>
  <input name="third" type="textfield">
</p>
<p>
  <input type="submit" name="Submit" value="Submit" onClick="myFunction1(first,second,third)">
</p>
</form>
</body>

===Toby===

BillyRayPreachersSon · Jul 13, 2007

Then I'll repeat my previous statement:

Self said:
Hmm.. are you running these functions AFTER the page has loaded? If so, the document.write in function1 might be clearing out the contents of the page, thus rendering a1, s2, and a3 as undefined.

So, do NOT use document.write. Use an alert or something else.

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

21524 · Jul 13, 2007

Hello ,

I am trying to send form field name as a parameter. Something like this:-

function fun_IsErrors()
{
var errors =document.Form.Errors.value;
if (errors!=null && document.Form.Errors.value.length>0) {
errors= errors.substring(1,(errors.length-1));
var errorArr = errors.split(",");
var len = errorArr.length;
var fieldName;
var fieldError;
var Idx;
for (var i=0; i<len; i++)
{
Idx= errorArr.indexOf("=");
fieldName = errorArr.substring(0,Idx);
fieldError =errorArr.substring(Idx+1 , errorArr.length);
var thefield = document.forms['repairForm'].elements[fieldName];
alert(thefield);
if(document.repairForm[fieldName])
{
document.repairForm[fieldName].style.backgroundColor ="red";
document.getElementById([fieldName]).title=fieldError;
}
}
}
}

It works well only for first element in errors array. For other elements on the form document.repairForm[fieldName] always returns 'unspecified'.

Do let me know am I missing something here.

Thanks

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

modifying form-field-name with a function parameter

Technical User

Programmer

Programmer

Technical User

Programmer

Technical User

Technical User

Programmer

Technical User

Technical User

Programmer

Technical User

Programmer

Programmer

Programmer

Technical User

Programmer

Technical User

Programmer

Programmer

Similar threads

Log in

Part and Inventory Search

Sponsor