Develop Reference

How to remove a selected option from another select tag when i have five select with same options and values?

I have this code
<?php for($i=1;$i<=5;$i++){ ?>
<select name="bonus<?php echo $i;?>" style="margin-top:30px;">
<?php foreach($bonusable as $bns) {?>
<option value="<?php echo $bns['type'];?>"><?php echo $bns['name'];?></option>
<?php } ?>
</select>
<?php }?>
This code display the five select and these have same options with the same value , and i need to delete the option if is selected in another select tag.. I have an image that shows what this code displays
please help me, and sorry for my English!

Try this below code
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<div>
<?php for($i=1;$i<=5;$i++){ ?>
<select id="bonus<?php echo $i;?>" name="bonus<?php echo $i;?>" onchange="Process_form('<?php echo $i;?>',this.value)" style="margin-top:30px;" >
<option value="1">1</option>
<option value="2">2</option>
</select>
<?php }?>
</div>
<script>
function Process_form(Id,Value)
{
<?php for($i=1;$i<=5;$i++){ ?>
var i='<?php echo $i; ?>';
if(i!=Id)
{
$("#bonus"+i+" option[value="+Value+"]").attr('disabled','disabled');
}
<?php } ?>
}
</script>

This is the solution for this.. i tried everything but this give me an error when i click submit:
Undefined index: bonus1 ..
<script>
var $select = $("select");
$select.on("change", function() {
var selected = [];
$.each($select, function(index, select) {
if (select.value !== "") { selected.push(select.value); }
});
$("option").prop("disabled", false);
for (var index in selected) { $('option[value="'+selected[index]+'"]').prop("disabled", true); }
});
</script>

Get selected option jquery on change function is not working

When I am select dropdown option then does'not assign the value of selected option in hidden field.
Please correct Where I am doing wrong. Thanks in advance.
<?php
include("../common/config.php");
$time = time();
$id=$_REQUEST['dr_id'];
$allEst = $db->select(array("*"),PREFIX."obligation_pharmacy","obligation_id IN ($id)");
}
?>
<script type="text/javascript">
function populate(unique,sel){
alert(sel.value);
$("#pharmacy_id"+unique).val(sel.value);
}
</script>
<select name="pharmacy_name[]" class="name" id="pharmacy_name<?php echo $time?>" style="width:180px; font-size:11px;" onchange="populate(<?php echo $time?>,this)">
<option value="">Select Pharmacy Name</option>
<?php
foreach($allEst as $ss)
{if($ss->pharmacy_name!=''){?>
<option value="<?php echo $ss->id;?>"><?php echo $ss->pharmacy_name; ?></option>
<?php }} ?>
</select>
<input type="hidden" name="pharmacy_id[]" id="pharmacy_id<?php echo $time?>" value="">

Using jQuery, usually something like this:
$('#my-select').change(function(){
var value = $(this).val();
$('#my-hidden-input').val(value);
});

$('#pharmacy_name').change(function(){
// get selected option value
var option_val = $( "#pharmacy_name option:selected" ).val();
// populate hidden field
$('#pharmacy_id').val(option_val);
}

Multiselect without showing result on page

I use multiselect JS with php to get more than one selection of my form select.
Impossible for me not to show the selection' results on the select tags.
At least, if It's possible to show just the number of sélection(s) , it would be nice.
Thanks.
Sorry by impossible for to enter my code for the moment ! (seem not working)
<label for="showroom">Type/products* :</label>
<select class="form-control" id="materials" name="materials" multiple="multiple">
<?php while($prod=mysqli_fetch_assoc($prodQ)): ?>
<option value="<?php echo $prod['choc_id']; ?>"><?php echo $prod['choc_nom']; ?></option>
<?php endwhile; ?>
</select>
<script type="text/javascript">
$(document).ready(function() {
$('#materials').multiselect();
});
</script>

Insert value select in textbox html

I read the discussion on how to check outstretched by HTML select and add in HTML text input.
Does not work in my case having a select dynamic that takes while loop with the data from DB. Could you help me find a solution?
I want to display the value and the text that is chosen in the select, in the form below in a text field.
<select name="auto" id="auto">
<option value="false">Auto non presente</option>
<?php while ($row = mysqli_fetch_array($result_modello)):; ?>
<option value="<?php echo $row['id_modello']; ?>"><?php echo $row['nome_modello']; ?></option>
<?php endwhile; ?>
</select>
<select name="marca">
<option value="false">Marca non presente</option>
<?php while ($row = mysqli_fetch_array($result_marca)):; ?>
<option value="<?php echo $row['id_marche']; ?>"><?php echo $row['nome_marche']; ?></option>
<?php endwhile; ?>
</select>

Not using jQuery but with plain old regular Javascript something along these lines should do it.
<form>
<select id='auto' name='auto'>
<option value=1>Banana
<option value=2>Apple
<option value=3>Cherry
<option value=4>Pomegranate
<option value=5>Mango
</select>
<div id='results'></div>
</form>
<script type='text/javascript'>
function display(e){
var el=e.target;
var div=document.getElementById('results');
var value=el.options[el.options.selectedIndex].value;
var text=el.options[el.options.selectedIndex].text;
div.innerHTML=value+text;
}
document.getElementById('auto').addEventListener('change',display,false);
</script>

this will work
var e = document.getElementById("auto");
var value = e.options[e.selectedIndex].value;
var text = e.options[e.selectedIndex].text;

Try this :
$("input[type=text]").val($("select[name=marca]").val());
Or
$("input[type=text]").val($("#auto").val());
If you want display both select use this :
var one = $("#auto").val();
var two = $("select[name=marca]").val();
$("input[type=text]").val(one + " , " + two);

I thank you for your attention to my post .
Only in my case being dynamic text field appear in the select all values ​​.
I wished that in the two text boxes in the second form comparissero only two values ​​chosen in the two select .

you can use .val() for value and .text() for getting text.
var text_val = 'val : ' + $("select").val() + 'text : ' +$("select").text();
$("input[type=text]").val(text_val);

jquery doesn't recognize option list text if form tag is included

I'm trying to send the selected option text to the url using jquery but whenever I wrap my form between <form></form> tags it stops working and sends the value instead of the text. If I remove the form tags it behaves the way i expect.
I want to know if there's any way to make it work without excluding the form tags
Thanks!
<form>
<select name="brand" id="brand" class="update">
<option value="">Seleccionar</option>
<?php if (!empty($list)) { ?>
<?php foreach($list as $row) { ?>
<option value="<?php echo $row['id']; ?>">
<?php echo $row['name']; ?>
</option>
<?php } ?>
<?php } ?>
</select>
<select name="model" id="model" class="update" disabled="disabled">
<option value="">----</option>
</select>
<select name="size" id="size" class="update" disabled="disabled">
<option value="">----</option>
</select>
<input type="submit" value="Search" id="submit">
</form>
</div>
</div>
<script src="js/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="js/core.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#submit').click(function(){
var brand = $('#brand option:selected').text();
var model = $('#model option:selected').text();
var size = $('#size option:selected').text();
location.href ='index.php?s='+brand+'+'+model+'+'+size+'';
});
});
</script>

The form is submitting, you'll need to prevent that:
$(document).ready(function(){
$('#submit').click(function(e){
e.preventDefault();
var brand = $('#brand option:selected').text();
var model = $('#model option:selected').text();
var size = $('#size option:selected').text();
location.href ='index.php?s='+brand+'+'+model+'+'+size+'';
});
});

You need to return false from your event handler to prevent the form submission from taking place.
Just add
return false;
at the end. (You can also do what adeneo's answer says to do; either should work.)