簡體   English   中英

單擊鏈接后插入一個值以配置Ajax功能

[英]Inserting a value to configure Ajax function upon clicking a link

我正在嘗試設置一個進行Ajax調用的函數,但是我必須承認,設置onclick事件時我無法理解正在發生的事情。 我正在嘗試進行Ajax調用,以從數據庫獲取字段並將其顯示給用戶。 這個想法是,用戶在輸入字段中鍵入一個姓氏,然后根據他們單擊的鏈接,我嘗試構建的功能將查詢結果顯示到數據庫中。 我在Ajax函數調用的腳本上使用PHP中的switch語句處理查詢,但無法在Javascript代碼上設置處理此行為的變量。

我有這樣的Javascript代碼:

var ajaxRequest = ajaxFunction();
function ajaxFunction(){
var ajaxRequest;  // The variable that makes Ajax possible!

try{
    // Opera 8.0+, Firefox, Safari
    ajaxRequest = new XMLHttpRequest();
} catch (e){
    // Internet Explorer Browsers
    try{
        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try{
            ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e){
            // Something went wrong
            alert("Your browser broke!");
            return false;
        }
    }
} return ajaxRequest;
} 

function process() {
id="default";
profesional = document.getElementById('profesional');
dotal = document.getElementById('dot'); 
proyecta = document.getElementById('proy');
proyecta_A = document.getElementById('proy_af');
gastosM = document.getElementById('gastos_med');
autos = document.getElementById('aut');
polifam = document.getElementById('polif');

profesional.onclick=function() {
id="prof";
return id;  
}
dotal.onclick=function() {
id="dotal";
return id;  
}
proyecta.onclick=function() {
id="proyecta";  
return id;
}
proyecta_A.onclick=function() {
id="proyAf";
return id;  
}
gastosM.onclick=function() {
id="gastos_medicos";
return id;  
}
autos.onclick=function() {
id="autos"; 
return id;
}
polifam.onclick=function() {
id="polifam";
return id;  
}   
if(ajaxRequest.readyState==4 || ajaxRequest.readyState==0) {apellido =     encodeURIComponent(document.getElementById('query').value)
if (apellido != undefined) {
ajaxRequest.open("GET", 'adminsrc.php?buscarregistro=' +apellido +'&id='+id, true)
ajaxRequest.send("");   
ajaxRequest.onreadystatechange=handleServerResponse;
}
}
else setTimeout('process()',1000);
}

function handleServerResponse(){
{
if (ajaxRequest.readyState==4) {

if(ajaxRequest.status==200) {   
respuesta=ajaxRequest.responseXML;
respuestadoc = respuesta.documentElement;
if (apellido != undefined) {
ident = respuesta.getElementsByTagName('identidad')[0];
result = ident.firstChild;
refrescar = respuesta.getElementsByTagName('identidad')[1];
actualizar = refrescar.firstChild;
if(result!=undefined) {
resultado = result.data;
document.getElementById('profesreg').setAttribute('value', resultado);
document.getElementById('dotalreg').setAttribute('value', resultado);
document.getElementById('gmmreg').setAttribute('value', resultado);
document.getElementById('proyectareg').setAttribute('value', resultado);
document.getElementById('proyecta2reg').setAttribute('value', resultado);
document.getElementById('autosreg').setAttribute('value', resultado);
document.getElementById('polifreg').setAttribute('value', resultado);
}
if(actualizar!=undefined) {
actualiza = actualizar.data;
document.getElementById('actual_1').setAttribute('value', actualiza);
document.getElementById('actual_2').setAttribute('value', actualiza);
document.getElementById('actual_3').setAttribute('value', actualiza);
document.getElementById('actual_4').setAttribute('value', actualiza);
document.getElementById('actual_5').setAttribute('value', actualiza);
document.getElementById('actual_6').setAttribute('value', actualiza);
document.getElementById('actual_7').setAttribute('value', actualiza);
}
msje = respuestadoc.firstChild.childNodes[0]; 
if (msje !=undefined) {
mess = msje.data;
document.getElementById("res").innerHTML = "<h4>"+ mess +"</h4>";
} 
     }
    setTimeout('process()',1000);
    }
    else alert ('hubo un problema al conectarse con el servidor: ' +    ajaxRequest.statusText);
}
}
} 

