Question

I’m using codeigniter for this project. I have a search form and search form results.

Now when I click search in search form I’m being redirected to search form result and I get results.

Is it possible to create div or table in search form which is hidden at first then call the search procedure and which results it returns to get them back in the page without reloading it?

Using jquery/ajax/php ? Thank you

Answer 1

I assume your search result view contains just a block of HTML for the search results (like a TABLE or somesuch, not a full HTML page with BODY)? If not update the view so it just contains the code for the results. Then you can just use the $.post method to submit the form get the view and then inject it into a DIV (or element of your choice):

$(document).ready(function() {
    $('#myformid').submit(function() {
        var seralizedForm = $(this).serialize();
        var url = $(this).attr('action');
        $.post(url, serializedForm, function(results) {
            $('#resultsDiv').html(results);
        }, "html");
        return false;
    });
});

This should plug into your code with minimal modification. Change the “myformid” to an ID you set on the form tag, and change “resultsDiv” to the ID of an empty DIV you want the results to go into.

What this is going to do is bind this function to be called when the form is submitted (either by pressing enter or clicking a submit button). It will serialize the form (so you can send the values of the inputs to your controller) and get the URL to submit to by the normal “action” attribute that forms have.

It will then submit the form to that URL via a post, and the results will be loaded into a DIV with the ID of resultsDiv.