set sibling element's value as current element's value - javascript

I need to set a checkbox input's value as equal to value of it's sibling select option.
HTML:
<select name="team[]" class="form-control team" id="team">
<option></option>
<?php foreach ($teams as $team): ?>
<?php
$selected = '';
if (isset($edit)):
$selected = (in_array($team->id, $availableTeams)) ? ' selected' : '';
endif;
?>
<option value="<?php echo $team->id; ?>" <?php echo $selected; ?>><?php echo $team->title; ?></option>
<?php endforeach; ?>
</select>
<label>Lead</label>
<input type="checkbox" name="lead_check[]" value="">
Option values in select option are populated dynamically using loop.

You can use this script.
$(document).ready(function(){
$(document).on("click","#team",function(){
$("input[name='lead_check[]'").val($(this).val());
});
$("#team").trigger("click"); //For setting first time value on page load.
});
It will set selected options value to the checkbox on select box click event.

Assuming you want this to run on page load, here is an example of doing so:
$(function() {
$("input[name='lead_check[]']").attr('value', $("select[name='team[]']").val());
});
This will take the value of the selected option from the dropdown, and will set it as the value of the checkbox.

Related

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);
}

Selectize js submitting only last selected item

I'm currently using Selectize.js with a 'select' item and multiple options. My html is something like:
<div class="form-group">
<label for="record-genre">Genre(s):</label>
<select name="record_genre" id="record-genre" class="form-control multi-selectize" multiple="multiple" placeholder="Enter genre(s)">
<?php foreach ($record_genre_opts as $key => $val): ?>
<option value="<?php echo $key; ?>" <?php echo (in_array($key, $record_genre)) ? "selected" : ''; ?>
<?php echo set_select('record_genre', $val); ?>
>
<?php echo $val; ?>
</option>
<?php endforeach;?>
</select>
</div>
So far so good. The items are being loaded correctly and until this point everything works great. The issue is that when the form is submitted only the last value selected is the one that is available, so if I selected multiple items I'm getting just one:
["record_genre"]=> string(1) "1"
Here's my JS setup:
$('.multi-selectize').each(function(){
//console.log($(this))
$(this).selectize({})
})
Any suggestions?
Thanks.
My mistake. The name of the select item should be record_genre[] since it is declared as a multiple select instead of just record_genre.

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.

Jquery: Call function on drop down menu selection.

I have created and populated a drop down, I wish to alert(1) when the option in the dropdown changes. I can do it for a button with onclick but onchange doesn't seem to work. Thanks in advance.
global.js file:
$('input#lst_MonthDrop').on('change',function(){
alert(1);
};
Drop down menu:
<select name="lst_MonthDrop" style="background-color:#FF9933; color:#FFF; border:none; margin-top:10px; margin-left:10px;" onchange="global.js">
<option>Please Select</option>
<?php
include 'populatedrodown.php';
foreach ( $results as $option ) : ?>
<option value="<?php echo $option->Date; ?>"><?php echo $option->Date; ?> </option>
<?php endforeach; ?>
</select>
Remove the onchange attribute you currently have, and also target the elements name attribute. You do not have an ID:
$("select[name=lst_MonthDrop]").change(function() {
#lst_MonthDrop is <select> not <input>
Change
$('input#lst_MonthDrop').on('change',function(){
alert(1);
};
to
$('select[name="lst_MonthDrop"]').on('change',function(){
alert(1);
};

show or hide component with a trigger from multiplied combo box

I can't show or hide a component from a multiplied combo box, but I can show or hide it from an original combo box(the first combo box)
what should I do..?
this is function to multiply the combo box
function addEmploy() {}
$('#addEmploy').click(function(){
$('#comboEmploy')
.append('<br />')
.append($('#comboEmploy select').first().clone());
});
this is script to show or hide the component
$("#employ").change(function() {
if($(this).val() == "2"){
$("#comboStudy").show("slow");
}else{
$("#comboStudy").hide("slow");
}
});
This is the combo box
<span id="comboEmploy">
<select name="employ[]" id="employ">
<option value="NULL" selected >Choose one</option>
<?php foreach ($employs as $employ) :?>
<option value="<?php echo $employ->employ_id; ?>">
<?php echo $employ->employ_name; ?></option>
<?php endforeach; ?>
</select>
</span>
Add Employ
This is the component that I want to show/hide
<span id="comboStudy">
<select name="study[]" id="study">
<option selected value=NULL>Choose one</option>
<?php foreach ($studies as $study) :?>
<option value="<?php echo $study->study_id; ?>">
<?php echo $study->study_name; ?></option>
<?php endforeach; ?>
</select>
</span>
Can anyone help me. thanks before.
When you clone the select box, you need to tell jQuery to clone the events along with it:
.clone(true);
As you are appending elements to the DOM after page load you need to use the live() function to attach their events:
$("#employ").live("change", function() {
...
}

Categories

Resources