JSON + AJAX + STRUTS2 +渲染JSON在HTMLAJAX、JSON、HTML

2023-09-10 14:54:50 作者:正在输入……

我有一个叫AJAX:

JAVASCRIPT 的

 <脚本类型=文/ JavaScript的>
        $ .subscribe('cellselect',函数(事件数据){
            VAR电池= event.originalEvent.cellcontent;
            $阿贾克斯({
                键入:GET,
                网址:codcli.action cliente.codcli =+细胞,
                数据类型:JSON,
                成功:函数(结果){
                    如果(结果= NULL和放大器;!&安培; result.length> 0){
                        $ .publish('名');
                        $ .publish('邮件');
                    }
                },
                错误:函数(XHR,和errmsg){警报(没有找到值.. !!);}
            });
        });
    < / SCRIPT>
 

操作的

 <作用NAME =codcli级=intranet.ConsultarAlumno方法=CargarDatos>
        <结果类型=json的>
            < PARAM NAME =根>
                cliente
            < /参数>
        < /结果>
    < /作用>
 

这回下一个JSON字符串

JSON结果与萤火虫(OBJECTcliente)的

{"apemat":null,"apepat":null,"cicact":"01","clientedociden":null,"clienteemail":[{"emacli":"fabiolas_abada@unsm.pe"},{"emacli":"fabiolas_loved_11_44@hotmail.com"}],"clientesemestre":null,"clientetelefono":{"contel":0,"escuela":null,"facultad":null,"fechorusucre":null,"fechorusumod":null,"ideusucre":null,"ideusumod":null,"numtel":" 075 225476 975345737","tipotelefono":null},"codant":null,"codcli":"2012534852","codgraaca":null,"codpai":null,"codusu":null,"deuacumor":null,"deuacupen":null,"dirdom":"CALLE JIRON UNION 1274-LA VIRGEN","escuela":{"$c$csc":"02","desesc":"DERECHO","desescban":null,"desescres":null,"facultad":null,"fechorusucre":null,"fechorusumod":null,"ideusucre":null,"ideusumod":null,"nomdiresc":null,"proproesc":0,"staesc":null,"tipogrado":null},"estcar":null,"estciv":null,"exaadm":null,"facultad":{"codfac":"06","desfac":"DERECHO","desfacres":null,"dirfac":null,"fechorusucre":null,"fechorusumod":null,"ideusucre":null,"ideusumod":null,"nomrep":null,"proprofac":0,"stafac":null,"tipperaca":null,"ubigeo":null},"fechorusucre":null,"fechorusumod":null,"fecnac":null,"ideusucre":null,"ideusumod":null,"moding":null,"modtit":null,"nom":"FABIOLA MARIA,提名委员会:ABADA MUYAGA","numcreacu":null,"numcuracu":null,"numresing":null,"propongen":null,"semegr":null,"semestre":"2","seming":"20131","sex":null,"stacli":null,"tipcli":null,"turmat":"M","ubigeo":{"codpos":null,"codubigeo":null,"depubigeo":"LA LIBERTAD,特鲁希略,LA VIRGEN","disubigeo":null,"proubigeo":null},"ubigeo2":null,"ultsemact":null,"ultsemmat":null,"valvar":"19\/08\/2013","year":"2013"} JSON Struts2和Ajax联合使用

JSP 的

 < P>此处命名为< / P>
< D​​IV ID =名与GT; AtributteNOM< / DIV>

&其中p为H.;这里的电子邮件1所述的列表; / P>
< D​​IV ID =电子邮件> Atributteclienteemail< / DIV>
 

问题的

什么是工作的JSON字符串来显示HMTL页面上的属性NOM(名称)和clienteemail的最佳途径JSON字符串(邮件列表)?

解决方案

喜欢这个?

  ....

