Create jquery navigation menu load method

Question

I’m having a hard time creating a menu where pages are loaded into a div.

What happens is that I’m creating an application following the MVC standard, and I do the treatments of the Urls to redirect them, to each controller, I don’t know what happens when it loads the page it doesn’t specifically open in div where I predefined.

Code jQuery:

jQuery(function () {
    jQuery('.ler').click(function () {
        jQuery('#open').load('corpo.php', function (e) {
            e.preventDefault();
        });
    });
})

HTML code:

<ul class="nav navbar-nav side-nav">
    <li class="active"><a href="<?php URL?>dashboard"><i class="fa fa-dashboard"></i> Dashboard</a></li>
    <li><a href="javascript:void(0)" class="ler"><i class="fa fa-bar-chart-o"></i> Categorias</a></li>
    <li><a href="<?php URL?>noticia" class="ler"><i class="fa fa-table"></i> Noticias</a></li>
    <li><a href="<?php URL?>galeria" class="ler"><i class="fa fa-edit"></i> Galeria</a></li>
    <li><a href="<?php URL?>comentarios" class="ler"><i class="fa fa-font"></i> Comentarios</a></li>
    <li><a href="<?php URL?>informacoes" class="ler"><i class="fa fa-font"></i> Informacoes</a></li>
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-caret-square-o-down"></i> Menu <b class="caret"></b></a>
        <ul class="dropdown-menu">
            <li><a href="#">Enviar Email</a></li>
            <li><a href="#">Gerir Usuarios</a></li>
        </ul>
    </li>
</ul>

And the div where the pages will be loaded:

<!-- /#navegacao -->
<div id="open"></div>
<!-- /#navegacao //Fim -->

Answer 1

After reading and searching here on the forum, I found a solution

Function abreURL(url,method,where){ if(metodo=='POST'){ // metodo post $. post(url, Function(date) { // loader page (loading) $("#charger"). show(); $( "#"+where). load(url); }); } Else if(method=='GET'){ // metodo get $. get(url, Function(date) { // loader page (loading) $("#charger"). show(); $( "#"+where). load(url); }); } }

And No html and only call function in onclick method()

views/category/index.php','GET','content');" href="#" >

Answer 2

Most likely you are having the problem you described by the fact that you have invoked a method of event through a response argument, which is always a string.

See working in the Fiddle

The argument Event must be set in an event handler. In your case, a click event, so it is argument from the first callback.

The second callback is the server response, which is a string (test with typeof), hence, the method Event.preventDefault() there is no.

In fact, when using jQuery.load(), informing a callback is almost always useful only during development, only to have access to the XHR object and suddenly extract it from the HTTP Response Code (200, 301, 404...) and the meaning of it (OK, Moved, Not Found...).