I want to use select2 for my dropdown list. The options are from a database query. What I got is there are two dropdown lists showing. The first one is the original dropdown and the second is using select2.
The select code is:
<select name="city" id="select-city" class="form-control">
<option></option>
<?php foreach ($cities as $ct) : ?>
<option value="<?php echo $ct->id ?>"><?php echo $ct->name ?></option>
<?php endforeach; ?>
</select>
And the javascript is:
<script>
$(document).ready(function () {
$("#select-city").select2();
});
</script>
I want to hide the original dropdown. How can I do this?
I have 2 select menu :
<select name="nama_paket">
<?php
do {
?>
<option value="<?php echo $row_qpaket['nama_paket']?>"><?php echo $row_qpaket['nama_paket']?></option>
<?php
} while ($row_qpaket = mysql_fetch_assoc($qpaket));
$rows = mysql_num_rows($qpaket);
if($rows > 0) {
mysql_data_seek($qpaket, 0);
$row_qpaket = mysql_fetch_assoc($qpaket);
}
?>
</select>
and
<select name="harga">
<?php
do {
?>
<option value="<?php echo $row_qpaket['harga']?>" ><?php echo $row_qpaket['harga']?></option>
<?php
} while ($row_qpaket = mysql_fetch_assoc($qpaket));
?>
</select>
when we select the first select menu the second select menu change automatically? Thanks
If you want to change it Dynamically when according to 1st selected value, you need to use ajax in order to do this
this answer explain it
You need to get select name="hagra" via AJAX after selecting select name="nama_paket"
You can use Jquery .change() event for this. Like:
$('select[name=nama_paket]').change(function(){
// your code you can set different value to second select box
})
I need one help.i am fetching data from my DB ,i need when data has fetched one Javascript function will called through onChange event.Let me to explain my code.
<?php
$id=$_GET['ids'];
if($id!=""){
$getcustomerobj = $dbobj->getFeedbackData($db,$id);
}
?>
<div style="width:24%; float:left; padding:10px;">Answer Type :
<select class="form-control" id="answer_type" name="answer_type" onChange="selectScale(this.value);">
<option value="">Select Answer Type</option>
<?php
$ustatus=array("status"=>'1');
$feeddata=$db->kf_answertype->find($ustatus);
foreach($feeddata as $v){
?>
<option value="<?php echo $v['_id']; ?>" <?php if($getcustomerobj->answer_type == $v['_id'] or $_REQUEST['answer_type'] == $v['_id']){ print 'selected'; } ?>><?php echo $v['answertype']; ?></option>
<?php } ?>
</select>
</div>
<div style="width:24%; float:left; padding:10px; display:none;" id="scaleid">Scale :
<select class="form-control" id="nscale" name="noofscale">
<option value="">Select No Of Scale</option>
<?php
$status=array("status"=>'1');
$feeddata=$db->kf_scale->find($ustatus);
foreach($feeddata as $v){
?>
<option value="<?php echo $v['_id']; ?>" <?php if($getcustomerobj->no_of_scale == $v['_id'] or $_REQUEST['no_of_scale'] == $v['_id']){ print 'selected'; } ?>><?php echo $v['noofscale']; ?></option>
<?php } ?>
</select>
</div>
<script>
function selectScale(id){
console.log('select scale',id);
var data=$.param({'op':'getscale','sid':id});
$.ajax({
method:'POST',
url:"dbcon/DBConnection.php",
data:data
}).done(function(msg){
//console.log('msg',msg);
var dedata=JSON.parse(msg);
//console.log('decode',dedata);
if(dedata[0]['data']==1){
document.getElementById("scaleid").style.display="block";
}
if(dedata[0]['data']==0){
document.getElementById("scaleid").style.display="none";
}
});
}
</script>
Here I need when data are fetching from DB the Answer Type drop down field will set with some value.As the second drop down list(i.e-Scale) is depends on first drop down, i need to call selectScale function which has triggered using onChange event.Please help me.
I think you can call onchange event for your first drop-down on document ready so based on this your second drop-down value will be selected.
$(document).ready(function(){
$("#answer_type").trigger("change");
});
may be this is helpful for you.
As what i have understood ,what you need is simply add this line to your java script
selectScale($('#answer_type').val());
Also this solution could work, by triggering change function using jQuery
$("#answer_type").trigger("change");
I am getting my data from another page to populate an input, but I don't know how to populate a multi-select with that data. Here's my multi select:
<select multiple="multiple" class="multi-select" id="my_multi_select4" name="experience[]">
<?php foreach(WorkModel::Work_List() as $work): ?>
<option value="<?php echo System::escape($work->we_id); ?>"><?php echo System::escape($work->we_name); ?></option>
</select>
To populate it, I need to separate the options with the following data from my JSON:
For example: json_required_name
Many times, there's more than one (would have used a foreach loops, but my page loads before the modal, which grabs the data from another page).
Here is my JSON sample:
{"name":"Gev Offshore","description":"","duration":"1","country":"United Kingdom","employer":"gev offshort","start_date":"2015-08-01","job_start":"2015-08-21","job_end":"2015-08-21","requirements":[{"id":"1","name":"IRATA Level 1 Technician"},{"id":"2","name":"IRATA Level 2 Technician"},{"id":"3","name":"IRATA Level 3 Technician"},{"id":"4","name":"Equipment and Hardware Related"},{"id":"5","name":"NDT Aerospace"},{"id":"6","name":"NDT ECI"},{"id":"7","name":"NDT General"},{"id":"8","name":"NDT MPI"},{"id":"9","name":"NDT Radiography"},{"id":"10","name":"NDT Ultrasonic"},{"id":"11","name":"Rigging"},{"id":"12","name":"Rope Access"},{"id":"13","name":"Rope Access \/ NDT Management"}]}
Is this what you're looking for:
http://jsfiddle.net/1jjps0mv/
Html:
<select multiple="multiple" class="multi-select" id="my_multi_select4" name="experience[]">
</select>
Javascript:
var xreturn = {"name":"Gev Offshore","description":"","duration":"1","country":"United Kingdom","employer":"gev offshort","start_date":"2015-08-01","job_start":"2015-08-21","job_end":"2015-08-21","requirements":[{"id":"1","name":"IRATA Level 1 Technician"},{"id":"2","name":"IRATA Level 2 Technician"},{"id":"3","name":"IRATA Level 3 Technician"},{"id":"4","name":"Equipment and Hardware Related"},{"id":"5","name":"NDT Aerospace"},{"id":"6","name":"NDT ECI"},{"id":"7","name":"NDT General"},{"id":"8","name":"NDT MPI"},{"id":"9","name":"NDT Radiography"},{"id":"10","name":"NDT Ultrasonic"},{"id":"11","name":"Rigging"},{"id":"12","name":"Rope Access"},{"id":"13","name":"Rope Access \/ NDT Management"}]};
$(function() {
$.each(xreturn.requirements, function() {
$('#my_multi_select4').append('<option value="'+this.id+'">'+this.name+'</option>');
});
});
?
does your WorkModel::WorkList() return json or is it returning an associative array? If it is returning the latter, then your code should be mostly correct with the addition of the following:
<select multiple="multiple" class="multi-select" id="my_multi_select4" name="experience[]">
<?php foreach(WorkModel::Work_List() as $work): ?>
<option value="<?php echo System::escape($work->we_id); ?>"><?php echo System::escape($work->we_name); ?></option>
<?php endforeach; ?>
</select>
its necessary that you put the endforeach; block for it to know when to terminate the loop, otherwise it will keep repeating the loop over the select end tag.
now, if the former is true, then you want to first convert your data into an associateive array before performing your loop with json_decode like so:
<select multiple="multiple" class="multi-select" id="my_multi_select4" name="experience[]">
<?php foreach(json_decode(WorkModel::Work_List()) as $work): ?>
<option value="<?php echo System::escape($work->we_id); ?>"><?php echo System::escape($work->we_name); ?></option>
<?php endforeach; ?>
</select>
I have a drop down menu which is populated dynamically. Im trying to set one of the options as the default value. Given that the options are populated in the drop down only at run time, I cannot use
<option selected=selected> No </option>
My code is as follows:
<div name="form.option" class="aob-div-dyn-field">
<tbody>
<tr>
<td class="label-section" >
<label class="main-label">Choose your options</label>
</td>
<td class="input-section-dyn">
<select class="main-input-select" ></select>
</td>
</tr>
</tbody>
</div>
This refers to another file which has the enum declared.
enum options {
YES:"YES"
NO: "NO"
}
This line refers the enum "options" to the field option.
attribute optional option: options "option"
Any ideas on how I can proceed with this?
Yes you can do what you need just declare the first selected option like you have and then loop through all remaining items below. Just keep it outside of the loop. If "NO" is in your loop then just check for that and continue so you don't have a double up of options. Example:
<?php $a = results_array(); ?>
<option selected=selected> No </option>
<? foreach($results as $key => $value): if( $value == 'NO' ){ continue; } ?>
<option value=<?php echo $key; ?>><?php echo $value; ?></option>
<?php endforeach; ?>