Develop Reference

Dropdown menu always picks first option

I use a dropdown menu to choose options from a list which I get from a SQL query:
<div id="container" action="import.php" method="post" enctype="multipart/form-data">
<span id="pickfiles">[Upload files]</span>
</div>
echo ' <form action="import.php" method="post" id="pickfiles" enctype="multipart/form-data">
Adresslieferant: <select name="taskOption">
<option value="" disabled selected hidden>Adresslieferanten auswählen</option>';
foreach ($sql as $row) {
echo "<option value=' ". $row['firma'] . " ' name='adresslieferung' id='adresslieferung' type='text'>". $row['firma'] ."</option>";
}
echo ' </select>
</form> ';
?>
This is part of a form where I upload a csv file and this code snippet should choose one of the options of the dropdown menu which will be handed over in a javascript code snippet:
FileUploaded: function(up, files, info) {
window.open('import.php?file='+files.name+'&address_delivery='+(document.getElementById('adresslieferung') && document.getElementById('adresslieferung').value ? document.getElementById('adresslieferung').value : ''), '_blank')
},
But this way no matter which option I select at the dropdown menu. It always passes over the first choice of the dropdown menu. I guess it's because it just picks the first one with id='adresslieferung' but I don't know how else I could do it.

Problem is you are giving id to <options> instead of <select>, that's why when you try to get data using this id, it gives you the first value every-time.
Remove id from <options> and add it to <select>
<div id="container" action="import.php" method="post" enctype="multipart/form-data">
<span id="pickfiles">[Upload files]</span>
</div>
echo '<form action="import.php" method="post" id="pickfiles" enctype="multipart/form-data">
Adresslieferant:
<select name="taskOption" id='adresslieferung'><!-- added id here-->
<option value="" disabled selected hidden>Adresslieferanten auswählen</option>';
foreach ($sql as $row) {
//Remove id from options
echo "<option value=' ". $row['firma'] . " ' name='adresslieferung' type='text'>". $row['firma'] ."</option>";
}
echo '</select>
</form>';
?>
Note:jQuery/javascript treated id as a unique attribute so make sure an id doesn't use twice in an HTML. You can use class concept in case you want to apply some event handling on a bunch of html elements.(give them same class and apply event handling in one go)

How to restrict user to submit form if he doesnot select value from select Box-PHP

I am working on a project where admin have rights to add new users.
In ADD NEW USER form i have a select BOX of Designation which is populated from database . i want to know if user not select any designation from select options it will give error please select designation or some thing like this.
Here is my code:
<select class="form-control" name="designation" id="designation" style="color: black;" required>
<option value="<?php echo $row['designation_id']; ?>">Please Select designation</option>
<?php
$sel_cus = "select designation_name ,designation_id from designation ";
$res_cus = mysqli_query($connection, $sel_cus);
while ($row = mysqli_fetch_array($res_cus)) { ?>
<option value="<?php echo $row['designation_id ']; ?>"><?php echo $row['designation_name']; ?></option>
<?php
}
?>
</select>
If selected index of select box is 0 which is [Please Select designation] it will give error please select designation from list.
Need kind guidance.

You are accessing $row variable before it even exist in the following statement,
<option value="<?php echo $row['designation_id']; ?>">Please Select designation</option>
please replace this statement with following,
<option value="">Please Select designation</option>
value should be blank for the first option of select to work with required attribute.
Refer to this specification
And if you dont want the error to appear just remove the required attribute from the select element.

You can use this approach.
<form action="" method="post" onsubmit="return validateForm()">
<select class="form-control" name="designation" id="designation" style="color: black;" required>
<option value="0">Please Select designation</option>
<option value="1">designation 1</option>
<option value="2">designation 2</option>
</select>
<input type="submit" value="Submit">
</form>
<script>
function validateForm(){
var e = document.getElementById('designation');
var selectedDesig = e.options[e.selectedIndex].value;
if(selectedDesig == 0){
alert('Please Select designation');
return false;
}
return true;
}
</script>

Textbox fill empty value every time while changing the db dropdown value

I have one dropdown box and one textbox. I want when I select the dropdown value then, it will fill the matching database textbox value automatically based on the database drop-down selection.
Here is my code:-
Dropdown and Textbox:-
<select name="product" required>
<option value=""></option>
<?php
while($productRow = mysqli_fetch_assoc($productResult)){?>
<option value="<?php echo $productRow['ID'];?>">
<?php echo $productRow['Category']; ?></option><?php } ?>
</select>
<input placeholder="Phone Number" name="phoneNumber" id="pnum" type="text">
Script :-
<script>
$(document).ready(function(){
$('select[name="product"]').change(function()
{
$('#pnum').val($('select[name="product"] option:selected').data('Mobile'));
}
);
});
</script>
Now textbox fills the empty value in every time when dropdown value change.
pls help a lot.

You need to change the html to
<select name="product[]" size=20 multiple required>
<?php
while($productRow = mysqli_fetch_assoc($productResult)){?>
<option value="<?php echo $productRow['ID'];?>">
<?php echo $productRow['Category']; ?></option><?php } ?>
</select>
Then remove the script because it is no longer required. All the selection of items is done in the <select> element.
On the server-side you will pickup the values in the product array.

how do i get the select value not the option value in php

