create.jsp页面的，body部分

<body onload="Page.init('${pageError}','${pageMessage}',${isSubmit},true)">
        <div id="title">${pageTitle}</div>
        <s:form id="MYFORM" action="%{pageAction}" method="post" theme="simple">
        <div id="content">
            <table>

       　　　　<!-- 仅仅是一个例子-->
                <tr>
                    <th width="13%">设备所有权类型:</th>
                    <td width="35%">
                        <s:select name="deviceInfo.owenerType"
                            id="ownerType"
                            list="owenerTypeList"
                            listKey="realValue"
                            listValue="displayValue"
                            headerKey=""
                            headerValue="请选择"/>
                    </td>
                </tr>

                <tr >
                    <td colspan="4" width="100%">&nbsp; </td>
                </tr>

                <tr >
                    <th width="13%">设备类型-模块信息</th>
                    <td id="modelpart" colspan="3" >

                    </td>
                </tr>
            </table>
        </div>
        <div id="operator">
            <div class="left"></div>
            <div class="middle" onclick="Page.submit()">提交</div>
            <div class="right"></div>
            <div class="left"></div>
            <div class="middle" onclick="Page.close()">关闭</div>
            <div class="right"></div>
        </div>
        </s:form>
    </body>

　　js-mootools框架-实现的功能：

　　根据下拉框选中的类型，生成复选框，放到<td id="modelpart" colspan="3" > </td>里面

head部分的 javascript，是mootools实现的

        <script type="text/javascript" >

             window.addEvent('domready', function(){

                 /**
                  * 对于选中下拉框进行ajax异步请求的操作
                  */

                  //这个是获取到 设备类型 隐藏域字段
                  $$("#content #ownerType").addEvent('change',function(event){

                     if($(this).value==""){
                         //清空元素
                         var td=$$("#content tr #modelpart");
                         td.set("html","")
                         return;
                     }else{

                        var jsonRequest = new Request.JSON({
                            url: 'deviceinfo!loadDeviceModelByType.jspa',
                            onSuccess: function(responseJSON, responseText){

                                    var td=$$("#content tr #modelpart");
                                    td.set("html",""); //清空子元素
                                       responseJSON.each(function(item,index){
                                           //生成checkbox
                                           var checkbox=new Element('input',{id:"checkbox"+index,type:"checkbox", "class":"checkbox" ,checked:"true"});

                                           //追加到 td中 //括号里面是当前元素
                                           var label=new Element("label",{"for":"checkbox"+index,text:item.displayValue+"  "});
                                           td.adopt(checkbox); //这才是追加元素的方式
                                           td.adopt(label);

                                       });

                                },
                            onFailure: function(xhr){
                                    alert(xhr);
                                }
                            }).post({'deviceType': '1'});

                     }

                  });

             });
        </script>

