Using smarty, take a look at the code below:
<select name="unitSelect" class="uniForm" id="unitSelect" style="width:1250px;" onchange="location.href='{$ABS_MANAGER_URL}/managerEditUnit.php?unit_id={$set[i].id}'; return false">
<option value="0" selected="selected">Select Unit</option>
{section name=i loop=$set}
<option value="{$set[i].id}" >{$set[i].unitName}</option>
{/section}
</select>
What I want, is for the value in the options to load into the select onchange"" call, for the GET variable... I can't figure out how to do this with javascript...any ideas anyone?
Thanks.
UPDATE
It wasn't easy, but between a few of your comments I got one working, thanks all:
<script type="text/javascript">
function viewUnit(value) {
var url = "managerEditUnit.php?unit_id=";
url += value;
document.location.href=url;
}
</script>
Here is an example:
<select onchange="alert(this.options[this.selectedIndex].value)">
<option value="0">Option 1</option>
<option value="1">Option 2</option>
<option value="2">Option 3</option>
</select>
EDIT:
Sorry for the duplicate.
If you want to use it with a function:
function yourfunction(value) {
alert(value);
}
And ofcourse change alert in the above HTML to yourfunction.
You could get the value in the select object by doing this in the onchange event:
onchange="alert(this.options[this.selectedIndex]"
Since you can get that value, then you can dynamically build up your GET request. Some like this:
onchange="document.location.href='somepage.php?id=' this.options[this.selectedIndex];"
jQuery makes it even easier, you can just use:
onchange="alert($(this).val())"
This should do it:
<select onchange="yourfunction(this.options[this.selectedIndex].value);">
I could suggest you to use following for getting the value when select an option from dropdownlist -->
this.value
moving to your javascript means -->
onchange="JavaScript:userDefinedFunction(this.value);"
eg::
select name='state' onchange="JavaScript:userDefinedFunction(this.value);"
Related
I need to run a jquery function if a certain dropdown option is selected.
<select name=dropdown size=1>
<option value=1>option 1</option>
<option value=2>option 2</option>
</select>
I have the commands in the function ready, Im just not sure on how to make it so if option 2 is currently active in the dropdown, then run the function.
(dropdown doesnt have a submit button, i want it ran when the user highlights the option)
Try this demo http://jsfiddle.net/JGp9e/
This will help, have a nice one!
code
$('select[name="dropdown"]').change(function(){
if ($(this).val() == "2"){
alert("call the do something function on option 2");
}
});
HTML
<select name="dropdown" size=1>
<option value="1">option 1</option>
<option value="2">option 2</option>
</select>
use
$("#idofselectbox").change(function(){
// your code here
});
hope this helps....
Try this one, Demo on JsFiddle
$('select[name="dropdown"]').change(function() {
alert($(this).val());
});
$(document).ready(function() {
$("select[name='dropdown']").change(function() {
alert($(this).val());
});
});
You need to use change function
$('select[name=dropdown]').change(function() {
alert($(this).val());
});
$(document).ready(function() {
$("select[name='dropdown']").change(function() {
if($(this).val()==2){
//do what u want here
}//u can check your desired value here
});
});
I think you want this.
A simple way can be as following:
<select name="select" id="select" onChange="window.location = this.value">
<option value="/en">English</option>
<option value="/ps">Pashto</option>
</select>
The option choosen by the user from select box, it have to be send to the desired php file (getStatus.php) may be with get method or post method but without using form submit button
<select name="status">
<option value="step_1">step_1</option>
<option value="step_2">step_2</option>
<option value="step_3">step_3</option>
</select>
Go
You will have a var called $_POST['status'] or $_GET['status'] with the value equal to the value of the selected option. Without more code that's about all I can tell you.
EDIT: This will need to be made in a form with the action attribute set to getStatus.php and preferably a method of POST. There will not be any way around using a form if you want to pass data to another page unless you pass the data with AJAX. Why are forms not an option?
use javascript for this :-
<select name="status" id="myselect">
<option value="step_1">step_1</option>
<option value="step_2">step_2</option>
<option value="step_3">step_3</option>
</select>
Go
<script>
function click_me(){
var selects = document.getElementById("myselect");
var selectedValue = selects.options[selects.selectedIndex].value;// will gives u 2
var selectedText = selects.options[selects.selectedIndex].text;// gives u value2
window.location = "getStatus.php?id="+selectedText;
}
</script>
<select name="status" id="status">
<option value="step_1">step_1</option>
<option value="step_2">step_2</option>
<option value="step_3">step_3</option>
</select>
Go
<script>
function getitem(){
var item = document.getElementById('status').value;
location.href="getStatus.php?id="+item;
}
</script>
My code reads 2 data from the database, and if those data are specific value, then it should remove values 2,3,4,5,6,7,8 from the select called smjer. Values from database are read in external .php script, and then sent back to web page using GET. My problem is next: In one specific case, when the second select in code is set to 3, then code should remove only 2nd and 3rd value from select smjer. I've done this with jQuery,and it works ,but my problem is that when i change value of other select, for example, from 2, I select value 3, nothing happens, so I have to refresh the page, so my changes would apply.
Selects look like this:
<select name="smjer" class="smjer">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
</select>
Second select:
<select name="godina" class="upis">
<option value="1" >1.</option>
<option value="2" >2.</option>
<option value="3">3.</option>
</select>
And the code for removal:
<?php }
if(($_GET['program1'])=='1'&&($_GET['stupanj_spreme1']=='2'))
{?>
<script>
$(document).ready(function(e) {
var ary=[2,3,4,5,6,7,8];
var provjera=$('.upis').val();
if(provjera=='3')
{
var ary=[2,3];
}
$('[name=smjer] option').filter(function(){
return ($.inArray(parseInt(this.value),ary) >-1);
}).remove();
});
</script>
<?php } ?>
I have been reading on net that something like this should be done with AJAX, but I don't know anything about AJAX, an I would like to avoid it. Tnx in advance.
Instead of running your javascript once onready, bind it to the change event of the select in question:
$(document).ready(function(e) {
// When the value of the select changes, run this:
$('.upis').change(function(){
var ary=[2,3,4,5,6,7,8];
var provjera=$('.upis').val();
if(provjera=='3')
{
var ary=[2,3];
}
$('[name=smjer] option').filter(function(){
return ($.inArray(parseInt(this.value),ary) >-1);
}).remove();
});
});
Also, best practice: if you don't want "upis" to EVER apply to another element on this page, consider using id instead of class.
I'm wanting to have a dropdown on my form, the options will be titles to content in my database, I want the content to show in a ckeditor when delected.
I'm looking to do something like the below with jquery and need a little help.
if 'dropdown' value is not 'please select'
CKeditor value equals php variable from database.
end statement
I'm fairly happy getting the variables in php so just need some jquery to change the ckeditor value dependant on the dropdown not being defaulted.
Hope this makes sense and thanks in advance for any responses.
html:
<select name="select" id="select">
<option value="">Select</option>
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
<option value="option4">Option 4</option>
<option value="option5">Option 5</option>
</select>
<div id="result" style="border:1px solid #000;padding:10px;color:#ff0000;display:none;"></div>
jQuery dont forget to include the jquery file
$(document).ready(function(){
$('#select').change(function() {
var option = $(this).val();
$.get('select.php', {select:option}, function(data) {
$('#result').html(data).hide().fadeIn(1000);
});
});
});
your php file (select.php)
if(!empty($_GET['select'])) {
//call database and bring back the content for this selection and echo it
}
First you would need to populate the "option" elements of your select box using php, which I believe you said you are comfortable with.
Then, using jQuery:
$(document).ready(function(){
$('#myCKEditorTextArea').text($('#mySelectBox').val());
});
for pre-population on page load, or:
$('#mySelectBox').change(function(){
$('#myCKEditorTextArea').text($(this).val());
});
for population when the user changes the select box value.
I am stuck on a problem where I want to remove all the list that fall after selected list.
I have created JS Fiddle here but it doesn't work. For example, if I select item from first drop-down then next two should removed, or if I select from second drop-down then third should be removed.
HTML
<div id='levels'>
<select id="level" class="parent" name="data[level][]">
<option value="1">1</option>
<option value="2">2</option>
</select>
<select id="level" class="parent" name="data[level][]">
<option value="3">3</option>
<option value="4">4</option>
</select>
<select id="level" class="parent" name="data[level][]">
<option value="5">5</option>
<option value="6">6</option>
</select>
</div>
Javascript
$("#levels").on('change', function() {
$(this).nextAll().remove();
});
I want to achieve this without assigning different class names or div names to each list.
Cakephp Code
Master File
<script type="text/javascript">
$(document).ready(function() {
$("select").on('change', function() {
$(this).nextAll('select').remove();
$("<div>").load('/dashboard/details/show_levels',function() {
$("#levels").append($(this).html());
});
})
<div id=levels>
<?php echo $form->input('level',array('options'=>$level,'type'=>'select','scroabble'=>true,'multiple'=>true, 'class'=>'parent')); ?>
</div>
});
show_levels
<?php
$abc=array('a','b','c','d');
echo $form->input('level',array('options'=>$abc,'type'=>'select','scroabble'=>true,'multiple'=>true, 'class'=>'parent')); ?>
Update:
Follwing solution worked for me
Replaced
$(this).nextAll('select').remove();
with
$(this).parents().nextUntil().remove();
Not sure how it worked, and whats the difference between two.
try this
$("select").on('change', function() {
$(this).nextAll('select').remove();
});
fiddle
I'm not sure you want to remove them, as you said "hide", but to use change for your scenario, you can use something like:
$(document).ready(function () {
$("#levels").on("change", ".parent", function () {
$(this).nextAll().hide();
});
});
By the way, your <select> elements need to have unique id attributes, not all have "level".
Something that makes more sense to me, is something like this:
http://jsfiddle.net/HRh2d/
Follwing solution worked for me
Replaced
$(this).nextAll('select').remove();
with
$(this).parents().nextUntil().remove();
Not sure how it worked, and whats the difference between two.
Try .siblings() instead of nextAll
Also your selects should have unique IDs