单击链接后插入一个值以配置Ajax功能

Question

I'm trying to set a function that makes an Ajax call, but I must confess I can't understand what's happening when I set the onclick event. I'm trying to make an Ajax call to get fields from a database and display them to the user. The idea is that the users type a Last Name in an input field, and then, depending on the link they click on, the function I'm trying to build displays the results of a query to the database. I handle the query with a switch statement in PHP on the script that the Ajax function calls, but I can't set the variable that handles this behavior on the Javascript code.

I've got the Javascript code like this:

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);
}
}
} 

//-->

Where the last part is just to set the value of hidden fields in the form so that PHP recognizes those values (they are set to update some fields in the database). But I must say I'm pretty stuck with the javascript (I've never been good at it). Any suggestions, please?

@Mate The xml file is built like so:

<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>

And once (a few weeks ago) I already had it working with a function like so:

 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);
    }

and the function handleServerResponse above; but as you can see I can only extract the text nodes from the xml with that complicated iteration. Surely there's an easier way.

Answer 1

1) Download jQuery Library and link to te correct path !!

2) I'm a bit blind with html and xml response, but I think you can solve well.

        <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>