javascript - populate div with data onchange with ajax(price filter) -
i creating price filter using ajax php, jquery , mysql, when price changed, want div populated new data. index.php
<script type='text/javascript'> $(document).ready(function() { // initializing slider $( "#slider" ).slider({ range: true, min: 20000, max: 80000, values: [ 22000, 25000 ], slide: function( event, ui ) { // values var min = ui.values[0]; var max = ui.values[1]; $('#range').text(min+' - ' + max); // ajax request $.ajax({ url: 'getdata.php', type: 'post', data: {min:min,max:max}, success: function(response) { // updating div data $('#parent').remove(); $('#parent').append(response); } }); } }); }); </script> </head> <body > <div class="container" > <!-- slider --> <div id="slider"></div><br/> range: <span id='range'></span> <?php mysql_select_db($db); $query = 'select * rentals order category asc'; $result = mysql_query($query); while($row = mysql_fetch_assoc($result)) { ?> <div id="parent"> <div id="divimg"> <img src="img/<?php echo $row["image"];?>" alt="room image" style="width:128px;height:128px;"> </div> <div id="detailsdiv"> <?php echo "category: " . $row["category"]; ?><br><br> <?php echo "amount: " . $row["amount"]; ?><br><br> <?php echo "location: " . $row["location"]; ?><br><br> <?php echo "no of rooms: " . $row["room"]; ?><br><br> <?php echo "no of bathroom: " . $row["bathroom"];?><br><br> <?php } ?> </div> </div>
and page fetches data when slider value changed
<?php include 'connection.php'; $min = $_post['min']; $max = $_post['max']; mysql_select_db($db); $query = 'select * rentals amount>='.$min.' , amount<='.$max; $result = mysql_query($query); $html = ''; while( $row=mysql_fetch_array($result) ) { $category = $row['category']; $location = $row['location']; $amount = $row['amount']; $image = $row['image']; $html .='#detailsdiv'.$category; $html .='#detailsdiv'.$location; $html .='#detailsdiv'.$amount; $html .='#detailsdiv'.$image; } echo $html;
when slider value changed, data not reflected in div
Comments
Post a Comment