Jump to content
MarKteus

Como carregar uma página externa dentro da div de outra página

Recommended Posts

Estou tentando carregar uma pagina simples só pra teste dentro de uma div em outra pagina, assim:

 

           $('.botaoCarregar').click(function () {
               $('#divContainer').load("pageTeste.html");
          });

 

Mas nada acontece, alias acontece erro 404 not found (mas a pagina está la)
Estou usando nodejs para subir o server e testando em localhost

Alguém sabe o que pode ser ?

Share this post


Link to post
Share on other sites

o teu node não deve estar servindo esse html.

como ele está?

Share this post


Link to post
Share on other sites

Está assim:
MenusFiltros.html está funcionando perfeitamente e sendo aberto no browser, ele contem o botão para ser clicado e exibir a page PassosOperacionais.html (representado pelo pageTeste.html do post anterior).
Mandei o print para você ver que os dois arquivos se encontram na mesma pasta.

e já tentei como  no post anterior e das maneiras a seguir também
 $('#divContainer').load("./views/pageTeste.html")

 $('#divContainer').load("/views/pageTeste.html")
 $('#divContainer').load("http://localhost:5000/views/pageTeste.html")  

 

MenuFilt.png

Share this post


Link to post
Share on other sites

você consegue acessar pelo browser:

http://localhost:5000/pageTeste.html

 

?

 

caso continue com problemas, poste o código do NodeJS.

Share this post


Link to post
Share on other sites

Não consegui acessar pelo browser print 1

Só conseguir acessar pelo comando View in Browser do VsCode print 2
 

1.png

2.png

Share this post


Link to post
Share on other sites

não.. sem a pasta views, só:

 

:5000/pageTeste.html

Share this post


Link to post
Share on other sites

você tem um middleware de estáticos?

 

então poste o projeto NodeJS para vermos o que está faltando.

 

Share this post


Link to post
Share on other sites

Segue rar do projeto

Na linha abaixo (869) deveria ser carregado o conteudo da pagina PassosOperacionais.html após clique no botão via javascript

anexo a classe botaoPassoOperacionais linha 774

   

        <div id="sctPassosOperacionais"></div>
  
 

