Jump to content

Welcome to Geeks to Go - Register now for FREE

Need help with your computer or device? Want to learn new tech skills? You're in the right place!
Geeks to Go is a friendly community of tech experts who can solve any problem you have. Just create a free account and post your question. Our volunteers will reply quickly and guide you through the steps. Don't let tech troubles stop you. Join Geeks to Go now and get the support you need!

How it Works Create Account
Photo

Concatenate two html fields into one


  • Please log in to reply

#16
Metallica

Metallica

    Spyware Veteran

  • GeekU Moderator
  • 33,101 posts
How about this one:

<html>
<head>
<title>Test</title>
	<script type="text/javascript">
function comblf()
{
	var last = document.forms[0].elements("Last_Name").value;
	var first = document.forms[0].elements("First_Name").value;
	if(last.length > 1 && first.length > 1)
	{
		document.forms[0].elements('[01]lastfirst').value = last + ', ' + first;
	}
}
   </script>
</head>

<body>

<form action="#" method="post">
	<input name="First_Name" type="text" />  <input name="Last_Name" type="text" onkeyup="comblf()" /><br />
	<br />
	<input name="[01]LastFirst" type="text" onchange="comblf();" /><br />
	<br />
	<input name="Submit" type="submit" value="submit" /></form>

</body>

</html>

I left the [01] out of the javascript, but the value you are going to submit will have it.

Note that I set the script to work as soon as you fill out the last name field for testing purposes.

Hope that helps. :)
  • 0

Advertisements


#17
ScHwErV

ScHwErV

    Member 5k

  • Topic Starter
  • Retired Staff
  • 21,285 posts
  • MVP
That didn't work either. This is the working form that I have.

[codebox]
<head>
<script type="text/javascript">
function comblf()
{
var last = document.forms[0].student_ln.value;
var first = document.forms[0].student_fn.value;
if(last.length > 1 && first.length > 1)
{
document.forms[0].lastfirst.value = last + ', ' + first;
}
}
</script>
</head>

<body>

<form action="#" method="post">
<input type="text" name="[01]First_Name" value="" id="student_fn" onkeyup="comblf()" />
<input type="text" name="[01]Last_Name" value="" id="student_ln" onkeyup="comblf()" /><br />
<input type="text" name="[01]LastFirst" value="" id="lastfirst" /><br /><br />
<input name="Submit" type="submit" value="submit" />
</form>

</body>

</html>
[/codebox]

Unfortunately this relies on the ID tag being there. This isn't horrible, and it works. Its just one more thing that I have to remember to add when/if this gets updated in the future.
  • 0

#18
Metallica

Metallica

    Spyware Veteran

  • GeekU Moderator
  • 33,101 posts
I think I'm missing what's not working.

Both yours and mine work fine here.
  • 0

#19
ScHwErV

ScHwErV

    Member 5k

  • Topic Starter
  • Retired Staff
  • 21,285 posts
  • MVP
Odd, when I tried yours in both Firefox and IE, it didn't work.
  • 0

#20
Ax238

Ax238

    Tech Staff

  • Technician
  • 1,323 posts
The script I gave you worked in all of IE, Firefox, and Opera as well.

Edit: OK, I just debugged the script and found a couple issues with the script I posted. The first one is that the element name needed to be "[0]LastFirst", rather than "[0]lastfirst". The second issue is that Firefox doesn't like "[" and "]" characters inside parentheses (or parentheses at all), so the parentheses need to be changed to square brackets.

Following is an updated version that I can guarantee will work in all three browsers:
function comblf()
{
	var last = document.forms[0].elements['[01]Last_Name'].value;
	var first = document.forms[0].elements['[01]First_Name'].value;
	if(last.length > 1 && first.length > 1)
	{
		document.forms[0].elements['[01]LastFirst'].value = last + ', ' + first;
	}
}

  • 0

#21
ScHwErV

ScHwErV

    Member 5k

  • Topic Starter
  • Retired Staff
  • 21,285 posts
  • MVP
Ill be trying that first thing in the morning. If that works with the program, it should help me clean up some other code ive written.
  • 0

#22
Ax238

Ax238

    Tech Staff

  • Technician
  • 1,323 posts
:) Sounds good, let me know if there are problems.
  • 0

#23
ScHwErV

ScHwErV

    Member 5k

  • Topic Starter
  • Retired Staff
  • 21,285 posts
  • MVP
It took me awhile to get back because I've been busy beating my head on my desk.

If I copy your code into a simple html form on my desktop it works great. If I put that simple html page on the webserver it works great. If I put it to use within the page I need it to work on, it breaks. Even if I disable all the other javascript scripts on that page, it still doesn't work.

Funny thing is that when I was controlling it using the ID, it did work. I just cant figure it out. Same script using the IDs rather than the Name and it works. The script obviously is correct because it works outside that particular page.

Any ideas?
  • 0

#24
Ax238

Ax238

    Tech Staff

  • Technician
  • 1,323 posts
The only things I can think of right off hand is if there are multiple forms on the page and it's not used in the first form of the document or if the field names are not exactly the same (case included). Can you confirm either of these as true?
  • 0

#25
ScHwErV

ScHwErV

    Member 5k

  • Topic Starter
  • Retired Staff
  • 21,285 posts
  • MVP
Its a small part of one large form. I checked the case and field names so many times my eyes are fuzzy.
  • 0

Advertisements


#26
Ax238

Ax238

    Tech Staff

  • Technician
  • 1,323 posts
Do these elements sit on the top level of the form? In other words, by traversing the DOM tree, you go through <body>, <form>, then the specific input elements? It's hard to deduce the issue without the ability to see the generated HTML source.
  • 0

#27
ScHwErV

ScHwErV

    Member 5k

  • Topic Starter
  • Retired Staff
  • 21,285 posts
  • MVP
Ill zip it up and ship it to you on Monday. I cant get to that server from here.
  • 0

#28
Ax238

Ax238

    Tech Staff

  • Technician
  • 1,323 posts
:) Sounds good.
  • 0

#29
bdlt

bdlt

    Member

  • Member
  • PipPipPip
  • 876 posts
beware of cut & paste:

the code in post#20 works fine ...

when it looks like this
document.forms[0].elements['[01]LastFirst'].value = last + ', ' + first;


but not like this
document.forms[0].elements['[01]LastFirst'].value = last +
', ' + first;
  • 0

#30
ScHwErV

ScHwErV

    Member 5k

  • Topic Starter
  • Retired Staff
  • 21,285 posts
  • MVP
The code field should keep that from happening. Even if it shows on a different line for you, it should still copy properly. In any case, I always check my code. I actually didn't copy/paste it, I modified my existing code to match.


And yes, I error checked it. Repeatedly.
  • 0






Similar Topics

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

As Featured On:

Microsoft Yahoo BBC MSN PC Magazine Washington Post HP