Ajax+fancybox
Pessoal estou fazendo uma busca quando o usuário digitar mostro o resultado em tempo real, porem no resultado tenho um botão para alterar os dados com fancybox e não esta abrindo e sim abre em uma nova aba, segue abaixo como estou fazendo se tiver alguem que pode dar uma força.
index.php
<link rel="stylesheet" href="js/fancy_box/jquery.fancybox.css" type="text/css">
<script src="js/fancy_box/jquery.fancybox.js"></script>
<script src="js/fancy_box/jquery.fancybox.trigger.js"></script>
<script src="js/busca.js"></script>
<script>
function pesquisa(valor)
{
//FUNÇÃO QUE MONTA A URL E CHAMA A FUNÇÃO AJAX
url="busca_nome.php?valor="+valor;
ajax(url);
}
</script>
<input type="text" name="nome" id="txt_busca" onKeyPress="pesquisa(this.value)">
<ul id="slider"></ul>
busca_nome.php
<div class="slide">
<?php
if(!empty($_GET["valor"]))
{
//faz a consulta ao banco esta parte esta me trazendo todos o resultado da busca
echo "<li><a href='?ID=XXX' class='zoom'>alterar</a></li> ";
}
?>
</div>
busca.js
// JavaScript Document
// FUNÇÃO RESPONSÁVEL DE CONECTAR A UMA PAGINA EXTERNA NO NOSSO CASO A BUSCA_NOME.PHP
// E RETORNAR OS RESULTADOS
function ajax(url)
{
//alert(nick);
//alert(dest);
//alert(msg);
req = null;
// Procura por um objeto nativo (Mozilla/Safari)
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send(null);
// Procura por uma versão ActiveX (IE)
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send();
}
}
}
function processReqChange()
{
// apenas quando o estado for "completado"
if (req.readyState == 4) {
// apenas se o servidor retornar "OK"
if (req.status ==200) {
// procura pela div id="pagina" e insere o conteudo
// retornado nela, como texto HTML
document.getElementById("slider").innerHTML = req.responseText;
} else {
alert("Houve um problema ao obter os dados:n" + req.statusText);
}
}
}
jquery.fancybox.trigger.js
$(document).ready(function() {
$("a.zoom").attr('rel', 'top').fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 300,
'autoDimensions' : true,
'overlayShow' : true,
'overlayOpacity' : 0.7,
'overlayColor' : '#000'
});
});Discussão (13)
Carregando comentários...