• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
JQuery and Ajax Issue

#1
[eluser]Bendude[/eluser]
I have a strange problem that I am unable to track down. I am using Codeigniter and Jquery to create an ajax search feature.

Everything is working well and the correct data is been returned from my model but when I load the view from the controller it has the header of the page in the response.

I have tried an empty view to load and still the header of the page is included.

My javascript function is like so

Code:
function filter(id)
        {
            var series = {}; //init array

            data['id'] = id;

            var url = "/baseurl/controller/methodName";


            $('#result').load( url, data, function(){} );

        }


Then from within my controller after i have retrieved the results from the model I simply load the view

$this->load->view("results", $data);

Any help or tips to point me in the right direction would be much appreciated.

below is the response:
Code:
</head>
<body>
        <div id="container">
        <div id="wrapper">

                <div id="header">

                </div>
                &lt;!-- end header --&gt;                     &lt;!-- Menu --&gt;
                <div id="menu">
                        <ul>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">About Us</a></li>
                                <li><a href="#">Testimonials</a></li>
                                <li class="last"><a href="#">Links</a></li>
                        </ul>

                        <div id="sub-menu">
                                <ul>
                                        <li><a href="#">Profile</a></li>
                                        <li class="last"><a href="#">Privacy</a></li>
                                </ul>
                        </div>

                </div>
                &lt;!-- End Menu --&gt;


Test Ajax

as shown above the result is the text i have echoed from my controller function and the extra content shown above it. It is the rest of the page above the div I am trying to update

Kind Regards
Ben

#2
[eluser]Bendude[/eluser]
No worries i fixed it.

Thanks to anyone who had read the thread.

Looking forward to spending sometime on here...

Ben

#3
[eluser]Isern Palaus[/eluser]
Hello Bendude,

Welcome to CI forums!

You could tell us how you solved, this can be useful in the future Big Grin!

Thank you,
Isern

#4
[eluser]Bendude[/eluser]
The problem was simple, to make things simple at first I was loading the header and menu views in my parent constructor. Which were then been loaded when i made the ajax call.

To get around it I made this function in a helper

Code:
function is_ajax()
{
    return isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
}

I then simply checked if it was an ajax request or not before loading the header and menu views.

The function was not mine, somebody else posted that on another forum.

Thanks
Ben

#5
[eluser]alboyd[/eluser]
I use JQuery and Ajax a LOT (well recently anyway) and I create views for most ajax requests. The views simply contain the structure to show the returned data and I load the returned data into an existing div on the full page from which the ajax request was made.

Not sure if this is a way to remedy what you are talking about - as I am not 100% sure I understand what your problem was.. But taking a guess..

#6
[eluser]Bendude[/eluser]
My problem was when I was calling methods from a parent controller its views were been loaded again as they were called in its constructor, I used the is_ajax() method to check if it was an ajax call to fix the issue.

I did run into a similar issue last night, $_SERVER['HTTP_X_REQUESTED_WITH'] is only set by the javascript libraries so to use is_ajax() with your own Ajax code you should set the request header manually like so.

xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");

Hope this helps someone

#7
[eluser]alboyd[/eluser]
ooh is that a good way of doing things? Why would you call views from a controller's constructor?

#8
[eluser]Bendude[/eluser]
Well it was the header and menu of the site, which every page needed so at the time it seemed convenient. How do you load views when you want them for all base controllers?

#9
[eluser]alboyd[/eluser]
Either use a "view_loader"...
Code:
$this->view_data['content_view_name'] = 'some_view_name';

$this->load->view('view_loader', $this->view_data);

"view_loader":
Code:
$this->load->view('header');
$this->load->view('menu');
$this->load->view($content_view_name);
$this->load->view('footer');

Or more often these days I've been creating a "main_view" and passing in the variable
content as additional views:

"main_view"
Code:
ALL YOUR HEADER, MENU ETC CODE....

<div id="content">
&lt;?php $this->load->view($content_view_name); ?&gt;
</div>

YOUR FOOTER CODE....

This way when making AJAX requests from within this page you can simply:
Code:
$.post(base_url + "controller/controller_function", { post_val : post_val },
                  function(data) {
                    //.... stuff here with data values...
            $("div#content").html(data.content).fadeIn("slow");
                }, "json");

The "content" of data.content would be a view which only contains the formatted data you want to put into the div - no header, footer etc etc

Works for me...

#10
[eluser]Bendude[/eluser]
Hmm interesting way of doing things, I never knew about the view_loader as I am new to CI, will look it up though.

I didn't think loading views from within a view was best practice? Do many CI users do this?


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2020 MyBB Group.