how to retrieve data from database without refreshing page using ajax

Question

i having a drop down box, it have two client(ex:client a,client b),i have more then 2000 data in each client table ,when selecting client i want to retrieve all data from database and show it in front end with out refreshing,now i am refresh window.location this refresh the page.can any one help me how to do that thanks

Ajax

<script>
$(function() {    document.ready
    $("#client").on("change", function() {
        var ID=$(this).attr('id');
        var clientid=$("#client").val();
        $.ajax({

            type: "POST",
            data: {
                clientselect: $(this).val()
            },
            success: function(data) {
                $("#display").html(data);
                window.location = '?action=clientnetworkpricelist&clientid='+clientid+'';
                $("#flash").hide();
            }
        });
    });
});

</script>

Select Box

 <select name="client" id="client" style="margin:-24px 0 0 1px;background-color:#E8E8E8;width:104px;position: absolute;"> 
   <option value="">Select Client</option>
<?php

$sql=mysql_query("select * from client_list");

$clientid=$_GET['clientid'];



while($row=mysql_fetch_assoc($sql))

{


    if(strlen($_GET['clientid'])>0 && $_GET['clientid']==$row['clientid']){
    print' <option id="client" name="client" value="'.$row['clientid'].'" selected>'.$row['clientid'].' </option>';}

    else{

            print' <option id="client" name="client" value="'.$row['clientid'].'" >'.$row['clientid'].' </option>';
    }

   }



   ?>


</select>

Solution

$.ajax({
                    async: false,
                    cache: false,
                    url: "your_web_address?action=clientnetworkpricelist&clientid="+clientid,
                    scriptCharset: "utf-8",
                    dataType: "html",
                    success: function (data) {
                        $("#display").html(data);
                        $("#flash").hide();
                    },
                    error: function (request, ajaxOptions, thrownError) {

                    }
                });

change url to:

url: "http://www.yourpage.com/your_subpage?action=clientnetworkpricelist&clientid="+clientid

Comments

[Xavi]

thanks for my reply can you please see my updated ajax code it shows error ReferenceError: invalid assignment left-hand side ...//xxxxxxx.com+ "?action=clientnetworkpricelist&clientid='+clientid+'""

[Xavi]

thanks for your answer but it showing error <b>Warning</b>: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in <b>/data/data/www/fms/docs/clientnetworkpricelist/yourfile.p‌​hp</b> on line <b>11</b><br />

[Xavi]

thanks but now its like this GET webpage.com/… its not takeing the selected client id also its repeating twice

[Muhammad Rizwan Kaim Khani]

I think you are doing same mistake, remove your window.location and use my given code, make another file which takes your client data on behalf of your client id, and then echo it on your desired position.

[Muhammad Rizwan Kaim Khani]

Supplied argument is not valid mean you are giving something wrong in query where clause that is why it do not get any result and showing warning. you should debug your code.

[Lucky Lefty]

whats repeating twice? try alert(clientid); to see what do you have inside clientid var