extjs3 combobox取value和text案例详解_extjs


使用combobox时,它有一个hiddenName的属性,专门用于提交combobox中value的值.
现假设某combobox的Id为comboId,hiddenName属性的值为hiddenValue,
那么,使用Ext.get('comboId').dom.value方法获取的是combobox中选中项的文本text值,
而使用Ext.get('hiddenValue').dom.value获取的才是combobox中需要提交的value的值。
Ext.getCmp("ID值").getValue();获取到的是Value值
.replace(/\s/g, ""); //移除json文本中所有的换行,空格,制表符;
=========================================
extjs 执行button的点击事件,执行handler事件
最简单的方法是查看extjs生成后的html代码dom里面 找到对应的生成的ID的
例如:
方法1:

复制代码 代码如下:

var btn = document.getElementById("ext-gen40");//这里的ext-gen40就是extjs 随即生成的iD 但是有时候这个id会变化的,
btn.click();

方法2:

复制代码 代码如下:

Ext.getCmp('title2d').fireEvent("click"); //这里的 ”title2d“ 是extjs代码中的id

执行按钮handler事件:

复制代码 代码如下:

var btn2d = Ext.getCmp("title2d");
btn2d.handler.call(btn2d.scope, btn2d);

参考网址:http://www.sencha.com/forum/showthread.php?25677-2.0.1-fireEvent%28-click-%29-on-buttons-don-t-call-handler-function
onClick是一个方法,而handler是一个配置项
extjs onclick和handler的区别:http://blog.csdn.net/21aspnet/article/details/6865571
======================================================获取文本框的值
1、Html文本框
如:

复制代码 代码如下:

<input type="text" name="test" id="test" >

获取值的方式为:

复制代码 代码如下:

var tValue = Ext.getDom('test').value;

或者

复制代码 代码如下:

var tValue = document.getElementById('test').value

2、ExtJs的组件
如:

复制代码 代码如下:

{
id:'test',
xtype:'textfield',
fieldLabel:'  测试',
name:'test',
width:370
}

获取值的方式为:

复制代码 代码如下:

var tValue = Ext.getCmp('test').getValue();
  Ext.get('test').dom.value

设置文本框的值

复制代码 代码如下:

Ext.getCmp('test').setValue("设置的值");

==============================按钮的 启用 和 禁用

复制代码 代码如下:

Ext.getCmp('btnQc').disable();//禁用
Ext.getCmp('btnQc').enable();//启用

方法1:可以在定义bbar的按钮时直接给属性,hidden : true 属性,可隐藏;disabled : true 属性,可禁用 方法2:给按钮添加id,比如id:'btn';然后在panel的事件中调用Ext.getCmp('btn').disable();禁用或Ext.getCmp('btn').enable();开启。Ext.getCmp('btn').setVisible (false);隐藏或Ext.getCmp('btn').setVisible (true);显示。

时间: 2024-09-20 04:04:55

extjs3 combobox取value和text案例详解_extjs的相关文章

vue.js+boostrap项目实践(案例详解)_javascript技巧

一.为什么要写这篇文章 最近忙里偷闲学了一下vue.js,同时也复习了一下boostrap,发现这两种东西如果同时运用到一起,可以发挥很强大的作用,boostrap优雅的样式和丰富的组件使得页面开发变得更美观和更容易,同时vue.js又是可以绑定model和view(这个相当于MVC中的,M和V之间的关系),使得对数据变换的操作变得更加的简易,简化了很多的逻辑代码. 二.学习这篇文章需要具备的知识 1.需要有vue.js的知识 2.需要有一定的HTML.CSS.JavaScript的基础知识 3

Android开发之对话框案例详解(五种对话框)

下面通过实例代码给大家分享5种android对话框,具体内容详情如下所示: 1 弹出普通对话框 --- 系统更新 2 自定义对话框-- 用户登录 3 时间选择对话框 -- 时间对话框 4 进度条对话框 -- 信息加载.. 5 popuWindow对话框 1 弹出普通对话框 --- 系统更新 //弹出普通对话框 public void showNormalDialog(View v) { AlertDialog.Builder builder = new Builder(this); //设置Di

深入浅出 spring-data-elasticsearch - 实战案例详解(四)

『  热烈的爱情到订婚早已是定点,婚一结一切了结.现在订了婚,彼此间还留着情感发展的余地,这是桩好事.- <我们仨> 』 「系列文章」 深入浅出 spring-data-elasticsearch - ElasticSearch 架构初探(一) 深入浅出 spring-data-elasticsearch - 概述(二) 深入浅出 spring-data-elasticsearch - 基本案例详解(三) 深入浅出 spring-data-elasticsearch - 实战案例详解(四) 深

深入浅出 spring-data-elasticsearch - 基本案例详解(三

『  风云说:能分享自己职位的知识的领导是个好领导. 』运行环境:JDK 7 或 8,Maven 3.0+技术栈:SpringBoot 1.5+, Spring Data Elasticsearch 1.5+ ,ElasticSearch 2.3.2本文提纲一.spring-data-elasticsearch-crud 的工程介绍二.运行 spring-data-elasticsearch-crud 工程三.spring-data-elasticsearch-crud 工程代码详解 一.spr

visual-Visual C++数字图像模式识别典型案例详解PDF

问题描述 Visual C++数字图像模式识别典型案例详解PDF 1C 谁有<Visual C++数字图像模式识别典型案例详解PDF>完整版 解决方案 跪求大神提供链接或者发到我的邮箱898425209@qq.com 在此拜谢了 解决方案二: http://download.csdn.net/detail/taodnpshi496/8156251这不就是下就行了~

SQL审核:OR展开与子查询优化案例详解

黄廷忠(网名:认真就输) 云和恩墨技术专家 个人博客:http://www.htz.pw/ 本篇整理内容是黄廷忠在"云和恩墨大讲堂"微信分享中的讲解案例,SQL 优化及 SQL审核,是从源头解决性能问题的根本手段,无论是开发人员还是 DBA,都应当持续深入的学习 SQL 开发技能,从而为解决性能问题打下根基. 第一篇为:性能为王:SQL标量子查询的优化案例分析 本篇为系列案例之二:OR展开与子查询优化案例详解. 本案例 SQL 是15年给一个省电信系统做优化时遇到的. SQL性能问题诊

jQuery 跨域访问解决原理案例详解_jquery

浏览器端跨域访问一直是个问题,多数研发人员对待js的态度都是好了伤疤忘了疼,所以病发的时候,时不时地都要疼上一疼.记得很久以前使用iframe 加script domain 声明.yahoo js util 的方式解决二级域名跨域访问的问题. 时间过得好快,又被拉回js战场时, 跨域问题这个伤疤又开疼了.好在,有jQuery帮忙,跨域问题似乎没那么难缠了.这次也借此机会对跨域问题来给刨根问底,结合实际的开发项目,查阅了相关资料,算是解决了跨域问题...有必要记下来备忘, 跨域的安全限制都是指浏览

BootStrap的JS插件之轮播效果案例详解_javascript技巧

Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的. 案例 下面展示的就是此插件和相关组件制作的轮播案例. <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <!-- Indicators --> <ol class

jQuery选择器及jquery案例详解(必看)_jquery

JQuery选择器 解析:为了更好的或者是更快的从复杂的DOM树中找到我们需要的一类标签 1.层次选择器 <!-- 当点击h2元素时,为#menu下的<span>元素添加色为#09F的颜色背景 --> <!-- <script type="text/javascript"> $(function () { $('h2').click(function () { $('#menu span').css('background-color','#0