惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

酷 壳 – CoolShell
酷 壳 – CoolShell
H
Hacker News: Front Page
P
Palo Alto Networks Blog
T
ThreatConnect
Apple Machine Learning Research
Apple Machine Learning Research
博客园_首页
T
True Tiger Recordings
P
Privacy & Cybersecurity Law Blog
B
Blog
IT之家
IT之家
Last Week in AI
Last Week in AI
F
Full Disclosure
Hacker News: Ask HN
Hacker News: Ask HN
C
Comments on: Blog
Microsoft Azure Blog
Microsoft Azure Blog
C
Cybersecurity and Infrastructure Security Agency CISA
Microsoft Security Blog
Microsoft Security Blog
博客园 - 【当耐特】
N
News and Events Feed by Topic
NISL@THU
NISL@THU
腾讯CDC
雷峰网
雷峰网
Security Latest
Security Latest
李成银的技术随笔
M
Microsoft Research Blog - Microsoft Research
L
LangChain Blog
L
Lohrmann on Cybersecurity
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
C
Check Point Blog
Y
Y Combinator Blog
Recent Announcements
Recent Announcements
博客园 - Franky
N
News | PayPal Newsroom
V
V2EX
A
About on SuperTechFans
The Register - Security
The Register - Security
月光博客
月光博客
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Google Online Security Blog
Google Online Security Blog
MyScale Blog
MyScale Blog
Cisco Talos Blog
Cisco Talos Blog
Vercel News
Vercel News
WordPress大学
WordPress大学
C
Cyber Attacks, Cyber Crime and Cyber Security
The Hacker News
The Hacker News
IntelliJ IDEA : IntelliJ IDEA – the Leading IDE for Professional Development in Java and Kotlin | The JetBrains Blog
IntelliJ IDEA : IntelliJ IDEA – the Leading IDE for Professional Development in Java and Kotlin | The JetBrains Blog
爱范儿
爱范儿
A
Arctic Wolf
L
LINUX DO - 最新话题
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More

博客园 - yueue

Ext Portal如何消除横向滚动条 JavaScript中的对象动态加载技术 JavaScript使用ACTIVEX控件引起崩溃问题的解决 如何把Ext.data.store里的数据一次性用JSON传给后台(添加了后台解析部分) - yueue 解决EXT DateField 用getValue() 发送到后台,后台取null的问题 - yueue ExtJs 中一个Toolbar 不够用?再来一个! - yueue 为什么ext combox 下拉框不出现自动提示,自动选中 如何做一个两列的FormPanel json-lib出现There is a cycle in the hierarchy解决办法 EXT如何把一个对象转换为JSON并将其发送到服务器 - yueue - 博客园 ExtJs如何通过JSON与后台通信 ExtJs 及 Ajax 乱码解决方案 - yueue [教程]创建ADOKeycap数据库对象 认识 yueue.ADOKeycap 开源数据库组件 [教程]使用yueueData统计数据 [教程]在ADOKeycap中使用DataReader读取数据 [教程]使用ADOKeycap插入,更新,删除数据 [教程]使用AODKeycap读取数据 - yueue [教程]添加yueue.ADOKeycap数据库组件到您的项目 - yueue - 博客园
如何使开启了分页功能的EXT Combox可以自动选中非第一页的值
yueue · 2010-02-23 · via 博客园 - yueue

当我们在Combox 中定义了PageSize属性,那么Combox 自动获得了分页的能力。这本身很好,但是带来一个问题。

这个问题的发生是因为,Combox组件有一个特点。当你想用程序控制,让下拉列表中的某一项成为当前选中项时,这个项必须是在列表中存在的(有点像废话)。 意思就是说,如果你列表里有A,B,C,D 4个选项, Combox分了页,AB在第一页,CD在第二页,而默认情况下拉列表中只有第一页的内容,就是只有AB, 那么你想让Combox当前的值是D , 就实现不了了。

这种情况经常出现在,当你想让用户在某个Grid列表里点击一个记录,选择一个“修改”,接下来弹出的修改窗口中有个Combox,Combox自动选中了这条记录原先选中的值。  这种情况如果原先的值是在Combox的第二页, 你就傻眼了。

下面的代码解决了上述问题。

//Define a record structure
var consignerRecord = Ext.data.Record.create([
   {name:"consignerId"},
   {name:"consignerName"}
]);

//this is the store
comboxConsignerStore = new Ext.data.JsonStore({
  url:'/pcms/dictionary/consigner.do?method=findConsigners',
  root:'Datas',
  totalProperty: 'TotalRecords',
  fields:[
   {name:'consignerId', mapping:'consignerId'},
   {name:'consignerName', mapping:'consignerName'}
  ]
});

//ah ,the combox with pagebar
var comboxConsigner = new Ext.form.ComboBox({
  name:'consignerId',
        hiddenName:'consignerId',
        displayField:'consignerName',
        valueField:'consignerId',
        emptyText:'请选择',
        fieldLabel:'供货方',
        width:200,
        editable:false,
        allowBlank:false,
        mode:'remote',
        loadingText:'loading...',
        pageSize:10,
        selectOnFocus: true,
        triggerAction:'all',
     store: comboxConsignerStore
});

//上例中的修改窗体,就是这个了

var UpdateWindow = new Ext.Window({
  title:'新增合同',
  layout:'fit',
  items:[formPanel],
  model:true,
  width:450,
  height:450,
  listeners:{

//关键点来了,beforeshow,在窗体显示之前,我们对combox进行些处理
   beforeshow: function(){
    if(grid.getSelectionModel().getSelected() != null){ //首先保证用户得选中了记录
     //处理ConsigneeCombox
     var cr = new consigneeRecord({// 创建一条新的consignee记录,为以后插入做准备
      consigneeId: grid.getSelectionModel().getSelected().get("consigneeId"),//记录内的值是从用户选中的Grid记录中取的
      consigneeName: grid.getSelectionModel().getSelected().get("consigneeName")//同上
     });

//又是重点,filterBy 函数, 可以通过这个,控制store的记录,返回true,就允许一条记录插入到stroe里,返货false就抛弃掉本条记录。

//store里每条记录都会过一遍这个方法,所以我们就在这里判断,把用户在Grid选中的那条记录里的combox记录给抛弃掉,

//为以后插入做准备
     comboxConsigneeStore.filterBy(function(aRecord,aId){
      if(aRecord.get("consigneeId") == grid.getSelectionModel().getSelected().get("consigneeId")){
       return false;
      }
      return true;
     });

//插入用户在Grid上选中的记录对应的那条combox记录,然后再控制选中,就满足了combox的特点。
     comboxConsigneeStore.insert(0,cr);
     comboxConsignee.setValue(comboxConsignee.getValue());
      }
   }
  }
});