//-->

最后一部分只是在表單中設置隱藏字段的值,以便PHP識別這些值(它們被設置為更新數據庫中的某些字段)。 但我必須說,我非常喜歡javascript(我從不擅長於此)。 有什么建議嗎?

@Mate xml文件的構建方式如下:

<identificacion>
<response>
Se encontró al asegurado con nombre Mara Fernanda Bravo Palomino, número de póliza        27608165, la cual vence el 2003-04-05 y cuyos beneficiarios contratados son Ana Camila Lpez       Bravo
</response>
<identidad>Bravo Palomino</identidad>
<identidad>si</identidad>
</identificacion>

一次(幾周前),我已經使用了如下功能:

 function process() {
    if(ajaxRequest.readyState==4 || ajaxRequest.readyState==0) {apellido =        encodeURIComponent(document.getElementById('query').value)
    if (apellido != undefined) {
    ajaxRequest.open("GET", 'adminsrc.php?buscarregistro=' +apellido, true)
    ajaxRequest.send("");   
    ajaxRequest.onreadystatechange=handleServerResponse;
    }
    }
    else setTimeout('process()',1000);
    }

和上面的handleServerResponse函數; 但是如您所見,我只能通過復雜的迭代從xml中提取文本節點。 當然,有一種更簡單的方法。

1)下載jQuery庫並鏈接到正確的路徑!

2)我對html和xml響應有點盲目,但我認為您可以解決。

        <script src="jquery-1.8.2.min.js" type="text/javascript"></script>
        <script type="text/javascript">

            function AjaxCall(id) {

                //Obtengo el appelido.
                var apellido = $('#query').val();

                //Armo la url con el querystring
                var urlPhp = 'adminsrc.php?buscarregistro=' + apellido + '&id=' + id;

                $.ajax({
                    type: "GET",
                    url: urlPhp,
                    contentType: "charset=utf-8",
                    dataType: "xml",
                    success: function (xml) {
                        successProcess(xml);
                    },
                    error: function (msg) {
                        alert("error");
                    }
                });
            }

            //Proceso el xml si estuvo Ok.
            function successProcess(xml) {
                //Revisar bien el XML devuelto

                var identidades = $(xml).find("identidad");

                result = identidades[0];
                refresh = identidades[1];
                message = $(xml).find('mensaje');

                SetResult(result);
                SetActualizar(refresh);
                SetMsj(message);

            }

            //Seteo el resultado en los valores de los controles.
            function SetResult(resultado) {

                if (result != undefined) {
                    $('#profesreg').val(resultado);
                    $('#dotalreg').val(resultado);
                    $('#gmmreg').val(resultado);
                    $('#proyectareg').val(resultado);
                    $('#proyecta2reg').val(resultado);
                    $('#autosreg').val(resultado);
                    $('#polifreg').val(resultado);
                }
            }

            //Seteo los dato actualizados
            function SetActualizar(actualiza) {
                if (actualiza != undefined) {
                    $('#actual_1').val(actualiza);
                    $('#actual_2').val(actualiza);
                    $('#actual_3').val(actualiza);
                    $('#actual_4').val(actualiza);
                    $('#actual_5').val(actualiza);
                    $('#actual_6').val(actualiza);
                    $('#actual_7').val(actualiza);
                }
            }

            //Muestro el mensaje
            function SetMsj(msje) {

                if (msje != undefined) {
                    $('#res').html("<h4>" + msje + "</h4>");
                }
            }


            //Este evento se dispara cuando carga el documento.
            $(document).ready(function () {

                $('#profesional').click(function () { AjaxCall('prof') });
                $('#dot').click(function () { AjaxCall('dotal') });
                $('#proy').click(function () { AjaxCall('proyecta') });
                $('#proy_af').click(function () { AjaxCall('proyAf') });
                $('#gastos_med').click(function () { AjaxCall('gastos_medicos') });
                $('#aut').click(function () { AjaxCall('autos') });
                $('#polif').click(function () { AjaxCall('polifam') });

            });


        </script>
    </head>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM