Is it possible to change the value of xmlhttp.open with javascript ?
Im calling a xmlfile with
xmlhttp.open("GET","prod.php?category=1"+str,true);
xmlhttp.send();
but I only get the first elements from my xml file since the category is 1
if I change it to 2, it prints out my second elements.
Can i change the category value with just a javascript from my dropdown menu ?
this is my form
<form>
Select a CD:
<select name="cds" onchange="showCD(this.value)">
<option value="">Select a CD:</option>
<option value="item1">item1</option>
<option value="item2">item2</option>
<option value="item3">item3</option>
</select>
</form>
Yes, you can surely do that by getting the value of dropdown.
// get the value from the dropdown
var dd_value = document.getElementById('dropdown_id');
// now you can append the same to the xml http request object
xmlhttp.open("GET","prod.php?category=" + dd_value + str,true);
xmlhttp.send();
Hope that helps.
Related
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>
I have generated drop-down box using loop. Now I want to get all value using J-Query for pass these value for insertion through Ajax.
My HTML CODE is:
<select name="travel[]" id="travel[]" >
<option value="1">Car</option>
<select>
<select name="travel[]" id="travel[]" >
<option value="2">Train</option>
<select>
<select name="travel[]" id="travel[]" >
<option value="3">Bus</option>
<select>
After click on Save button, how to collect all values of travel?
I don't understand why you define three <select> elements with an index-based name, each containing a single <option>. You do know that a <select> element is exactly that - it gives the user a selection?
With your current markup, the user doesn't get a choice about their selection - rather, travel[] will always be an array containing: 1,2,3.
You'd be better to modify your markup as follows:
<select name="travel" id="select_travel">
<option value="1">Car</option>
<option value="2">Train</option>
<option value="3">Bus</option>
<select>
Now you can easily access the value using:
$('#select_travel').val();
You can do this:
var data = $('select[name="travel[]"]').map(function () {
return $(this).val();
}).get();
console.log(data); // ["1", "2", "3"]
This will return you an array with the value for all the dropdowns.
Fiddle demo
why you are making name and id both as array type... i think one will enough if you really want to use array type.... then make id as unique for all...
<select name="travel[]" id="abc">
</select>
<select name="travel[]" id="def">
</select>
<select name="travel[]" id="xyz">
</select>
now you can access dropdown list easily..
$("#abc").val();
$("#def").val();
$("#xyz").val();
or else you can define uniq class for them if you really want array type id and name
<select name="travel[]" id="travel[]" class="abc">
</select>
<select name="travel[]" id="travel[]" class="xyz">
</select>
and try like this...
$(".abc").val();
$(".xyz").val();
hope it may help you
you should try js like-
var selectOption=$('#select_travel').val()
var Id=selectOption.getAttribute('id');
var name=selectOption.getgetAttribute('id');
now you can take output on button click
I'm trying to create a drop-down list with four options such that if I select the 4th option, I want a text box created so that I can get the value typed in that box using "$_GET"
Something like this;
<select name="value">
<option value="value1">Option 1</option>
<option value="value2">Option 2</option>
<option value="value3">Option 3</option>
<!-- And a 4th one -->
</select>
And if the 4th one is selected, a box should appear like this;
<input type="text" name="firstname">
Edit;
My current code;
<script>
jQuery(function($){ //calling the code inside braces when document loads and passing jQuery object as '$' parameter;
$("select[name='sortby']").change(function(){ //binding an event that fires every time select value changes
var select = $(this); //caching select, which value was changed
if(select.val() === "byDefindex"){ //checking if we selected the right option
$("<input>").attr({type: "text", name: "defindex"}).appendTo(select.parent()); //creating new input element object, setting its value to "value4" and appending to select parent element or wherever you want it
}
});
});
</script>
<form action="<?php $_PHP_SELF ?>" method="GET">
Select:
<br />
<select name="sortby">
<option value="playHours">Play Hours</option>
<option value="lastLogin">Last Login</option>
<option value="byDefindex">By Defindex</option>
</select>
<br />
<input type="submit" />
</form>
If your 4th option is this:
<option value="value4">Option 4</option>
You can use jQuery to display the field.
Put your field in a <div>
<div id="field"><input type="text" name="firstname"></div>
Now,
<script type="text/javascript">
$(document).ready(function(){
$('input[name="value"]').change(function(){
var v = $('input[name="value"]').val();
if(v=="value4") $('#field').show();
else $('#field').hide();
})
})
This is usually done via javascript; something like this (by using popular JavaScript library, jQuery) :
jQuery(function($){ //calling the code inside braces when document loads and passing jQuery object as '$' parameter;
$("select[name='value']").change(function(){ //binding an event that fires every time select value changes
var select = $(this); //caching select, which value was changed
if(select.val() === "value4"){ //checking if we selected the right option
$("<input>").attr({type: "text", name: "firstname"}).appendTo(select.parent()); //creating new input element object, setting its value to "value4" and appending to select parent element or wherever you want it
}
});
});
Hope that helps. You can find more here jQuery site
I'm not certain this is what you're asking, but it seems you're wanting to add new lines to your select list?
I often do something similar to this for adding new options to lists. The first option would be 'add a new record', like this:
<select name="value">
<option value="-1">Add New Option</option>
<option value="value1">Option 1</option>
<option value="value2">Option 2</option>
<option value="value3">Option 3</option>
</select>
Note that the value for "add new" is -1... you could put anything here, but it should be something that would never show up in the other options, so your javascript knows what to do when it is selected.
Add a 'onchange' to the select box like this:
<select name="value" onchange="if(this.value == -1) addOption(this);">
Note that if the selected option is -1, then a javascript function is called. It references itself (this), so that your function knows who called it.
Then create a function that allows adding a new option:
function addOption(theSelectElement){
// create a text box, underneath the select box:
var newInput=document.createElement('input');
newInput.type='text';
theSelectElement.parentNode.insertAfter(newInput,theSelectElement);
}
You'll want to add more code to this function so that the new text field has a name and perhaps an ID.
Hope this helps, or at least points you in the right direction.
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.
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);"