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?
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.
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).
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.
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:
I suggest that you use JQuery for accessing the DOM.
?>and do this in regular html