Hi can some one help me to my problem.
I have a html and php function here all i want to to is to echoed a select value not the option value
here is my code
Ouput: Patrick or any for the name when I select and send the button
<?php if(isset($_REQUEST['send'])){echo $_POST['test'];}?>
<form method="post">
<select name="test"><option value="1">Patrick</option><option value="2">Maria</option><option value="3">Fe</option></select><input type="submit" name="send" value="submit">
</form>

specify the value in option like this "1_Patrick"
<?php if(isset($_REQUEST['send'])){
$value = explode('_',$_POST['test']);
echo $value[1];
}
?>
<form method="post">
<select name="test"><option value="1_Patrick">Patrick</option><option value="2_Maria">Maria</option><option value="3_Fe">Fe</option></select><input type="submit" name="send" value="submit">
</form>

<?php if(isset($_REQUEST['send'])){echo $_POST['test'];}?>
change the value of your option to you want to display
<form method="post">
<select name="test">
<option value="Patrick">Patrick</option>
<option value="Maria">Maria</option>
<option value="Fe">Fe</option>
</select>
<input type="submit" name="send" value="submit">
</form>
//change the $row['id'] to $row['name']
<?php $q = mysql_query("select * from name");?>
while($row = mysql_fetch_assoc($q)){
echo '<option value='.$row['name'].'>'.$row['name'].'</option>' ;
}
// ok you want to used the id in option value.in your submit code get the name for table check bellow code
<?php if(isset($_REQUEST['send'])){$id=$_POST['test'];
$q = mysql_query("select * from name where id=$id");
$row = mysql_fetch_assoc($q);
echo $row['name'];
}
?>
<?php $q = mysql_query("select * from name");
while($row = mysql_fetch_assoc($q)){
echo '<option value='.$row['id'].'>'.$row['name'].'</option>' ;
}?>

The value of the select will be whatever option is selected. If I select Maria, you will see 2 displayed.

<table cellpadding="3" cellspacing="3" align="center" width="50%">
<tr>
<td>
<select name="user" id="user_id" onChange="selectuser()">
<option value="0">Select User</option>
<option value="1">Patrick</option>
<option value="2">Maria</option>
<option value="3">Fe</option>
</select>
</td>
</tr>
</table>
<script language="javascript">
function selectuser()
{
var name = $("#user_id option:selected").text();
alert(name);
}

when you post any form then data contained in the value attribute of the field will get posted.
So you can change the value data to the desired value, like value="Patrik"
As you said that there is purpose behind adding numeric data to value then my suggestion would be add this numeric data to some other custom attribute like data-customid="1" etc and change value="Patrick"
You can add custom attribute in option value.
Refer this link for details.

pure js:
DEMO
document.addEventListener('DOMContentLoaded', function() {
document.querySelector('select').addEventListener('change', function() {
alert(this.options[this.selectedIndex].innerText);
}, false);
}, false);

how to pass selected option id value to codeigniter controller

i want to pass selected option value in id to codeigniter controller.
<p>
<select id="quantity" name="quantity" tabindex="2" onchange="calculate(this)" required autofocus>
<option value="">Choose Your Quantity</option>
<?php
if($prodqty)
{
foreach($prodqty as $qty)
{
for($i = $qty->quantity_from; $i <= $qty->quantity_to; $i++)
{
?>
<option value="<?=$i?>" id="<?=$qty->discount?>"><?=$i?></option>
<?php } } } ?>
</select>
</p>
i am already getter selected option value, now i want to get id value also i.e. id="discount?>"
function add_cart_prod()
{
if(isset($_POST['submit']))
{
this is controller where i want to get id value

Use ajax call on change event of the selection of the options:
Just Changed your code little :
<select id="quantity" name="quantity" tabindex="2" onchange="calculate(this)" required autofocus>
<option value="0">Choose Your Quantity</option>
<?php
if( !empty($prodqty)):
foreach($prodqty as $qty):
for($i = $qty->quantity_from; $i <= $qty->quantity_to; $i++): ?>
<option value="<?php echo $i?>" id="<?php echo $qty->discount?>"><?php echo $i?></option>
<?php endfor;
endforeach;
endif; ?>
</select>
Your javascript function :
<script type="text/javascript">
function calculate(id)
{
var id=id;
$.ajax({
type:'POST',
url:'your controller/add_cart_prod',
data:{'id':id},
success:function(data){
// the next thing you want to do
}
});
}
</script>
Your Controller Function:
function add_cart_prod()
{
$id=$this->input->post('id',true);
//send this value to your model
}

If you subitted the data via POST, which I suppose, because you test the POST-Array, you should get them this way:
$this->input->get_post('quantity');
But perhaps you used in your HTML the option GET for the form submission, then this should work:
$this->input->get('quantity');
If you want to get both values XSS-clean you should add a second paramenter, which is set to TRUE:
$this->input->get_post('quantity',TRUE);
As discussed below you should change the value of the option to:
<option value="<?=$i?>_<?=$qty->discount?>"><?=$i?></option>
And then explode the array by this char: "_" to get the two values:
$valuearray = explode ( "_" , $this->input->get_post('quantity'));
$valuearray[0] should contain your $i-part and $valuearray[1] the discount.
Important is, that the delimiter-char cannot be a value of either $i or $qty->discount. Otherwise choose a different char

You should try this, maybe it will work, Inside the calculate(this) function:
var discount = $("select[name='quantity'] option:selected").attr('id');
alert( discount );
$("#discount").val( discount ); //this will save the discount value in the hidden field
EDIT:
Put a hidden field in your form to contain the discount value
<input type="hidden" name="discount" id="discount">
Now, submit the form as usual. Hope it helps.