ops-web运维平台-create.jsp-mootools下拉框-复选框的更多相关文章

  1. （1）Linux常用的运维平台和工具

    运维工程师使用的运维平台和工具包括: Web服务器:apache.tomcat.nginx.lighttpd 监控:nagios.ganglia.cacti.zabbix 自动部署:ansible.s ...

  2. 用友iuap云运维平台支持基于K8s的微服务架构

    什么是微服务架构? 微服务(MicroServices)架构是当前互联网业界的一个技术热点,业内各公司也都纷纷开展微服务化体系建设.微服务架构的本质,是用一些功能比较明确.业务比较精练的服务去解决更大 ...

  3. （4）Linux常用的运维平台和工具

    运维工程师使用的运维平台和工具包括: Web服务器:apache.tomcat.nginx.lighttpd 监控:nagios.ganglia.cacti.zabbix 自动部署:ansible.s ...

  4. OMS自动化运维平台部署

    OMS自动化运维平台部署 一.基础环境安装 yum -y install mariadb mariadb-devel mariadb-server wget epel-release python-d ...

  5. 实战：阿里巴巴 DevOps 转型后的运维平台建设

    导读:阿里巴巴DevOps转型之后,运维平台是如何建设的?阿里巴巴高级技术专家陈喻结合运维自身的理解,业务场景的分析和业界方法论的一些思考,得出来一些最佳实践分享给大家.   前言   “我是这个应用 ...

  6. 阿里巴巴 DevOps 转型后的运维平台建设

    原文:http://www.sohu.com/a/156724220_262549 本文转载自公众号「DevOps 时代」,高效运维社区致力于陪伴您的职业生涯,与您一起愉快的成长. 作者简介: 陈喻( ...

  7. devops 运维平台相关知识

    1.https://choerodon.io/zh/community/ (代码 https://github.com/choerodon/choerodon) 猪齿鱼 2.https://www.o ...

  8. 【I·M·U_Ops】------Ⅰ------ IMU自动化运维平台设想

    说明本脚本仅作为学习使用,请勿用于任何商业用途.本文为原创,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接和本声明. #A 搞这个平台的初心 由于之前呆的单位所有IT相关硬件资源都要我们 ...

  9. Web前端之复选框选中属性

    熟悉web前端开发的人都知道,判断复选框是否选中是经常做的事情,判断的方法很多,但是开发过程中常常忽略了这些方法的兼容性,而是实现效果就好 了.博主之前用户不少方法,经常Google到一些这个不好那个 ...

随机推荐

  1. noip普及组2007 奖学金

    奖学金 描述 某小学最近得到了一笔赞助,打算拿出其中一部分为学习成绩优秀的前5名学生发奖学金.期末,每个学生都有3门课的成绩:语文.数学.英语.先按总分从高到低排序,如果两个同学总分相同,再按语文成绩 ...

  2. 【Linux】查看系统信息

    查看发行版本 [root@centos68 ~]# more /etc/issue CentOS release 6.9 (Final) RedHat 系 [root@centos68 ~]# cat ...

  3. asp.net mvc 动态编译生成Controller

    做网站后台管理系统的时候,有时我们需要根据用户的录入配置动态生成一些频道,这些频道需要用到独立的Controller,这时就需要用到运行时动态编译了.代码如下: using System.Web.Mv ...

  4. Android 开发者，如何提升自己的职场竞争力？

    前言 该文章是笔者参加 Android 巴士线下交流会成都站 的手写讲稿虚拟场景,所以大家将就看一下. 开始 大家好,我是刘世麟,首先感谢安卓巴士为我们创造了这次奇妙的相遇.现场的氛围也让我十分激动. ...

  5. Thinkphp报错 -- “_STORAGE_WRITE_ERROR_”

    磁盘满了 没有写入权限 解决方法:   chmod -R 777 Runtime目录路径

  6. CSS三种样式表

    1.外部样式表当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观.每个页面使用 <link> 标签链接到样式表. & ...

  7. Sublime Text3 最常用快捷键

    软件快捷键再多,平时常用的也就那么几个,先总结如下: 全选:Ctrl+A 复制:Ctrl+C 粘贴:Ctrl+V 删除:Ctrl+X 快速复制到下一行:Ctrl+Shift+D 快速向上移动代码:Ct ...

  8. java面向对象（一）

    [toc] 面向对象 我们都说java是面向对象的编程语言,那什么是面向对象呢?什么是类呢?什么是方法呢? 类.对象.方法 类是对象的抽象定义,对象是类的具体实例. 类:指的是一类东西,比如汽车,人类 ...

  9. SessionStateMode之SQL Server共享session

    分布式应用首先要解决的是跨域的问题,解决session.frame.cookie的跨域是最基本的,然后才是负载均衡和性能优化,上面的不解决就没法往后面进行.上一博客主要是解决了frame跨域的问题,今 ...

  10. MySQL（十一）之触发器

    上一篇介绍的是比较简单的视图,其实用起来是相对比较简单的,以后有什么更多的关于视图的用法,到时候在自己补充.接下来让我们一起了解一下触发器的使用! 一.触发器概述 1.1.什么是触发器 触发器(Tri ...