Extjs中给一个组件命名时，id,name,hiddenName这三者的用法和区别是什么

最新推荐文章于 2020-11-03 23:10:11 发布

love520240diaoer

最新推荐文章于 2020-11-03 23:10:11 发布

阅读量462

点赞数

分类专栏： extjs 文章标签： EXT JSP QQ prototype HTML

本文链接：https://blog.csdn.net/love520240diaoer/article/details/83693713

版权

extjs 专栏收录该内容

36 篇文章 0 订阅

订阅专栏

Extjs中给一个组件命名时，id,name,hiddenName这三者的用法和区别是什么

id，name与HTML中元素的id、name相对应
hiddenName是ComboBox特有的初始化config。一般来说，下拉列表分显示值和上传值。hiddenName是用来说明哪个值是上传值。

Ext.Combobox时候用(hiddenName对应下拉的隐藏key,name对应下拉显示内容value)

# <html>
# <head>
# <title>Myhtml.html</title>
# <meta http-equiv="content-type" content="text/html; charset=GBK">
# <link rel="stylesheet" type="text/css" href="ext3.0/css/ext-all.css" mce_href="ext3.0/css/ext-all.css" />
# <link rel="stylesheet" type="text/css" href="css/Main.css" mce_href="css/Main.css" />
# <mce:script type="text/javascript" src="ext3.0/js/ext-base.js" mce_src="ext3.0/js/ext-base.js"></mce:script>
# <mce:script type="text/javascript" src="ext3.0/js/ext-all.js" mce_src="ext3.0/js/ext-all.js"></mce:script>
# <mce:script type="text/javascript" src="js/zllr/ext-lang-zh_CN.js" mce_src="js/zllr/ext-lang-zh_CN.js"></mce:script>
# <mce:script type="text/javascript" src="js/me.js" mce_src="js/me.js"></mce:script>
# </head>
# <body>
# <div id="me"></div>
# </body>
# </html>
# Ext3.0下拉框Combobox配置项hiddenName要这么用方可不乱发型收藏
# Myhtml.html:
#
# view plaincopy to clipboardprint?
# <html>
# <head>
# <title>I Love xjy forever.html</title>
# <meta http-equiv="content-type" content="text/html; charset=GBK">
# <link rel="stylesheet" type="text/css" href="ext3.0/css/ext-all.css" mce_href="ext3.0/css/ext-all.css" />
# <link rel="stylesheet" type="text/css" href="css/Main.css" mce_href="css/Main.css" />
# <mce:script type="text/javascript" src="ext3.0/js/ext-base.js" mce_src="ext3.0/js/ext-base.js"></mce:script>
# <mce:script type="text/javascript" src="ext3.0/js/ext-all.js" mce_src="ext3.0/js/ext-all.js"></mce:script>
# <mce:script type="text/javascript" src="js/zllr/ext-lang-zh_CN.js" mce_src="js/zllr/ext-lang-zh_CN.js"></mce:script>
# <mce:script type="text/javascript" src="js/me.js" mce_src="js/me.js"></mce:script>
# </head>
# <body>
# <div id="me"></div>
# </body>
# </html>
# <html>
# <head>
# <title>I Love xjy forever.html</title>
# <meta http-equiv="content-type" content="text/html; charset=GBK">
# <link rel="stylesheet" type="text/css" href="ext3.0/css/ext-all.css" mce_href="ext3.0/css/ext-all.css" />
# <link rel="stylesheet" type="text/css" href="css/Main.css" mce_href="css/Main.css" />
# <mce:script type="text/javascript" src="ext3.0/js/ext-base.js" mce_src="ext3.0/js/ext-base.js"></mce:script>
# <mce:script type="text/javascript" src="ext3.0/js/ext-all.js" mce_src="ext3.0/js/ext-all.js"></mce:script>
# <mce:script type="text/javascript" src="js/zllr/ext-lang-zh_CN.js" mce_src="js/zllr/ext-lang-zh_CN.js"></mce:script>
# <mce:script type="text/javascript" src="js/me.js" mce_src="js/me.js"></mce:script>
# </head>
# <body>
# <div id="me"></div>
# </body>
# </html>
#
# me.js:
#
# var app={};
# Ext.onReady(function(){
# Ext.QuickTips.init();
# Ext.form.Field.prototype.msgTarget = 'side';
# Ext.BLANK_IMAGE_URL = '../ext3.0/images/default/s.gif';
# var bqarrayDatas = [[1, '非版权图片'], [2, '版权图片'], [3, '限制版权图片']];
# var bqsimpleStore = new Ext.data.SimpleStore({
# fields: ["retrunValue", "displayText"],
# data: bqarrayDatas
# });
# //我的gridPanel QQ:413881461,广交天下有志之士
# app.addForm = new Ext.form.FormPanel({
# title : 'jjk说：你们好',
# applyTo:"me",
# frame:true,
# id: 'jjk的Grid',items: [{
# xtype:'combo',
# store: bqsimpleStore,
# allowBlank:false,//该选项值不能为空
# valueField :"retrunValue",
# displayField: "displayText",
# //数据是在本地
# mode: 'local',
# //forceSelection: true,必须选择一项
# emptyText:'请选择版权信息...',//默认值
# hiddenName:'hbqxx',//hiddenName才是提交到后台的input的name,这里hiddenName的值不能与id相同，否则你会发现一个问*_*题
# editable: false,//不允许输入
# triggerAction: 'all', //因为这个下拉是只能选择的，所以一定要设置属性triggerAction为all，不然当你选择了某个选项后，你的下拉将只会出现匹配选项值文本的选择项，其它选择项是不会再显示了，这样你就不能更改其它选项了。
# fieldLabel: '版权信息',
# id : 'bqxx',
# name: 'nbqxx',
# width: 130
# }],
# buttons: [{
# id:'submit',
# text: ' 提交 ',
# handler: function(){
# if(app.addForm.getForm().isValid()){
# Ext.getCmp("submit").disable();
# app.addForm.getForm().submit({
# clientValidation: true,
# url: '/ypzlk/Tgxx.jsp',
# method : 'POST',
# success: function(form, action){
# Ext.MessageBox.alert('success');
# },
# failure: function(form, action) {
# Ext.Msg.alert('failure');
# }
# });
# }
# }
# }]
# })
# Java后台Tgxx.jsp:
# <%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
# <%
# String path = request.getContextPath();
# String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
# %>
# <html>
# <head>
# <base href="<%=basePath%>">
# </head>
# <body>
# <%
# String hbqxx = request.getParameter("hbqxx");
# String nbqxx = request.getParameter("nbqxx");
# String bqxx = request.getParameter("bqxx");
# System.out.println("hbqxx = "+hbqxx);
# System.out.println("nbqxx = "+nbqxx);
# System.out.println("qxx = "+bqxx);
# out.println("hbqxx = "+hbqxx+"<br>");
# out.println("nbqxx = "+nbqxx+"<br>");
# out.println("qxx = "+bqxx+"<br>");
# %>
# </body>
# </html>
#
#
#
#
#
# //如果你下拉选择的是"非版权图片"
# String hbqxx = request.getParameter("hbqxx");
# System.out.println("hbqxx-->"+hbqxx);
# hbqxx-->1
# String nbqxx = request.getParameter("nbqxx");
# System.out.println("nbqxx-->"+nbqxx);
# nbqxx-->非版权图片
# String bqxx = request.getParameter("bqxx");
# System.out.println("bqxx-->"+bqxx);
# bqxx-->null