tags:

views:

78

answers:

3

I am trying to use jQuery with MYSQL and I wrote something like this :

<html>

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"&gt;&lt;/script&gt;
<script>
function example_ajax_request() {
  $('#example-placeholder').html('<p>Loading results ... <img src="ajax-loader.gif"  /></p>');
  $('#example-placeholder').load("loadres.php");
}
</script>
</head>
<body>
<div id="query">
<select name="show"  id="box" >

 <option value="0">Select A Test</option>
 <option value="All">--All--</option>
 <option value="M1">Model1</option>
    </select>
<input type="button" onclick="example_ajax_request()" value="Click Me!" />
</div>
<div id="example-placeholder">
  <p>Placeholding text</p>
</div></body>
</html>

Basically I want to pass parameters to the loadres.php file. But unable to figure out the exact way to do. Any help is appreciated.

Thanks.

A: 
$('#example-placeholder').load("loadres.php?show=" + $('#box option:selected').val());

This will use jquery to get the selected value from the drop down list and append it to the URL as a querystring parameter, which you can access in the loadres.php page.

Tom Tresansky
This sample seems to work than others, but the issue I am facing now is if I try to pass parameters using `+`, when I try to capture it in the results page, I am not getting the `+` sign. Any idea why it is getting stripped off?Ex : `loadres.php?show=one+two+three`
JPro
You need to understand URL character encoding.Take a look at this: http://www.permadi.com/tutorial/urlEncoding/
Tom Tresansky
+3  A: 

You should use the $.ajax() method from jQuery. you can pass data to the url and have a callback at the end.

$.ajax({
  url: 'loader.php',
  data: 'somedata',
  type: 'GET',
  success: function(data){
    $('#example-placeholder').text(data);
  }
});

This will do the trick. This method also provides far more flexibility. You can have different functions such as error functions and complete functions.

Saif Bechan
danpickett
Thank you for pointing that out.
Saif Bechan
A: 

similar to saif-bechan's post you can use ajax with post and data can hold an object to pass multiple parameters

    $.ajax({
        type:"POST",
        url: loadres.php,
        data: {
              foo:'bar',
              selected:$('#selector').val()
        },
        dataType: 'json',
        error: function(data) {
                   //error code here
        },
        success: function(data) {
                      //success code here
        }
    });

I will also note that is is better to put your click event in jquery context not in the html

so in script somewhere use

 $('#button_id').click(function(){
       //call to ajax
 };
mcgrailm