Question

Noob here trying to do something simple with Jquery. Basically I have a small select-option dropdown like this:

<select onchange="javascript:swapContent('con3');">
    <option>selection 1</option>
    <option>selection 2</option>
    <option>selection 3</option>
</select>

Currently it is posted via ajax to a $php variable here:

$contentVar = $_POST['contentVar'];

javascript function is here:

<script language="JavaScript" type="text/javascript">
function swapContent(cv) {
    $("#myDiv").html('<img src="loader.gif"/>').show();
    var url = "myphpscript.php";
    $.post(url, {contentVar: cv} ,function(data) {
        $("#myDiv").html(data).show();
    });    
}
</script>

How can I instead post the value of the select-option dropdown?

I realize this is basic, but I have to start somewhere and cannot find a tutorial that shows me how to do what I need. Thank you for your help.

Answer 1

How can I instead post the value of the select-option dropdown?

If you want to send values yo tour script you should start by giving values to your option elements (and an id to your <select> element to be able to use it and retrieve the selected value):

<select onchange="javascript:swapContent('con3');" id="myselect">
    <option value="value1">selection 1</option>
    <option value="value2">selection 2</option>
    <option value="value3">selection 3</option>
</select>

and then:

// get the currently selected value from the dropdown
var value = $('#myselect').val();
$.post(url, { contentVar: cv, selectedValue: value }, function(data) {
    $("#myDiv").html(data).show();
});

If on the other hand you wanted to send the text of the selected option you could use this:

// get the currently selected value from the dropdown
var text = $('#myselect option:selected').text();
$.post(url, { contentVar: cv, selectedText: text }, function(data) {
    $("#myDiv").html(data).show();
});

Now inside your PHP script you could fetch the value:

$_POST['selectedValue']