Jquery, Tabs, CI Forms, and page refreshs....

[eluser]the1rob[/eluser]
Ok, I've been poking around for the last two days on the CI and Jquery sites looking for a solution.

I'm using Jquery Tabs with my CI app. I'm using the "hijack links" functionality inside of the tabs, so that clicked links will load inside the tabs properly. So far so good.

When clicking around the app, normal links work fine. As soon as I click a link that has a form in it, there's a full page refresh to the form view.

I'm not quite sure where the error is: jquery with the link hijacking, or CI with refreshing the page.

Here's the jquery Tabs code...

Code:

[removed]
    $(function() {
        $("#tabs").tabs({
        load: function(event,ui) {
        $('a',ui.panel).click(function() {
        $(ui.panel).load(this.href);
        return false;
        });
        }
        });
        
    });
     [removed]

...and here's the tab generation.

Code:

<div id="tabs">
    <ul>
        
        <li><a href="#Home">Home</a></li>
        <li><a href="/index.php/members/blah"><span>blah</span></a></li>
        <li><a href="/index.php/members/blah2" title="blah2"><span>blah2</span></a></li>
        <li><a href="/index.php/members/blah3"><span>blah3</span></a></li>
        <li><a href="/index.php/members/blah4"><span>blah4</span></a></li>
        <li><a href="/index.php/members/blah5"><span>blah5</span></a></li>
        
    </ul>
    <div id="Home">
Home Div

</div>
</div>

You can see where I've been screwing around with the code.

Here's the edit link that page refreshes; this is the whole View file.

Code:

<div id="blah2">
&lt;?php echo validation_errors(); ?&gt;

&lt;?php echo form_open('members/editblah/' . $this->uri->segment(3)); ?&gt;


*snip*...lots of &lt;input type&gt; here...*snip*



&lt;input type='submit' value='Submit'&gt;

&lt;/form&gt;
</div>

And now finally the controller function...

Code:

function editblah()
        {
            
            
            $this->load->library('form_validation');
            $this->form_validation->set_rules('frmfriendlyname', 'Friendly Name', 'trim|required');

            
            
        if ($this->form_validation->run() == FALSE)
                {
                    
                    
                    $this->load->view('/members/editblah', $data);
                }
            else
                {
                

                    $this->load->view('/members/editblahsuccess');
                
                    
                }        
        
        
        }

Is there a smack-my-forehead reason why it does a page refresh, as opposed to loading into the <div>? All the other pages load into the divs/tabs fine; only the form page fails.

Any help appreciated!




The1Rob

[eluser]bretticus[/eluser]
It's most likely the jquery plugin IMHO. BUT...you could use firebug to determine whether CI returns a 301/302 redirect to confirm.

EDIT: actually, a redirect would reset your page. Definitely NOT CI.

EDIT AGAIN: Sorry, I guess it wouldn't since the whole transaction is handled by ajax, but you should still be able to tell from my first suggestion.