How to get the value of the selected option in php
<select id="select" name="select">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
<option value="option4">Option 4</option>
</select>
PHP is a server-side language. So without submitting anything to the server, you can't find what option has been selected. However, if you want to find it with JavaScript or the jQuery library, you could do something like this:
Using vanilla JavaScript:
document.getElementById("select").onchange = function() {
// find what option the user changed to!
var option = document.getElementById("select").value;
// alert with the option
alert("Select changed to: " + option);
};
Using jQuery library:
// uses jQuery's .change() for a <select> element
$("#select").change(function() {
// find what option the user changed to!
var option = $("#select option:selected").text();
// alert with the option
alert("Select changed to: " + option);
});
You have to make a php file which creates a database table( mysql or mariadb can be used) then in that table you have to redirect the value of form by assigning the php file to the action button and then the value of that option will get restored in that database.
I will prefer to use phpmyadmin, you can create database in it without code and can link it to your file. But if you want to really learn this then i will suggest that first learn php and mysql from a decent website like w3schools because if you simply copy the code than you will not understand anything.
PHP is serverside programming language and it can get values from post , get and cookies and ... . you have to submit form to send values through GET or ... . Best way to do this is using ajax .
`$('#select').on('change',function(){
$.ajax(
/* your code here */
);
}).
Related
I have written below lines to display multiselect box and I want to few option disabled which is previously selected.
<select multiple="multiple" name='cars[]'>
<option value="volvo" disabled selected='selected'>Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
So here In POST method I want to get value of all the selected option including first one volvo.
Afaik, no modern browser will submit a disabled option/field in a form. The easiest solution is to make it a "readonly" field by using the "readonly" attribute.
However, you will have to style the field to look like it has been disabled, as readonly does not change the field's appearance it just prevents the user from modifying it.
The ugly part is, however, that some browsers will NOT allow the readonly attribute to be set for a select field.
What I have usually done in this case is to actually disable the select and store the value in a hidden field instead using some not so ugly javascript to control this on the fly.
Update:
You could easily write a "serializeDisabled" function, iterating over the disabled form elements which have a name attribute and using the jQuery.param function at the end, to generate the serialized string (function comes from the user CMS here):
(function ($) {
$.fn.serializeDisabled = function () {
var obj = {};
$(':disabled[name]', this).each(function () {
obj[this.name] = $(this).val();
});
return $.param(obj);
}
})(jQuery);
You could create a javascript function to loop around the options onSubmit and enabled them again. Disabled elements do not get posted.
when you set the disabled never get in the POST data.... replace select to input type text..and use "readonly" property of that...
Thanks
Is there a way to mimic the C input/select box where you have a pull down with a blank text-entry at the top? Users would either type a new value or select from the list. Has anyone figured a way to do this with PHP/Javascript? An AJAX type of solution would even be better.
I'm not sure what to call this type of box, I don't think it is a "combo box" like most people think of.
You have a few options.
Here's a quick function I threw together in jQuery that will do what you want. This option required the client have JavaScript enabled to work.
http://jsfiddle.net/QrA4N/25/
If you don't want to make JavaScript a requirement
If you want a solution without JavaScript (client side code). You are stuck with placing an input box with the same "name" as your select box next to it or after it and adding an "Other" option to your select box.
<select name="selAnimals" id="selAnimals">
<option value="dog">Dog</option>
<option value="cat">Cat</option>
<option value="bird">Bird</option>
<option value="guineapig">Guinea Pig</option>
<option value="">Other</option>
</select>
<input type="text" name="selAnimals_Other" id="selAnimals_Other" />
Now your PHP will have to check both $_POST["selAnimals"] and $_POST["selAnimals_Other"] to derive the correct value.
The best option is to combine the HTML above and the JavaScript above that to create a gracefully degrading solution for those with JavaScript enabled or disabled.
http://jsfiddle.net/QrA4N/26/
I added the extra HTML INPUT tags to the jsfiddle from the top of the answer and only changed 1 line of the jQuery function (makeInputSelect).
var $inp = $("#" + id + "_Other");
You can use famous Chosen library for that :)
BTW, see the second example of countries.
I need to submit combo box value with out form. When I click on any value of combo that suppose to submit automatically using javascript. I am using PHP in backend.
<select name="select" id="select" style="width:50px;">
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
<option value="All">All</option>
</select>
Here a js part:
function getinfo() {
var aList = document.getElementById("select");
var val = aList.options[aList.selectedIndex].value;
// document.write("<p>Here what you select: "+val+"</p>");
// here you can send `val` to the server using... are you using any js library?
}
And you need to change your select declaration:
<select name="select" id="select" style="width:50px;" onchange="getinfo()">
--------------------
</select>
OK, how to send val to the server is another question... If you are using jQuery - you can use jQuery.ajax(...) or any helper like jQuery.get(...). If you are vanilla-js user you can use XMLHttpRequest way and if you use any other lib - just check this lib's documentation to get helped about sending data to the server.
You can use the methods below.
1) Use Session or Cookie to send external data
2) Send a POST request using XMLHttpRequest in javascript.Checkout the link here.
3)You can use cURL function to send HTTP POST request. Please go through the link here.
Some comments:
The select element should always be inside a form. But you don't need to expose the form on the page--you do not need to include a submit input element.
You can use Javascript (JS) to submit the form after the user has changed the value of the select.
Or you can use JS with Ajax to submit the form asynchronously in the background--the user will not be aware that the data had been submitted and the page will not reload or "flash"
What would you like to do?
I populate a drop down box from an array that uses Javascript on the page load. But I am pulling data out of a database how would I change which one was selected? I would prefer not to have to use PHP to create the drop down boxes, as I have other non php things that use the javascript as well. What Can I do to get my Drop DownList populated from PHP?
You can see that it just calls the SelectdeptDropdown function.
<label for="collegedropdown">Collge</label>
<select name="collegedropdown" id="collegedropdown" onChange="SelectDeptDropdown();">
<option selected="selected">Choose a college</option>
</select>
<br />
<label for="deptdropdown">Department</label>
<select name="deptdropdown" id="deptdropdown">
<option selected="selected">Choose a department</option>
</select>
Javascript Code:
removeAllOptions(document.profilecreate.deptdropdown);
addOption(document.profilecreate.deptdropdown, "", "Choose One", "");
if(document.profilecreate.collegedropdown.value == 'MY CHOICE #1'){
//all options here
}
//repeat for other cases here
NOTE: removeAllOptions calls another function that simply clears the dropdown list. addOption calls a function that creates the option element.
basically you need to use an XHR Request. The XHR request will hit another end point of your php server which will return data for you to populate the dropwdown field and then you can use some smart javascript to insert into the dom.
Tne end point should ideally return a json data which will only be the dropdown values and you generate the markup on the client side this is ont compulsory but recommended.. read more abt XHR and json here.
Finally I would suggest you to use a library like jquery that gives you simple api for XHR requests and DOM manipulation using which you can get your job done quickly.
Suppose a form.php file, and there is "add" button, once it's clicked, a drop down list will show, to let you choose which type of input type you want. For example:
<select name="Type">
<option value="Text">Text</option>
<option value="MultipleChoice">MultipleChoice</option>
<option value="Checkbox">Checkbox</option>
</select>
My question is, I don't know how to implement the function that, once the type is chosen, suppose checkbox, then a checkbox will shown, and could let you input the label of each checkbox, you can do this one by one.
Also I want to make this process could happen iteratively. I'm not sure if I explain clearly, it's a little bit like the google form function. Any ideas? If providing some codes would be better. Thanks!
Here is plain vanilla old school HTML/JS
<select name="Type" onchange="showformelement(this.value)">
<option value="text">Text</option>
<option value="MultipleChoice">MultipleChoice</option>
<option value="Checkbox">Checkbox</option>
</select>
<script>
function showformelement(whichelement){
//use whichelement to embedd element in DOM
}
</script>
If you can use jQuery or similar toolkit it may be a much simpler job
I know what are you looking for, just let you know that it isn't a simple script, it will have way too many functions and will be little hard to build.
Just to start, if you search on the web for PHP and jQuery based form builders and similar other things, you will find many ready to use scripts. Well, if you don't want to search for one, the principle logic will look like following:
PS: I will explain how to develop using jQuery.
<select id="options">
<option value="1"></option>
<option value="2"></option>
<option value="3"></option>
</select>
<script>
$(document).ready(function(){
$('#options').change(function(){
var optSelected = $('#options option:selected').val()
if(optSelected == 1){
// Shows up and div with Checkboex for edit
}
if(optSelected == 2){
// Shows up and div with Combobox for edit
}
if(optSelected == 3){
// Shows up and div with Textbox for edit
}
})
})
</script>
After doing that, you will need to build the options of each type...
There is too much work... look, I didn't write here your script, I just explained you how to build...
This is a huge system...you will need to know a bit of JavaScript to make one of these...
Even simpler, without needing to do any casing or conditioning, (uses jQuery).
Example: http://jsfiddle.net/SMAfA/
$(function() {
$("#type").change(function() {
type = $("option:selected", this).text();
$("#target").append("<input type="+type+">");
})
})