How can i end up with two values after submit okay i was wondering how can i have the hidden value and another value containing the div text?? the reason why it because im going to insert both of those values in different variables to insert into a mysql query
html code:
<form action="" method="POST" onsubmit="return insert_value()">
<input id="hidden_data" name="data" type="hidden" value="<?php $user_id ?>"/>
<div id="showing_data" class="commenttext" contenteditable="true"></div>
<input type="submit" value="Submit" id="submitthis" />
</form>
Javascript CODE:
function insert_value()
{
var values = [];
values.push(document.getElementById('hidden_data').value);
values.push(document.getElementById('showing_data').textContent);
console.log(values);
return true;
}
Replace div
with textarea
and to disable resizing use css:
textarea {
resize: none;
}
To answer your real question, but slightly modifying it; instead of merging them both in one input create another hidden input.
in HTML add this line:
<input type="hidden" name="data_result" id="data_result" />
And your javascript code:
function insert_value()
{
var html = document.getElementById('showing_data').textContent;
document.getElementById('data_result').value = html;
return true;
}
just replace the div with textarea and add style = "resize:none"
to the text area
<form action="" method="POST" onsubmit="return insert_value()">
<input id="hidden_data" name="data" type="hidden" value="<?php $user_id ?>"/>
<textarea style = "resize:none" id="showing_data" class="commenttext" contenteditable="true"></textarea >
<input type="submit" value="Submit" id="submitthis" />
</form>
and change following line in the javascript
document.getElementById('showing_data').value;
you can make it textarea and you can have hidden value of that.
<textarea id="showing_data" rows="4" cols="50">
and if you dont want to be draggable just use this in css
textarea
{
resize: none;
}