CODEWITHSUNDEEP
phpjavascript
Sammy
Sammy

Reputation: 777

How to set one HTML input from another input

I'm trying to get the value of an input field in my .php document, and with this, set another input field, by triggering an OnClick event.

This is my current code

echo" <label onClick=\" document.getElementById(\"hiddenDescriptionField\").value = 'document.getElementById(\"descriptionField\").value'; ";

How can I set my hiddenDescriptionField from descriptionField using javascript?

Upvotes: 0

Views: 184

Answers (4)

codebox
codebox

Reputation: 20254

This should do it:

echo "<label onclick=\"document.getElementById('hiddenDescriptionField').value = document.getElementById('descriptionField').value; \"";

It should be 'onclick' not 'onClick', also your quotes were a bit mangled - I think I've fixed it.

Upvotes: 2

Mourad
Mourad

Reputation: 11

In HTML, this should work:

<form>
  <input id="hiddenDescriptionField"/>
  <input id="descriptionField" value="My Field Value"/>
</form>

<label onclick="document.getElementById('hiddenDescriptionField').value = document.getElementById('descriptionField').value" >Click me</label>

You can try this code here:

http://jsfiddle.net/m5XyA/

I suggest that you use JQuery for accessing the DOM.

Upvotes: 1

bokonic
bokonic

Reputation: 1771

I'd recommend taking making the event listener non-inline (assuming you add an id to your <label>):

$my_script = <<<HIDDEN_DESC
<script>

var hidden = document.getElementById('hiddenDescriptionField'),
    description = document.getElementById('descriptionField');

document.getElementById('my-label').addEventListener('click', function (e) {
  hidden.value = description.value;
}, false);

</script>
HIDDEN_DESC;

(Put here as a heredoc to fit with your current method of building HTML).

Upvotes: 2

Borniet
Borniet

Reputation: 3546

Since this:

document.validateForm.hiddenDescriptionField.value = 'document.descriptionField.value'

isn't working either (you're telling JavaScript to set the value to the string between the quotes), the problem is probably in the naming of your HTML elements. Is the name of you hiddenDescriptionField correct?

Besides this, you can also check out codebox's answer above, JavaScript is caseSensitive, so onclick won't work. To test that, add a

alert('test');

to your code, and you will easily see if your code is executed or not.

Upvotes: 1

Related Questions