nodeProject.rar

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By proflupin
      Estou com a seguinte dificuldade, possuo um <a> que busca uma id numa tabela do banco de dados, conforme abaixo:
       
      <a href="self_service.php?id=<?php echo $row_produto['id_categoria_chamado']?>" class="btn btn-primary"data-toggle="collapse" data-target="#subcategoria" aria-expanded="false" aria-controls="collapseExample">Visitar</a> A consulta é realizada, pois vejo que um novo link é mostrado no rodapé da página:

       
      Esta página self_service.php mostrada acima, é minha página principal, onde tudo é trabalhado. Se por exemplo eu mudar para outro arquivo php, teste.php por exemplo, uma nova página é aberta e consigo exibir os resultados normalmente.
       
      O problema é: quero abrir este ID na mesma página, dentro de um collapse. Exemplo:
       
      Cliquei em visitar na categoria Totvs...
       
       
      Um collapse abre-se logo abaixo:

       
      O que não consigo fazer é resgatar o ID passado pelo botão VISITAR em meu collapse, se eu tenter o $_GET['id'], não vai retornar nenhum valor, pois a URL não muda quando trabalhamos com collapse.
    • By lamorim1904
      Caros, boa tarde!
       
      Primeiramente me desculpem se estou abrindo tópico repetido ou de maneira errada, procurei aqui no fórum mas talvez a forma que estou procurando ou a minha falta de conhecimento sobre a área não está me permitindo encontrar a solução.
      Não entendo quase NADA de programação e estou realizando um projeto que me cobra um pouco neste sentido, vou tentar explicar:
       
      Estou criando um hotspot inteligente onde o próprio cliente se cadastra, ele preenche um formulário e posterior a isso eu libero a conexão dele.
      O meu problema está depois que ele cria o seu cadastro, as informações vão para meu banco de dados mas nao retornam ao cliente, portanto a conexão não é liberada.
       
      Eu encontrei uma solução mas não estou conseguindo usa-la da maneira que gostaria, após usuário se cadastrar, eu direciono ele para a pagina de login e senha e caso ele digite os dados que ele acabou de preencher, a conexão é liberada. 
       
      Eu gostaria de automatizar esse processo, identificar a variavel X que eu usei para escrever no meu banco de dados e inseri-la no campo de usuario e senha e se possivel submeter a informação para o usuario nem ver essa tela de login e senha. Sabem me dizer se tem como?
       
      Para ficar mais claro, vou postar os codigos;
       
      <NESTE PONTO O CLIENTE JA PREENCHEU O CADASTRO E EU USO AS VARIAVEIS PARA ESCREVER NO MEU BANCO DE DADOS>
      <EU GOSTARIA DE USAR A VARIAVEL $MOBILE COMO USUARIO E SENHA NA PARTE DE JAVA ABAIXO>

      $sql = "INSERT INTO radcheck (UserName, Attribute, op, Value) VALUES ";
      $sql .= "('$MOBILE', 'Cleartext-Password', ':=', '$MOBILE')";
      mysqli_query($strcon,$sql) or die("Erro ao tentar cadastrar registro");

      $sql = "INSERT INTO radreply (UserName, Attribute, op, Value) VALUES ";
      $sql .= "('$MOBILE', 'Mikrotik-Rate-Limit', ':=', '512k/1024k')";
      mysqli_query($strcon,$sql) or die("Erro ao tentar cadastrar registro");
      mysqli_close($strcon);
      echo "Cliente cadastrado com sucesso!";
      ?>
      <html>
      <head><title>...</title></head>
      <body>
      $(if chap-id)
      <noscript>
      <center><b>JavaScript required. Enable JavaScript to continue.</b></center>
      </noscript>
      $(endif)
      <center>If you are not redirected in a few seconds, click 'continue' below<br>
      <form name="redirect" action="http://201.82.110.3/mkloginteste2.php" method="post">
      <input type="hidden" name="mac" value="$(mac)">
      <input type="hidden" name="ip" value="$(ip)">
      <input type="hidden" name="username" value="$MOBILE">
      <input type="hidden" name="link-login" value="$(link-login)">
      <input type="hidden" name="link-orig" value="$(link-orig)">
      <input type="hidden" name="error" value="$(error)">
      <input type="hidden" name="chap-id" value="$(chap-id)">
      <input type="hidden" name="chap-challenge" value="$(chap-challenge)">
      <input type="hidden" name="link-login-only" value="$(link-login-only)">
      <input type="hidden" name="link-orig-esc" value="$(link-orig-esc)">
      <input type="hidden" name="mac-esc" value="$(mac-esc)">
      <input type="submit" value="continue">
      </form>
      <script language="JavaScript">
      <!--
         document.redirect.submit();
      //-->
      </script></center>
      </body>
      </html>
    • By yuseirender
      Olá, sou novo aqui e preciso de ajuda, criei uma index aqui e localmente fica tudo certo, porem quando vou tentar normalmente em outro pc fica alguns itens fora de foco
       
      local:

      teste:

       
      codigo fonte:
       
    • By malaho
      Olá amigos, estou desenvolvendo um site, e uma das páginas possuem um índice de palavras.
      Queria que, ao clicar em uma palavra, o significado da mesma aparece se na mesma página, abaixo, dentro de uma célula de tabela. 
      Já pesquisei e não encontrei nada sobre. Desde já agradeço a ajuda.
    • By Webster Moitinho
      Estou usando switch em minha página PHP, e para um dos cases está aparecendo o erro abaixo que eu não consigo identificar
       
      <Error><Code>BlobNotFound</Code><Message>The specified blob does not exist. RequestId:00c4ed11-e01e-0068-2b3a-575edd000000 Time:2019-08-20T09:33:50.2842035Z</Message></Error> Esse case chama o seguinte conteúdo do banco de dados:
      <p align="justify">Ao capacitar o seu <em>staff</em> de maneira satisfat&oacute;ria, a empresa assegura a qualidade do produto final ao cliente, influenciando de maneira significativa os resultados. Atrav&eacute;s da implanta&ccedil;&atilde;o de programas sistem&aacute;ticos de treinamento, pode-se proporcionar a melhoria do produto, al&eacute;m de serem dotados de forte apelo motivacional para a equipe, promovendo o desenvolvimento profissional espont&acirc;nea e naturalmente. &Eacute; comum nas corpora&ccedil;&otilde;es que o colaborador, ap&oacute;s algum tempo de capacita&ccedil;&atilde;o, busque melhores oportunidades no mercado, fazendo com que o empres&aacute;rio perca seu investimento. Todavia, n&atilde;o capacitar tamb&eacute;m tem o seu custo. E &eacute; bastante alto. Da&iacute; a import&acirc;ncia da forma&ccedil;&atilde;o continuada nas empresas, promovendo constantes atualiza&ccedil;&otilde;es e reciclagens dos profissionais.</p> <p align="justify"> <h4 style="text-align:left">Quanto custa n&atilde;o capacitar </h4> <ul style="margin-left: 5px;text-align:left; line-height: 35px; font-family: padrao;"> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Atendimento incompleto ou n&atilde;o compat&iacute;vel com a expectativa da empresa e do cliente.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Perda de neg&oacute;cios.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Insatisfa&ccedil;&atilde;o de clientes.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Redu&ccedil;&atilde;o do valor da marca.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;N&atilde;o cumprimento de metas.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Alto &iacute;ndice de <em>turnover</em>.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Insatisfa&ccedil;&atilde;o do funcion&aacute;rio.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Custos com retrabalho.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Sobrecarga de alguns funcion&aacute;rios (via de regra, aqueles melhores preparados).</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Redu&ccedil;&atilde;o da lucratividade.</li> <li style="font-size:12pt;" ><i class="fa fa-frown fa-fw" style="font-size:18pt; color: #FF0000;"></i> &nbsp;&nbsp;Redu&ccedil;&atilde;o de faturamento.</li> </ul> <h4 style="text-align:left">O que o mercado est&aacute; fazendo para melhorar na gest&atilde;o e formar seus profissionais?</h4> <p style="text-align:left">Segundo estudos realizados pelo <a href="http://www.vistage.com.br/grupos-vistage" title="V&aacute; para o site" target="_blank" class="zloko">Grupo Vistage Brasil</a>:</p> <ul style="margin-left: 5px;text-align:left; line-height: 35px; font-family: padrao;"> <li style="font-size:12pt;" ><i class="fa fa-user-graduate fa-fw" style="font-size:18pt; color: #009900;"></i> &nbsp;&nbsp;Apenas 14&#37; dos executivos brasileiros n&atilde;o tem problemas ao buscar profissionais qualificados.</li> <li style="font-size:12pt;" ><i class="fa fa-user-graduate fa-fw" style="font-size:18pt; color: #009900;"></i> &nbsp;&nbsp;H&aacute; falta de m&atilde;o de obra qualificada para todos os n&iacute;veis de fun&ccedil;&atilde;o.</li> <li style="font-size:12pt;" ><i class="fa fa-user-graduate fa-fw" style="font-size:18pt; color: #009900;"></i> &nbsp;&nbsp;As maiores demandas s&atilde;o para profissionais com forma&ccedil;&atilde;o superior para a &aacute;rea de atua&ccedil;&atilde;o da empresa (65%) e forma&ccedil;&atilde;o t&eacute;cnica (60%).</li> </ul> </p> <p align="justify">Uma pesquisa do Jornal Bom Dia Brasil mostrou onde est&aacute; o emprego nas m&eacute;dias e grandes empresas. S&atilde;o setores onde sobram vagas porque falta qualifica&ccedil;&atilde;o e &aacute;reas onde o curso t&eacute;cnico j&aacute; garante a contrata&ccedil;&atilde;o. O curso t&eacute;cnico &eacute; suficiente para abrir as portas de entrada no mercado de trabalho.<br /> Entre as ind&uacute;strias pesquisadas, 65% reclamam da falta de m&atilde;o de obra especializada. As m&eacute;dias e grandes empresas procuram operadores.</p> <p align="justify">Exatamente o caso dessa empresa de automa&ccedil;&atilde;o de port&otilde;es em Bras&iacute;lia. &ldquo;A gente perde com nossa produtividade. A gente n&atilde;o consegue inovar com frequencia porque as pessoas n&atilde;o conseguem acompanhar essa demanda&rdquo;, afirma a gerente de RH Clara Moreira. <p style="text-align:justify;">A sa&iacute;da das empresas tem sido treinar os empregados: 81% fizeram investimentos em cursos dentro da pr&oacute;pria empresa. O que tamb&eacute;m n&atilde;o &eacute; f&aacute;cil, porque a maioria chega despreparada.</p> <h4 style="text-align:left;">Áreas dos cursos Gopinatha</h4> <br /> <div style="float:left; width:100%;"> <img src="images/colmeia.png" id="map-image" style="width: 480px; max-width: 100%; height: auto;" alt="" usemap="#cursos" /> <map name="cursos"> <area href="detalhe.php?id=200&gr=desh" alt="Desenvolvimento Humano" title="Desenvolvimento Humano" shape="poly" coords="176, 351, 258, 300, 345, 345, 348, 448, 262, 498, 184, 442" style="outline:none;" target="_self" onmouseover="if(document.images) document.getElementById('map-image').src= 'images/cdes.png';" onmouseout="if(document.images) document.getElementById('map-image').src= 'images/colmeia.png';" /> <area href="detalhe.php?id=200&gr=info" alt="Informática" title="Informática" shape="poly" coords="431, 199, 517, 149, 599, 199, 598, 306, 514, 350, 431, 301" style="outline:none;" target="_self" onmouseover="if(document.images) document.getElementById('map-image').src= 'images/cinf.png';" onmouseout="if(document.images) document.getElementById('map-image').src= 'images/colmeia.png';" /> <area href="detalhe.php?id=200&gr=gestao" alt="Gestão Avançada" title="Gestão Avançada" shape="poly" coords="262, 197, 347, 150, 430, 200, 430, 300, 344, 345, 258, 300" style="outline:none;" target="_self" onmouseover="if(document.images) document.getElementById('map-image').src= 'images/cgest.png';" onmouseout="if(document.images) document.getElementById('map-image').src= 'images/colmeia.png';" /> <area href="detalhe.php?id=200&gr=contabil" alt="Contabilidade e Tributos" title="Contabilidade e Tributos" shape="poly" coords="90, 202, 178, 153, 262, 199, 260, 302, 177, 352, 92, 299" style="outline:none;" target="_self" onmouseover="if(document.images) document.getElementById('map-image').src= 'images/ccont.png';" onmouseout="if(document.images) document.getElementById('map-image').src= 'images/colmeia.png';" /> <area href="detalhe.php?id=200&gr=seguranca" alt="Segurança da Informação" title="Segurança da Informação" shape="poly" coords="345, 54, 428, 0, 515, 54, 516, 150, 430, 201, 345, 151" style="outline:none;" target="_self" onmouseover="if(document.images) document.getElementById('map-image').src= 'images/cseg.png';" onmouseout="if(document.images) document.getElementById('map-image').src= 'images/colmeia.png';" /> <area href="detalhe.php?id=201&gr=sistemas&ant=32" alt="Sistemas de Informação" title="Sistemas de Informação" shape="poly" coords="174, 49, 259, 1, 347, 56, 346, 152, 261, 199, 178, 153" style="outline:none;" target="_self" onmouseover="if(document.images) document.getElementById('map-image').src= 'images/csist.png';" onmouseout="if(document.images) document.getElementById('map-image').src= 'images/colmeia.png';" /> <area href="detalhe.php?id=200&gr=coaching" alt="Coaching" title="Coaching" shape="poly" coords="6, 49, 91, 2, 176, 50, 178, 153, 89, 202, 4, 146" style="outline:none;" target="_self" onmouseover="if(document.images) document.getElementById('map-image').src= 'images/ccoach.png';" onmouseout="if(document.images) document.getElementById('map-image').src= 'images/colmeia.png';" /> </map> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/image-map-resizer/1.0.10/js/imageMapResizer.js"></script> <script>$(document).ready(function(e){$("map").imageMapResize();});</script> </div>  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.