RICO学习,innerhtml

原创 2006年06月10日 20:32:00
         prototype大家都知道了,是一个优秀的js库,rico也不例外,两者绑定使用效果更强大,具体两者之间的关系,我没有太关注,现在将RICO的innerhtml例子贴出来大家学习,后端使用jsp技术,当然使用asp,php亦可。
inner.html
         <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
        "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<link href="css/rico.css" media="all" rel="Stylesheet" type="text/css" />
<link href="css/openrico.css" media="all" rel="Stylesheet" type="text/css" />
<link href="css/rico_header.css" media="all" rel="Stylesheet" type="text/css" />
<link href="css/ricoTests.css" media="all" rel="Stylesheet" type="text/css" />
    <head>
        <title>lnner numberOne</title>
        <script src="script/prototype.js"></script>
        <script src="script/rico.js"></script>
    </head>
    <body>

<br>

   <div class="accordionTabContentBox">         
   </div>
  
   <div id="rolodexTabContent" class="accordionTabContentBox">
        <table cellspacing="5" cellpadding="5">
            <tr>
                <td valign="top">
                    <select id="listBox" size="10" onchange="getPersonInfo(this)" style="font-family:arial;font-size:11px;display:inline;border:1px solid red">
                        <option value="aa">
                            aa
                        </option>
                        <option value="bb">
                            bb
                        </option>
                        <option value="cc">
                            cc
                        </option>
                    </select>
                </td>
                     
                <td>
                    <div class="accordionTabContentBox">         
                       </div>
                    <div class="accordionTabContentBox" id="personInfo">
                        Select a name to the left to see the AJAX rolodex entry for the selected person.
                    </div>
                </td>
               
            </tr>
        </table>
</div>
        <script>
            ajaxEngine.registerRequest('getPersonInfo','getPerson.jsp');
            ajaxEngine.registerAjaxElement('personInfo');
            function getPersonInfo(selectBox){
                var firstName = selectBox.value;
                ajaxEngine.sendRequest('getPersonInfo',
                                       "firstName=" + firstName);
            }
    </script>
    </body>
</html>

getPerson.jsp

<%@ page language="java" import="java.util.*" contentType="text/xml; charset=ISO-8859-1"%>

<%String firstName = request.getParameter("firstName");
        %>

<ajax-response>
<response type="element" id="personInfo">
<div class="person">
    <span class="personName"><%=firstName%></span><span class="personAddress">1743 1st Avenue Boston,Boston 71204-2345</span><span class="personOccupation">Executive Vice President</span>
    <span calss="personPhoneNuember">
    Phone #: (972) 555-0293</span><span class="personMobile">Mobile #: (972) 555-0295</span><span class="personNotes">Notes: Spouse playes tennis at the country club with John.</span>
</div>
</response>
</ajax-response>

inner.html 中select标签的onChange动作调用getPersonInfo方法,该方法发送请求到已经注册到RICO提供的引擎种的getPerson.jsp,用于调用服务端JSP页面,出现显示效果,当然innerhtml效果是因为jsp中的
<ajax-response>标签,大家慢慢看吧,我要开始热身了,英格兰 VS  巴拉圭,哈哈...
       对了还要下载rico和  prototype库,和相应的一些CSS文件,css文件只是为了美化布局和美观,可以取掉!
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/yq76034150/article/details/787025

rico实现ajax应用的例子(1)

使用rico实现ajax应用的例子(1)    关于ajax是什么已经有很多方面的介绍了。本着拿来主义的原则,选择了rico这个纯js解决方案后端配合karrigell来实现一些ajax应用。  ri...
  • shankaipingo
  • shankaipingo
  • 2006-08-17 17:06:00
  • 1260

CF 547 C Mike and Foam(容斥原理)

C. Mike and Foam time limit per test 2 seconds memory limit per test 256 megabytes ...
  • u011699990
  • u011699990
  • 2015-05-28 01:36:46
  • 1135

Mike and Foam - CodeForces #547 C 容斥原理

Mike and Foam time limit per test 2 seconds memory limit per test 256 megabytes inp...
  • u014733623
  • u014733623
  • 2015-05-27 22:36:17
  • 809

innerHtml用法精解

  • 2009年02月25日 12:53
  • 32KB
  • 下载

java异常集

算术异常类:ArithmeticExecption   空指针异常类:NullPointerException   类型强制转换异常:ClassCastException ...
  • lang_niu
  • lang_niu
  • 2016-11-22 20:38:45
  • 205

rico.js

  • 2008年05月09日 11:30
  • 88KB
  • 下载

Codeforces 548E Mike and Foam (容斥+莫比乌斯反演)

Codeforces 548E Mike and Foam (容斥+莫比乌斯反演)
  • Tc_To_Top
  • Tc_To_Top
  • 2015-08-24 14:10:52
  • 952

TI AM437X开发板 Rico Board --米尔科技

RicoBoard是米尔科技推出的一款以TI AM437X系列处理器为核心的嵌入式开发板,即AM437X开发板,该板Pin toPin兼容AM4379/AM4378/AM4377/AM4376(默认为...
  • u011837423
  • u011837423
  • 2015-02-11 11:17:58
  • 925

【ARM-Linux开发】Rico Board DIY系列实验教程 Day 2——搭建Boa服务器

一:BOA WebServer简介        BOA WebServer是一款单任务的HTTP服务器,与其他网页服务器不同之处,是当有连接请求到来是,它既不是为每个连接都单独创建进程,也不是采用...
  • LG1259156776
  • LG1259156776
  • 2017-01-11 20:36:13
  • 637

codeforces 548 E. Mike and Foam (莫比乌斯反演)

E. Mike and Foam time limit per test 2 seconds memory limit per test 256 megabytes ...
  • whai362
  • whai362
  • 2015-12-09 21:28:46
  • 509
收藏助手
不良信息举报
您举报文章:RICO学习,innerhtml
举报原因:
原因补充:

(最多只允许输入30个字)