I have using the following code for my dropdown
<select class="form-control" name="device" id="device" onChange="getBrand(this.value);">
<option selected name="device" id="device" value="<?php echo $row['id'] ?>"><?php echo $row['name']; ?></option>
</select>
for form submit, i have used this code
if(isset($_POST['submit'])){
extract($_POST);
$device = $_POST['device'];
}
I want to get selected value in button submit, currently I got the id instead of value.
Thanks in advance.
You have to put $row['name'] as value of your option
<select class="form-control" name="device" id="device" onChange="getBrand(this.value);">
<option selected name="device" id="device" value="<?php echo $row['name'] ?>"><?php echo $row['name']; ?></option>
</select>
If you can't change option value, you could use jQuery:
$("#your_form").submit( function () {
var option_text = $('#device').find(":selected").text();
$("#your_form").append('<input name="selected_option_text" type="hidden" value="' + option_text + '">');
});
This will add a input field with name "selected_option_text" before submit. So you will find it in your receiving script
You can add a data-attribute on your option
for example
data-value = $row['name']
Then get the data-attr in your Javascript/jQuery
Related
I have a dropdown list populated from a database query. Options are 1, 2, 3, etc. When an item is selected, I want the value of the comp_id (for example "1") to go in the placeholder of an input field of a form. When the form is submitted, the value of the placeholder will then be inserted in another table in the database (together with other data) via an INSERT statement. This is my code:
<?php
echo "<label>Please select the Competition: <select name='opt'>";
while ($row = mysqli_fetch_array($result)) {
echo "<option value='" . $row['comp_id'] ."'>" . $row['compname'] ."</option>";
}
echo "</select></label>";
print_r($row['comp_id']);
?>
And this is part of the form:
<input type="text" name="comp_id" placeholder=" (the value from the selected item ">
I can't seem to find a solution despite the countless searches I have made. Very grateful for your help. Thanks.
You can use jQuery
HTML
<select name="opt">
<option value="0">Select</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<input type="text" name="comp_id" placeholder="(the value from the selected item)">
jQuery
$("select[name=opt]").on("change", function(){
var val = $(this).val();
$("input[name=comp_id]").attr( "placeholder", val );
});
Demo
Note: Only values of input fields will be posted on form submission. Placeholders will not be posted on form submission.
I know this question has been asked a lot of times in several other ways but none of them helped me. So, I have formatted it in my own words.
Supppose I have a select box like this:
<select name="something">
<option value="1"><?php echo $value1; ?> for <?php echo $value2; ?>
</select>
<input type="text" name="sometext" value="">
I want to have the <?php echo $value1; ?> in the text field updated live on change of the select box option. To be clear, I DO NOT want the value="1" in the text field and I need to have that value="1" there for some reason and I cannot replace it with value="<?php echo $value1; ?>". I strictly want the inside value <?php echo $value1; ?> to be replaced in the text field. But I do not know how I can achieve it. Please help me experts. For live changing jQuery preferred.
Try below code:
<select name="something">
<option value="1" data="<?php echo $value1; ?>"><?php echo $value1; ?> for <?php echo $value2; ?></option>
</select>
<input type="text" name="sometext" value="">
See below working HTML
jQuery(document).ready(function($){
$('#something').change(function(){
$('#sometext').val($(this).find(':selected').attr('data'));
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="something" id="something">
<option value="1" data="value1">value1 form value01</option>
<option value="1" data="value2">value2 form value02</option>
<option value="1" data="value3">value3 form value03</option>
<option value="1" data="value4">value4 form value04</option>
</select>
<input type="text" name="sometext" id="sometext" value="">
Hope this will work for you,
$(document).ready(function() {
$('select').change(function(){
var selectedOption = $("select option:selected").text(); //Get the text
selectedOption = selectedOption.split("for"); //split the 2 value by using for
alert(selectedOption[0]); //Get the value before for
$('input').val(selectedOption[0]);
});
});
You need to fetch the selected option text instead of the usual option value, it is pretty easy to do.
You don't need to add any data attributes to achieve this, as there is a method to fetch the actual option text.
Here is a working example:
PHP for populating a select element (below I show the static HTML)
<select id="something" name="something">
<?php foreach($selectList as $value=>$text){ ?>
<option value="<?php echo $value;?>"> <?php echo $text;?> </option>
<?php } ?>
</select>
HTML
<select id="something" name="something">
<option value="1"> Value 1 </option>
<option value="2"> Value 2 </option>
<option value="3"> Value 3 </option>
</select>
<input type="text" id="sometext" name="sometext" value=""/>
jQuery
$(document).ready(function(){
$('#something').on('change',function(){
var selectedText = $(this).children(':selected').text();
$('#sometext').val(selectedText);
});
});
This approach is fast and easy to maintain.
And of course a jsfiddle to see it in action: https://jsfiddle.net/kzgapkt5
Hope it helps a bit
i want to get the id of selected option in dropdown.
I have a dropdow that displays company names from database. Now I want get the id of that company. How do i do that?
<select required name="org-list" id="org-list" class="form-control">
<option value="">Select</option>
<?php foreach($org as $value) { ?>
<option id="org" value="<?php echo $value['org_name'];?>"><?php echo $value['org_name']; ?></option>
<?php } ?>
</select>
The Model
public function get_organisation()
{
$q = $this->db->select('*')
->from('company')
->get();
return $q->result_array();
}
And in my controller i want the id of selected option from database.
$data = $this->key_m->array_from_post(array('id','org-list','keys'));
$data['keys'] = $license;
var_dump($data);
You should put the organization id in option tag's value. like this
<option value="<?php echo $value['org_id'];?>"><?php echo $value['org_name']; ?></option>
No need to provide id attribute to each option tag. When you will submit the form value of "org-list" will be selected organization id.
This is the ajax way
$.post(url,{ id : "id value from drop down here" },function(data){
//This is the call back for success
})
For that one, you need jquery. The is the easiest way to use. Url is where you are posting back to server.
In your server side catch like this
$this->input->post('id')
Because you used "id" in the ajax request. So you have to retrieve it using the field name 'id' . Hope you get it.
There are a couple things which you "should" / "could" change. At first I noticed that your ID attribute is "org", Id's are supposed to be unique and yours is not. Though, back to the actual question. You should change your code as follow:
<select required name="org-list" id="org-list" class="form-control">
<option value="">Select</option>
<?php foreach($org as $value): ?>
<option id="<?php echo $value['org_id'];?>" value="<?php echo $value['org_id'];?>"><?php echo $value['org_name']; ?></option>
<?php endforeach; ?>
</select>
Now in your controller you grab the selected ID like: $this->input->post('org-list').
You have to provide value for each id attr. for corresponding <option>
<select required name="org-list" id="org-list" class="form-control">
<option value="">Select</option>
<?php foreach($org as $value): ?>
<option id="<?php echo $value['org_id'];?>" value="<?php echo $value['org_name'];?>"><?php echo $value['org_name']; ?></option>
<?php endforech; ?>
</select>
I have texbox and dropdown list which is populated from mysql database.I want to change textbox value using dropdown list, without refreshing the page.
Here is my code and Thanks in Advance.
<select name="select" id="dropdownlist1">
<option id="0">-- Select the Company --</option>
<?php
require("dbcon.php");
$getallcompanies = mysql_query("SELECT * FROM ifcandetails6");
while($viewallcompanies = mysql_fetch_array($getallcompanies)){
?>
<option id="<?php echo $viewallcompanies['tcuid']; ?>"><?php echo $viewallcompanies['tcname'] ?></option>
<?php
}
?>
</select>
Here is my Input field code:
<input type="text" id="field1" value="<?php echo $viewallcompanies['tcname']?>" disabled/>
Use following
$(document).ready(function(){
$("#dropdownlist1").change(function(){
$("#field1").val($(this).val());
});
});
As you can do it on front side itself, you dont need to change in your PHP code. Add the following code on DOM ready.
After a bit of help and learning, I have managed to change a target via JScript, but I can't seem to figure out how to make a variable or make it do a calculation.
My code so far is (these are three Form Boxes + a Submit Button):
NUMBER
<input name="contact_build"
type="text"
id="contact_build"
value="<?php echo $row_contact['contact_build']; ?>" />
TYPE
<select id="contact_type"
name="contact_type"
onchange="targ.value=this.value" />
<?php
$specresult = mysql_query("SELECT * FROM `types` ORDER BY type_value");
while ($specrow = mysql_fetch_array($specresult)) {
echo '<option value="' . $specrow['type_name'] . '">' . $specrow['type_name'] . '</option>';
}
?>
</select>
VALUE
<input name="contact_value" id="targ" value="<?php
$var1 = $row_contact['contact_build'];
$var2 = $row_value['type_value'];
$total = round($var2 * $var1);
echo "" . $total . "";
?>" />
<input type="submit" name="Submit2" value="Update" />
What I want to do is make "TARG" the "$VAR2" variable, so that it can work out the VALUE calculation then echo (or what ever command is required) the answer in the VALUE box, as soon as the user changes the option in the TYPE box. Hope this makes sense.
At the moment I have managed to get it to show the "TYPE" value in the "VALUE" box. It ignores any "echo" command above.
Am I looking at this incorrectly and it should be done another way?
PS: I know it's MYSQL; I am working on learning PDO as we speak to change it over. :-) But for the moment, I just want to figure this out using the language that I have basic knowledge of.
Go through the code below.
<body>
<input name="contact_build"
type="text"
id="contact_build"
value="<?php echo $row_contact['contact_build']; ?>" />
<select onchange="change(this.value)" >
<option value="1"> 1</option>
<option value="2"> 2</option>
<option value="3"> 3</option>
</select>
<input type="text" id="targ" value="2"/>
<script>
function change(val) {
var cnt_bld = document.getElementById("contact_build").value;
var total_val = Math.round(parseInt(val) * parseInt(cnt_bld));
document.getElementById("targ").value = total_val;
}
</script>
</body>
In the above code i have called a function change(this.value) which will accept the select box value. Then in the function I have used that value to change the value of input field. Look at document.getElementById. With your code your were directly using a id instead. Hope this helps.
EDIT
this line
echo '<option value="' . $specrow['type_name'] . '">' . $specrow['type_name'] . '</option>';
can be done like this if you have those name and value.
echo '<option value="' . $specrow['type_value'] . '">' . $specrow['type_name'] . '</option>';
assuming your another column name as type_value where values are stored like 100,200and so on and type_name is the name like good, better or best.
Hope this is what you may want
<html>
<body>
<input name="contact_build"
type="text"
id="contact_build"
value="10" />
<select onchange="change(this.value)" >
<option value="0">Select</option>
<option value="1"> 1</option>
<option value="2"> 2</option>
<option value="3"> 3</option>
</select>
<input type="text" id="targ" value="0"/>
<script>
function change(val) {
document.getElementById("targ").value = document.getElementById("contact_build").value*val;
}
</script>
</body>
</html>