Need to take two text field values and add together to another field

Question

<p>First Name <input type="text" name="first_name"> Last Name <input type="text" name="last_name"></p>
<input type="hidden" name="screen_name" value="first_name + last_name">

How do I take what was typed into first_name and last_name fields and add them together to the screen_name so when the field is submitted, it inputs the values appropriately for the screen_name field?

I am looking for either a php or jQuery resolution.

Would this do the trick?

<?php $screen_name = $_POST["first_name"]." ".$_POST["last_name"]; ?>

  <input type="hidden" name="screen_name" value="<?php print $screen_name; ?>" />

Answer 1

You're better off leaving out the screen_name all together. Just concatenate the values from first_name and last_name at the PHP side.

<?php

$screen_name = $_REQUEST['first_name'].$_REQUEST['last_name'];

?>

If you use JavaScript, someone may just disable it and send you a screen name that isn't actually their first and last name.

Answer 2

For PHP (on the server side):

$ScreenName = $_POST["first_name"]." ".$_POST["last_name"]

With jQuery (on the client side) you'll have to add ids to the fields to easier access them:

<p>First Name <input type="text" name="first_name" id="first_name"> Last Name <input type="text" name="last_name" id="last_name"></p>
<input type="hidden" name="screen_name" value="first_name + last_name" id="screen_name">

And then on the form submit event (or input field change event) set the screen_name field value:

var screenNameVal = $.("#first_name").attr("value")+" "+$.("#last_name").attr("value");
$.("#screen_name").attr("value",screenNameVal);

Answer 3

I agree it should be server side, but just to answer your question:

var combinedName = $("input[name='first_name']").val() + $("input[name='last_name']").val();
$("input[name='screen_name']").val(combinedName);