I have textarea on simple html form. I want to display selected value of that text area just like selected value in dropdown. I searched google where I found textarea has no value attribute. So is there any option to display selected textarea value in html?
I want to show it's value while editing form just like selected value in dropdown list while editing..
you have to try this coding..
$('#formId :textarea').click(function() {
alert(this.tagName != 'TEXTAREA' ? this.tagName : this.type);
});
I put like this..and it's working..
<textarea name="yojana" id="yojana"cols="50" rows="3"><?php echo $delivery_memo_info->yojana;?></textarea>
Hope this link helps you
http://plnkr.co/edit/ocl4Zcmv4qjXSIxE7IyF?p=preview
jQuery not required. With plain Java Script, you can achieve this functionality.
HTML :
<textarea id='123' onkeyup='getvalue()'>
TEXTAREA
</textarea>
JS :
function getvalue(){
var a = document.getElementById('123').value;
alert(a)
}
Related
i have a input box that is within a div.This input box is replaced by another input box onchange the select box value.now i want to post this input box value in php variable so that i can insert it into database.
here is my input box before onchange select box value:
<div id="pay"><input type="text" name="cheque_no" /></div></td>
function of onchange select box is below:
function changeVal2(value)
{
var rows = document.getElementsByTagName('label');
var rows2= document.getElementById('pay');
var xx=document.getElementById('myid');
var yy=xx.innerHTML;
var txt=document.getElementById('txtbox');
var txt2=txt.innerHTML;
for(var i in rows)
{
if(rows[i].id == 'mylabel')
{
if(value=="Direct To Bank")
{
rows[i].innerHTML = "Bank Account"; //for display only a single value that is currently selected
rows2.innerHTML=yy;
document.getElementById('myid').style.display='none';
//rows[i].innerHTML += value; //for gettting all those values that are selected again and again
}
else
{
rows[i].innerHTML = "Cheque/DD No.";
rows2.innerHTML=txt2;
}
}
}
}
here is the input box that is replaced after onchange select box value:
<div id="txtbox" style=""><input type="text" name="cheque" id="cheque" /></div>
now i want to post this input box value in php variable as follows:
echo $cheque_no=$_POST['cheque'];
please give me suggestion for this problem.I have spend 3-4 hours on this problem.Thanks in advance...
If I could better understand your problem that you are trying to replace div element by onchange on the same page, its mean the existance of that input box is twice on that page, and for post via php you have to make input element name as array like this...
<div id="txtbox" style=""><input type="text" name="cheque[]" id="cheque" /></div>
and try to post it with php as $_POST['cheque'][0] or $_POST['cheque'][1].
If you are facing double existance of input box then it will definately resolve your issue...
the Input Box has a value Hanako<.
after I call the jquery to get value, It alert Hanako<.
I want to alert Hanako<
Jquery code:
var chk_val_2 = $('#txt_rename' + chk_check).val();
alert (chk_val_2);
Please Help me.
Is your HTML like this:
<input id="txt_rename123" type="text" value="Hanako<">
HTML replaces entities in attribute values, so if you want a literal & you have to write:
<input id="txt_rename123" type="text" value="Hanako<">
FIDDLE
How can I insert an additional input textbox after an onchange event in a selectbox with the YUI library?
It is required to use YUI and the form is created with the PEAR Quickforms lib.
What I have yet is this:
$form->addElement('select', 'names', "Choose Name", $options, array('style'=>'width:300px', 'onchange' => 'name_changed(this.value);'));
$js =
<<<EOS
<script type="text/javascript">
function name_changed(name) {
alert('name is changed');
}
</script>
EOS;
$form->addElement('static', 'jsembed', '', utf8_encode($js));
The alert pops up if I change the option in the selectbox, this works for testing.
Now I need to check the chosen option and if this equals 'NEW', there should appear a text input field to enter a new name under the select box.
My problem is, that I don't know to do it right that the entered name is also passed to the submitted quickform data.
So I've created the element normally with $form->addElement('input',...) and copied the html source of this. On the option change event I've tried to insert the raw html code at the right position with this:
var htmlContent = '<div id="fitem_id_dbname" class="fitem fitem_ftext"><div class="fitemtitle"><label for="id_dbname">Create new DB </label></div><div class="felement ftext" id="yui_275"><input size="60" name="dbname" type="text" value="" id="id_dbname"></div></div>';
document.getElementsByClassName('fcontainer clearfix').innerHTML = htmlContent;
But this doesn't work, there appears no input field in the browser.
Could anybody show me how to do it right?
Lots of thanks!
I solved it for me now with the...
'style'=>'display:none'
...property in the quickform textinput element and use...
document.getElementById('id of the input element').style.display = 'block';
... which is called on the onchange event.
see my client site first to get an idea.
In above site, i have a giftfinder box in right side. There are 3 select boxes. currently I'm using 3 forms for these 3 select boxes which means each drop down select box is embedded into form. When you select the first drop down select box, it picks one and second select box's value will be determined which value is selected from first select box. So if you choose Man, then all athe related occasions of Man will be dispalyed into seconds drop down select box. Its working fine.
But the problem is it refreshes everytime you select the first drop down box.
I don't want to refresh page. it must select the value and pass the value so seconds select box can determine its related values.
so I'm thinking to us ajax. but no success.
So i included some code for the first drop down select box.
this is mix of html and php and wordpress.
<div class="select-one">
<form id="searrec" method="post" action="">
<select name="selectionRecipient" id="selectionRecipient" onchange="this.form.submit();">
<?php
$results_rec = get_option('current_recipient');
if(isset($_POST['selectionRecipient'])){
$results_rec = $_POST['selectionRecipient'];
update_option('current_recipient', $results_rec);
$results_rec = get_option('current_recipient');
}
?>
<?php
//asort($result_rec);
$t_name_arr = array();
foreach($result_rec as $rec):
$t_id = $rec->term_id;
$term = get_term($t_id , 'category' );
$t_name_arr[] = $term->name;
endforeach;
//print_r($t_name_arr);
rsort($t_name_arr);
foreach ($t_name_arr as $t_name):?><option class="rec_val"<?php if($results_rec==$t_name){ echo 'selected="selected"';}?>value="<?php echo $t_name;?>"><?php echo $t_name;?></option>
<?php endforeach;?>
</select>
<input type="hidden" id="submitrec" value="Search" />
</form> -->
</div>
So I'm am using form method post and using $_POST to retrieve the selected value and pass it to $results_rec variable.
Later in the code, I'm using if.. else to determine if $results_rec =='Man' then display certain items which are related to Man and so forth.
So what I want is not to refresh the page while I select item from first drop down select box.
Please help.
change this:
<select name="selectionRecipient" id="selectionRecipient" onchange="this.form.submit();">
to this:
<select name="selectionRecipient" id="selectionRecipient">
and the jquery:
$("#searrec").submit(function(e) {
e.preventDefault();
// your code
return false;
});
EDITED:
use this to get the selected index (number)
var index = $("#selectionRecipient")[0].selectedIndex;
or value:
var value = $("#selectionRecipient")[0].value;
Then you can call an ajax perhaps: (assuming the other selection box has "id=other_select"
$.ajax({url:"index.php",type:"POST",data {type:"populate",index:2,value:"option1"},dataType:"json",
success: function(data) {
// data (json) returned from server so populate other selection boxes with that..
// in this example 'data' is an array, coming directly from server (see below the .php)
$("#other_select")[0].selectedIndex = 0;
for(var x in data) {
$("#other_select")[0].options[x] = new Option(data[x]);
}
}
})
in your .php i assume you get a list (etc. database) to populate the other selection list (in client). This code could looks like:
if (isset($_POST["type"]) && $_POST["type"]=="populate") {
echo json_encode(array("option1","option2","option3"));
exit(1);
}
$('#searrec').submit(function () {
//do some form submit work here
return false;
});
You'll have to use an AJAX call to populate the other select boxes based on whatever you've selected in the first one without reloading the page.
I suggest you take a look at jQuery's AJAX functionality. Read up on $.ajax and $.post - with them you could submit the value that you've selected in the first listbox to a PHP script and then based on that value return and populate the other select boxes.
Use AJAX to update the other selects without refreshing the page. Use jQuery to make AJAX easy.
This question will help:
Change the selected value of a drop-down list with jQuery
$('#searrec').submit(function(e){
e.preventDefault();
});
You should delete event onchange="this.form.submit(); from combobox
And use ajax with jquery:
$("#searrec").onchange(function() {
$.ajax({
url:"",
success:function(response){
alert("success");
}
});
});
Guys its fixed.
Plz have a look at http://giftideasitems.com/.
See gift finder box and see how it works.
I used iframe and embedded the forms, drop down coding there. thats it.
Even I used onchange="this.form.submit()" and page doesnot referesh, actually page refresh .... but not the main page, only the iframe is refreshing which is fine. this is exactly what i wanted.
<div id="gift-finder">
<div class="gift-finder-form">
<iframe name="inlineframe" src="code.php" frameborder="0"
scrolling="auto" width="200" height="180"
marginwidth="0" marginheight="0" id="gift-iframe">
</iframe>
</div>
This is my iframe code and see src, i used code.php; so all code is in separate place.
Though I had to modify some css, but anyways this is fine.
Thanks everyone who contributed yesterday.
Is it possible to display one value and send another value at the same time in Input text field?
For example 2 is the current value shown in <input> box when i onchange the <select> box.
Now I need to send the value 3 for that <input> box but need to display 2.
Example:
<input type="text" value="2" name="test1">
should display 2 in the page and need to pass 3 to next page.
If I echo $_POST["test1"] it should print 3.
try this (if i understood your question correctly):
$('select').change(function(){
var val = this.value;
$('input.select').val(val);
})
and here is the fiddle: http://jsfiddle.net/maniator/hp8cr/
ON QUESTION UPDATE
Why not on the PHP side just add one to the post:
echo ($_POST["test1"] + 1);
If you are using jquery and ajax post, you can achieve this.
$.post("myscript.php",
{ test2: $('#test2').val(val), // Submit normally
test1: '3' // Change the value
},
function(data){
// Handle response here
});
)