1

Olá comunidade Stack Over Flow, estou tentando incluir páginas via ajax, porém quando clico para abrir o dropdown ele é ignorado e adiciona a página de Index of do WampServer, como proceder nesses casos?

Aqui vou colocar uma imagem e o código JavaScript:

$(function() {
    $("#loading").hide();

    $("ul.nav a").click(function() {
        page = "template/pages/"+$(this).attr('href')

        $("#loading").ajaxStart(function() {
            $(this).show();
        });

        $("#loading").ajaxStop(function() {
            $(this).hide();
        });

        $("#main").load(page)
        return false;
    });
});

Principal: conteúdo :

<section id="main" class="section-main">
    <img src="template/assets/images/icons/load.gif" id="loading">
    <?php
    include("./template/pages/meus-tickets.php");
    ?>
</section>

Menu:

<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
    <i class="glyphicon glyphicon-user"></i> <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
    <li><a href="#"><i class="glyphicon glyphicon-edit"></i> Editar perfil</a></li>
    <li><a href="novo-ticket.php"><i class="glyphicon glyphicon-open"></i> Submeter um ticket</a></li>
    <li role="separator" class="divider"></li>
    <li><a href="#"><i class="glyphicon glyphicon-log-out"></i> Sair</a></li>
  </ul>
</li>
</ul>

inserir a descrição da imagem aqui

Obs: Eu gostaria que os links sem dropdown e com dropdown continuassem à funcionar, aguardo respostas. []'s

2
  • Adicione o HTML também, por favor
    – Berriel
    Commented 13/02/2016 às 12:10
  • Adicionado ao tópico principal. Commented 13/02/2016 às 12:14

1 Resposta 1

1

Se eu entendi o objetivo, você pode ignorar aqueles elementos cuja URL destino é igual a #:

$(function() {
    $("#loading").hide();

    $("ul.dropdown-menu a").click(function() {

        // ignora href="#"            
        if ($(this).attr('href') == "#") return false; 

        page = "template/pages/"+$(this).attr('href')

        $("#loading").ajaxStart(function() {
            $(this).show();
        });

        $("#loading").ajaxStop(function() {
            $(this).hide();
        });

        $("#main").load(page)
        return false;
    });
});
6
  • Muito obrigado, mas não é isso que eu quero :/, eu quero que o ajax inclua os links sem dropdown e com dropdown, pois da forma que estou fazendo está travando o dropdown Commented 13/02/2016 às 12:38
  • Você quer que somente execute a função quando os link dentro de dropdown-menu forem clicados? Pode ser mais específico, pois não está claro o que você chama de 'link sem dropdown' e 'link com dropdown'
    – Berriel
    Commented 13/02/2016 às 12:44
  • Eu quero que todos os links funcionem, se eu mudo de $("ul.nav a").click(function() { para $("ul.nav ul a").click(function() { o código para de funcionar... Commented 13/02/2016 às 12:48
  • Altere para ul.dropdown-menu a, como fiz no código...
    – Berriel
    Commented 13/02/2016 às 12:49
  • funcionou obrigado Commented 13/02/2016 às 12:52

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .