Siga-nos em...
Follow us on Twitter Follow us on Facebook Watch us on YouTube
Registro


Alpha Servers
Resultados 1 a 9 de 9
  1. #1

    Avatar de SpinXO
    Data de Ingresso
    Apr 2015
    Localização
    localhost
    Posts
    118
    Agradecido
    60
    Agradeceu
    29
    Peso da Avaliação
    4

    Padrão Duas funções em um único arquivo

    Olá, boa tarde, primeiramente não sou muito bom com JavaScript, porém preciso usar, estou criando um site onde contém duas páginas apenas, tenho um menu com link normal e outro com um dropdown, estou tentando abrir páginas via ajax (já que o mesmo, só vai servir pra exemplo de um documento), só que quando tento adicionar as requisições de páginas no menu dropdown me retorna error 404 (do WampServer), o mesmo quando eu dou return false para os dois códigos, bom vou postar o código aqui quem puder me ajudar...

    Poderia fazer com PHP via $_GET, mas preferi me aventurar no ajax.

    Código:
    $(function() {
        $("#loading").hide();
    
    //link normal
        $("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;
        });
    });
    
    //link com dropdown
    $(function() {
        $("#loading").hide();
    
        $("ul.nav ul a").click(function() {
            page = "template/pages/"+$(this).attr('href')
    
            $("#loading").ajaxStart(function() {
                $(this).show();
            });
    
            $("#loading").ajaxStop(function() {
                $(this).hide();
            });
    
            $("#main").load(page)
            return false;
        });
    });
    Vou tentar explicar o que eu quero, quero que funcione tanto para menu normal, quanto para com dropdown, só que se um pega o outro não pega...

    Quem manja teste esses códigos e me ajuda por favor?....

  2. #2



    Avatar de Renato
    Data de Ingresso
    Nov 2010
    Localização
    Imperyus
    Posts
    1.249
    Agradecido
    2002
    Agradeceu
    533
    Peso da Avaliação
    30

    Padrão

    $("ul.nav ul a").click(function() {

    $(".dropdown").click(function() {
    Código PHP:
    <?php
        
    if(Weather::getState() == 'Rainy weather') {
            
    $this->removingLittleHorseFromRain();
        }

  3. #3

    Avatar de SpinXO
    Data de Ingresso
    Apr 2015
    Localização
    localhost
    Posts
    118
    Agradecido
    60
    Agradeceu
    29
    Peso da Avaliação
    4

    Padrão

    Renato, fiz desta forma, porém o dropdown ainda continua sem pegar, veja:

    Código:
    $(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;
        });
    
        $("ul.nav .dropdown a").click(function() {
            page = "template/pages/"+$(this).attr('href')
    
            $("#loading").ajaxStart(function() {
                $(this).show();
            });
    
            $("#loading").ajaxStop(function() {
                $(this).hide();
            });
    
            $("#main").load(page)
            return false;
        });
    });
    O que me retorna ao clicar no ícone do dropdown:


    Acho que o return false; está bugando o código não deixando o script continuar, já tentei trocar pra return true, já tirei os returns o script roda porém redireciona para página 404 not found.
    Última edição por SpinXO; 13-02-2016 às 05:05 PM.

  4. #4



    Avatar de Renato
    Data de Ingresso
    Nov 2010
    Localização
    Imperyus
    Posts
    1.249
    Agradecido
    2002
    Agradeceu
    533
    Peso da Avaliação
    30

    Padrão

    Cara posta o HTML aqui.
    Código PHP:
    <?php
        
    if(Weather::getState() == 'Rainy weather') {
            
    $this->removingLittleHorseFromRain();
        }

  5. #5

    Avatar de SpinXO
    Data de Ingresso
    Apr 2015
    Localização
    localhost
    Posts
    118
    Agradecido
    60
    Agradeceu
    29
    Peso da Avaliação
    4

    Padrão

    Opa...

    Código HTML:
    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Título</title>
    
        <link href="template/assets/css/bootstrap.min.css" rel="stylesheet">
        <link href="template/assets/css/custom.css" rel="stylesheet">
    
        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->
      </head>
      <body>
      	<nav class="navbar navbar-inverse navbar-fixed-top">
    		  <div class="container">
    		    <div class="navbar-header">
    		      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1" aria-expanded="false">
    		        <span class="sr-only">Toggle navigation</span>
    		        <span class="icon-bar"></span>
    		        <span class="icon-bar"></span>
    		        <span class="icon-bar"></span>
    		      </button>
    		      <a class="navbar-brand" href="#">Título</a>
    		    </div>
    
    		    <div class="collapse navbar-collapse" id="navbar-collapse-1">
    		      <ul class="nav navbar-nav navbar-right">
    		      	<li>
    		      		<a href="novo-ticket.php">sadfasdf</a>
    		      	</li>
    		        <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>
    		    </div>
    		  </div>
    		</nav>
    
    		<section id="main" class="section-main">
    			<img src="template/assets/images/icons/load.gif" id="loading">
    			<?php
    			include("./template/pages/meus-tickets.php");
    			?>
    		</section>
    
    		<footer class="footer">
    	      <div class="container">
    	        <p class="text-muted">Título &copy; 2016</p>
    	      </div>
    	    </footer>
        <script src="template/assets/js/jquery.min.js"></script>
        <script src="template/assets/js/bootstrap.min.js"></script>
        <script src="template/assets/js/ajax.js"></script>
      </body>
    </html>
    Se quiser eu posto os arquivos completos...é só uma demo mesmo que estou fazendo
    Última edição por SpinXO; 13-02-2016 às 06:40 PM.

  6. #6



    Avatar de Renato
    Data de Ingresso
    Nov 2010
    Localização
    Imperyus
    Posts
    1.249
    Agradecido
    2002
    Agradeceu
    533
    Peso da Avaliação
    30

    Padrão

    index.html

    Código HTML:
    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Título</title>
    
        <link href="template/assets/css/bootstrap.min.css" rel="stylesheet">
        <link href="template/assets/css/custom.css" rel="stylesheet">
    
        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->
      </head>
      <body>
      	<nav class="navbar navbar-inverse navbar-fixed-top">
    		  <div class="container">
    		    <div class="navbar-header">
    		      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1" aria-expanded="false">
    		        <span class="sr-only">Toggle navigation</span>
    		        <span class="icon-bar"></span>
    		        <span class="icon-bar"></span>
    		        <span class="icon-bar"></span>
    		      </button>
    		      <a class="navbar-brand" href="#">Título</a>
    		    </div>
    
    		    <div class="collapse navbar-collapse" id="navbar-collapse-1">
    		      <ul class="nav navbar-nav navbar-right">
    		      	<li>
    		      		<a href="javascript: void(0);" url="menu01.html">Menu 01</a>
    		      	</li>
    		        <li class="dropdown">
    		          <a href="javascript: void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
    		          	Menu 02
    		          </a>
    		          <ul class="dropdown-menu">
    		            <li><a href="javascript: void(0);" url="conteudo1.html">Conteudo 01</a></li>
    		            <li><a href="javascript: void(0);" url="conteudo2.html">Conteudo 02</a></li>
    		          </ul>
    		        </li>
    		      </ul>
    		    </div>
    		  </div>
    		</nav>
    
    		<section id="main" class="section-main">
    			<img src="http://preloaders.net/preloaders/728/Skype%20balls%20loader.gif" id="loading">
    		</section>
    
    		<footer class="footer">
    	      <div class="container">
    	        <p class="text-muted">Título &copy; 2016</p>
    	      </div>
    	    </footer>
    		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
    		<script>
    		$(function() {
    			$("#loading").hide();
    			$('a').click(function() {
    				var page = $(this).attr('url');
    				
    				$("#loading").ajaxStart(function() {
    					$(this).show();
    				});
    
    				$("#loading").ajaxStop(function() {
    					$(this).hide();
    				});
    
    				$("#main").load(page)
    				return false;
    			});
    		});
    		</script>
      </body>
    </html>
    menu01.html

    Código HTML:
    Menu01 Conteudo

    conteudo1.html

    Código HTML:
    Conteudo 01
    conteudo2.html

    Código HTML:
    Conteudo 02

    Acho que era isso que você queria. Enfim...

    []'s
    Última edição por Renato; 13-02-2016 às 08:31 PM.
    Código PHP:
    <?php
        
    if(Weather::getState() == 'Rainy weather') {
            
    $this->removingLittleHorseFromRain();
        }

  7. #7

    Avatar de SpinXO
    Data de Ingresso
    Apr 2015
    Localização
    localhost
    Posts
    118
    Agradecido
    60
    Agradeceu
    29
    Peso da Avaliação
    4

    Padrão

    Beleza, cheguei em casa vou testar.
    Edito o tópico assim que terminar o teste.

    Edit...
    @Renato, o dropdown agora não funciona, mas vc já me deu meio caminho andado vou tentar resolver qualquer coisa eu posto aqui.

    aaaH!!! o url= pode ser trocado?

    Fiz alguns ajustes no código, como passar o caminho completo da pasta das minhas pages...

    Aí quando eu clico pra abrir o dropdown aparece isso no console

    GET [Somente usuários registrados podem vem os links. ] 404 (Not Found)

    Edit..... de novo

    Solved, resolvi o problema do dropdown:

    Código PHP:
    if ($(this).attr('href') == "#") return true
    Última edição por SpinXO; 13-02-2016 às 09:30 PM.

  8. #8



    Avatar de Renato
    Data de Ingresso
    Nov 2010
    Localização
    Imperyus
    Posts
    1.249
    Agradecido
    2002
    Agradeceu
    533
    Peso da Avaliação
    30

    Padrão

    Achei que seu problema era com o ajax. Dropdown vc faz com HTML e CSS, não precisa meter js no meio, ainda mais usando bootstrap.

    <div class="dropdown">
    <a href="javascript:void(0);" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Dropdown Menu
    <span class="caret"></span></a>
    <ul class="dropdown-menu">
    <li><a href="javascript:void(0);">Menu 01</a></li>
    <li><a href="javascript:void(0);">Menu 02</a></li>
    <li><a href="javascript:void(0);">Menu 03</a></li>
    </ul>
    </div>
    Código PHP:
    <?php
        
    if(Weather::getState() == 'Rainy weather') {
            
    $this->removingLittleHorseFromRain();
        }

  9. O Seguinte Usuário Agradeceu Renato Por este Post Útil:


  10. #9

    Avatar de SpinXO
    Data de Ingresso
    Apr 2015
    Localização
    localhost
    Posts
    118
    Agradecido
    60
    Agradeceu
    29
    Peso da Avaliação
    4

    Padrão

    Relaxa já tá solved obrigado

 

 

Informações de Tópico

Usuários Navegando neste Tópico

Há 1 usuários navegando neste tópico. (0 registrados e 1 visitantes)

Tópicos Similares

  1. |Dúvida| espadas nas duas mãos ou espada+shild
    Por broly no fórum Dúvidas
    Respostas: 3
    Último Post: 26-02-2012, 01:33 PM
  2. |Avaliação| Minhas duas primeiras entradas
    Por Adriano_Ferreira no fórum Avaliações
    Respostas: 11
    Último Post: 08-03-2011, 04:53 PM
  3. Respostas: 0
    Último Post: 08-12-2010, 02:28 PM

Marcadores

Permissões de Postagem

  • Você não pode iniciar novos tópicos
  • Você não pode enviar respostas
  • Você não pode enviar anexos
  • Você não pode editar suas mensagens
  •