getting variable from javascript to php

Question

I have a simple combo box whose value I can get in JavaScript. I am doing that so I don't need to refresh the page. Also I want to use the selected value to do some conditional branching after combo box so how do I get the value of combo box from JavaScript to my variable $change.

echo '<select id="combo_1">';
echo '<option value="2">Submative</option>';
echo '<option value="1">formative</option>';
echo '</select>';

Below is my JavaScript:

 <script type="text/javascript">
 $(document).ready(function() {
 $('#combo_1').change(function(){
 });
 });
 </script>

Here I want to do $change = $(this).val(), but obviously I cant do it like this.
Any suggestions? i want to do it on the same page without refreshing or without submitting my url kinda look like this

 http://localhost/lms/grade/report/userdef/index.php

and i want it to be on click action cuz depending on the choice of combobox 2 very different procedures will be called

• mkutyba: You can use ajax method to send variable value api.jquery.com/jQuery.ajax When do you want to send this value? I mean which event? On combo.change()? What do you want to do next with this value? Refresh page or display new content on current page?
• Nono: Are you thinking this on same page or different page? if you are with different page then use ajax and if you are second then also use ajax with same file name in ajax url option.
• mughees ilyas: @matty yes when combo box will change value i just want to do a comparison like if( $change===1) perfrom this function

Answer 1

You're gonna want to use AJAX and submit the form, then you can access the returned data without ever refreshing the page.

Basically:

HTML

<select name="combo" id="combo_1">
 <option value="2">Submative</option>
 <option value="1">formative</option>
</select>

JavaScript

$('#combo_1').change(function() {
 $.post('calcScript.php', $(this).serialize(), function(data) {
 alert(data);
 });
});

in PHP, you can access your combo data via $_POST['combo'].

• mughees ilyas: i have multiple comboboxes so i cannot use %_post i guess as it will require me to submit and all my comboboxes are interdependent
• casraf: The select box name can be an array: name="combo[0], name="combo[1]" and then they would be accessible in the same script via $_POST['combo'][0] etc. You can submit all the select boxes at once if they are in the same form element by serializing form itself when using $.post (like so: $('#myform').serialize())

Answer 2

<script type="text/javascript">
 $(document).ready(function() {
 $('#combo_1').change(function(){
 var combo_1 = $(this).val();
 $.ajax({
 type: 'GET',
 url: 'ajax.php',
 data: {'combo_1':combo_1},
 success: function(data){
 alert(data)
 }
 });
 });
 });
 </script>

---

ajax.php

---

 if( isset($_GET['combo_1]) ) {
 echo $change = $_GET['combo_1'];
 }

• mughees ilyas: i want to do it in a single file without sumbiting or refreshing
• Goutam Pal: @stacy m alina change ajax.php page to your page index.php
• mughees ilyas: its not working as i am passing it to same page and its not refreshing so i dont know where to put isset code as its not working if i put it in start of file

Answer 3

JS:

$.ajax({
 type: "POST",
url: './filename.php',
 beforeSend: function(){
 //If you want to do something 
},
data: 'data='$('#combo_1').val(), //Optional '&data2='+value+'&datan='+value,
 success: function(msg){
 alert(msg);
 }
});

PHP:

$val = $_POST['data'];
return 'received successfully';

This will alert 'received successfully'