Refining Post-search Results (PHP -AJAX)

Asked

Viewed 98 times

-2

I would like to know how to make a vertical menu with a form for updating data without refreshing and without having to press Ubmit. Just click on the option you want to change.
Like if I did a search and the results appeared, and next to these results have a vertical menu, with the options available.
ex:
Results of icarros,
After changing the initial or final year or year, located in the side menu, it changes the search data without refresh.
How to make that side menu? Help!

php ajax menu
  • 1

    Post what you’ve tried to do.

  • Give us a starting point.

1 answer

1

First download the jQuery library at the link https://jquery.com/download/ and make the inclusion of this file in the head of your site ex:

<head>
   <script type="text/javascript" src="path/seu arquivo.js"></script>
</head>

Create an empty file with extension . js ex: search.js to put the code that will execute AJAX.

HTML:

<select name="filter" id="filter">
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
</select>

Create a method in a php class in case you are using a framework, search and return the data in JSON format. If you are using a site with structured code create a file for example filter.php.

In the search.js file you can use the change event that runs after the user selects the filter ex:

$(function(){
    $('#filter').change(function(){
        var $filtro = $(this);
        $.ajax({
        url: 'filtro.php',
      type: 'get',
      data:{
        ano: $filtro.val()
      },
      success: function(response){
         alert(response); // retorno do php
      },
      error: function(xhr){
        alert(xhr.responseText);
      }
     });
   });
});

following this orientation in the php file, you should capitulate the request to make the query as follows:

$filtro = $_REQUEST['ano']; ou $_GET['ano'];

Browser other questions tagged php ajax menu

You are not signed in. Login or sign up in order to post.