成功:函数(cliente){
    如果(结果= NULL和放大器;!&安培; result.length> 0){
        $(#名)。html的(cliente.nom);
        $(#邮件)HTML()。
        对于(VAR I = 0; I< cliente.clienteemail.length;我++){
            $(#邮件)追加(< BR />中+ cliente.clienteemail [I] .emacli);
        }
    }
},

....
 

I have a call ajax:

JAVASCRIPT

    <script type="text/javascript">
        $.subscribe('cellselect', function(event, data) {
            var cell = event.originalEvent.cellcontent; 
            $.ajax({
                type : "GET",
                url  : "codcli.action?cliente.codcli="+cell,
                dataType : 'json',
                success : function(result){
                    if (result != null && result.length > 0){
                        $.publish('name');
                        $.publish('emails');
                    }
                },
                error : function(xhr, errmsg) {alert("No values found..!!");}
            });
        });
    </script>

ACTION

    <action name="codcli" class="intranet.ConsultarAlumno" method="CargarDatos">
        <result type="json">
            <param name="root">
                cliente
            </param>
        </result>
    </action>

That return the next String JSON

JSON RESULT WITH FIREBUG (OBJECT "cliente")

{"apemat":null,"apepat":null,"cicact":"01","clientedociden":null,"clienteemail":[{"emacli":"fabiolas_abada@unsm.pe"},{"emacli":"fabiolas_loved_11_44@hotmail.com"}],"clientesemestre":null,"clientetelefono":{"contel":0,"escuela":null,"facultad":null,"fechorusucre":null,"fechorusumod":null,"ideusucre":null,"ideusumod":null,"numtel":"   075 225476   975345737","tipotelefono":null},"codant":null,"codcli":"2012534852","codgraaca":null,"codpai":null,"codusu":null,"deuacumor":null,"deuacupen":null,"dirdom":"CALLE JIRON UNION 1274-LA VIRGEN","escuela":{"codesc":"02","desesc":"DERECHO","desescban":null,"desescres":null,"facultad":null,"fechorusucre":null,"fechorusumod":null,"ideusucre":null,"ideusumod":null,"nomdiresc":null,"proproesc":0,"staesc":null,"tipogrado":null},"estcar":null,"estciv":null,"exaadm":null,"facultad":{"codfac":"06","desfac":"DERECHO","desfacres":null,"dirfac":null,"fechorusucre":null,"fechorusumod":null,"ideusucre":null,"ideusumod":null,"nomrep":null,"proprofac":0,"stafac":null,"tipperaca":null,"ubigeo":null},"fechorusucre":null,"fechorusumod":null,"fecnac":null,"ideusucre":null,"ideusumod":null,"moding":null,"modtit":null,"nom":"FABIOLA  MARIA","nomcom":"ABADA MUYAGA","numcreacu":null,"numcuracu":null,"numresing":null,"propongen":null,"semegr":null,"semestre":"2","seming":"20131","sex":null,"stacli":null,"tipcli":null,"turmat":"M","ubigeo":{"codpos":null,"codubigeo":null,"depubigeo":"LA LIBERTAD, TRUJILLO, LA VIRGEN","disubigeo":null,"proubigeo":null},"ubigeo2":null,"ultsemact":null,"ultsemmat":null,"valvar":"19\/08\/2013","year":"2013"}

JSP

<p>Here The name</p>
<div id="name"> Atributte "nom" </div>

<p>Here The list of emails</p>
<div id="emails"> Atributte "clienteemail" </div>

QUESTION

What is the best way to work the JSON string to display on the HMTL page the attributes "nom"(name) and "clienteemail"(list of emails) of the JSON String?

解决方案

Like this ?

....

success : function(cliente){
    if (result != null && result.length > 0){
        $("#name"  ).html(cliente.nom);
        $("#emails").html("");
        for (var i=0; i < cliente.clienteemail.length; i++) {
            $("#emails").append("<br/>" + cliente.clienteemail[i].emacli);
        }
    }
},

....