jQuery Ajax replaces the div by whole .php page -


i'm using jquery ajax function populating select box. here code:

    $(function(){                      $("#maker").change(function(){                     var selected_value = $("#maker").val();                $.ajax({             type: "post",             url: "search.php",             data: ({_maker: selected_value}),             success: function(response){                 $("#models").html(response);             }         });                 });     }); 

the problem replaces div "models" whole search.php page!!! want populate option values within "models".

here html:

<div id="models"> <select id="model" name="model" style="width:170px"> <option value="any">any</option> <?php     foreach($current_models $model) { ?>     <option value="<?php echo $model; ?>"><?php echo $model; ?></option>  <?php     } ?> </select></div> 

any appreciated. in advance.

so looks you're returning entire html page, , not searching through find specific part of page. try this:

$(function(){                  $("#maker").change(function(){                 var selected_value = $("#maker").val();                $.ajax({             type: "post",             datatype: "html",             url: "search.php",             data: ({_maker: selected_value}),             success: function(response){                 $("#models").html($(response).find('#somediv').html());             }             error: function(){                   $("#models").html('uh oh! went wrong , weren't able process request correctly.');             }         });             }); }); 

you'll notice 2 things:

  1. i specified datatype property. tell jquery expect. additionally html data type, tells jquery execute javascript on loaded page before rendering page response object.

  2. i'm creating jquery object using response, , using jquery's .find() method inner html of specific div in response.

here example js fiddle, slight modifications proof of concept: http://jsfiddle.net/rvk44/1/

i wanted note may want add error property if page ever comes error, user knows , isn't sitting there staring @ blank screen expecting happen. (i've added basic error message in example, see jquery docs further info on error property returned).


Comments

Popular posts from this blog

php - Calling a template part from a post -

Firefox SVG shape not printing when it has stroke -

How to mention the localhost in android -