`
bingo6001
  • 浏览: 10869 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

EXT combobox控件异步提交到后台中文乱码解决方案

阅读更多
    序:所有文件都是GBK编码,JSP定义的是GBK编码,EXT文件也另存为了GBK编码。

    项目里用ext的combobox控件做了一个动态下拉菜单,因为数据量可大可小,所以没有预先将数据加载到前台jsp,而是实时查询后台所有符合条件的数据。对于简拼和全拼的查询支持较好,但是输入中文却一直没法得到正确的搜索结果,debug后台代码,发现从前台传过来的数据是乱码。
    后来在网上搜了很久,有很多人说把所有的编码都改成UTF-8就成(EXT默认是UTF-8),但这对于一个已经成熟应用的项目来说显然不实际。也有说在EXT文件中强制将POST编码修改为GBK的,经试验,此方法不可行。很多同学也说需要在传输前对url进行encodeuri,不过对于combobox在异步提交时一直没找到在那边进行encode。当然,ITEYE上也有同学说如果项目非要GBK,那这和EXT默认UTF-8编码就成了不可调和的矛盾,一下就被打击了,遂放弃好久没去理它。
    不过想想这肯定有解决的办法,翻API时看到了beforquery,试了一下,原来可以在这个事件里对传输的query字符进行编码,后台java代码进行UTF解码。

附代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css"/>
<script type="text/javascript" src="../extjs/ext-base.js"></script>
<script type="text/javascript" src="../extjs/ext-all.js"></script>
<script type="text/javascript" src="../extjs/ext-lang-zh_CN.js"></script>
<HTML>
<HEAD>
    <title>title</title>
    <script type="text/javascript">
Ext.onReady(function () {
    var ds = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({
            url: '/spirit.do?method=jsonEmployee'
        }),
        reader: new Ext.data.JsonReader({
            root: 'employees',
            totalProperty: 'totalCount',
            id: 'employeeId'
        }, [
            {
                name: 'employeeId',
                mapping: 'employeeId'
            },
            {
                name: 'employeeName',
                mapping: 'employeeName'
            }
        ])
    });

    var resultTpl = new Ext.XTemplate(
        '<tpl for="."><div class="search-item" >',
        '<span style="width:225;padding-left:20px;">{employeeName}</span>',
        '</div></tpl>'
    );

    function addSearch(t) {
        var search = new Ext.form.ComboBox({
            store: ds,
            displayField: 'employeeName',
            valueField: 'employeeName',
            loadingText: '正在查找...',
            emptyText: '请输入简拼或全拼',
            minChars:1,
            width: 180,
            pageSize: 20,
            listWidth:300,
            hideTrigger:true,
            tpl: resultTpl,
            lazyInit: true,
            lazyRender: true,
            focusClass: '',
            itemSelector: 'div.search-item',
            listeners: {
                'beforequery': function (e) {
                    var combo = e.combo;
                    if (!e.forceAll) {
                        var input = e.query;
						//input:管
                        e.query = encodeURI(input);
						//before:%E7%AE%A1
						//后台java代码:String query = URLDecoder.decode(StringTool.safeToString(_form.getQuery(), ""), "UTF-8");
						//after:管
                        combo.expand();
                    }
                }
            }
        });

        search.applyToMarkup(t);
        t.search = search;
    }

    function txtOnFocus(evt, t, o) {
        var _t = Ext.Element.get(t.id);
        var n = _t.next();
        if (n && n.hasClass('spirit-append')) {
            n.dom.innerText = '';
        }
    }

    function txtOnClick(evt, t, o) {
        ds.load({params: {start: 0, limit: 20}});
    }

    var ss = Ext.select('.cust-employee-spirit');
    for (var i = 0; i < ss.getCount(); i++) {
        var el = ss.item(i);
        el.addListener("focus", txtOnFocus);
        el.addListener("click", txtOnClick);
        addSearch(el.dom);
    }
});
</script>
</HEAD>

<body>
    <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td width="100px" nowrap>
                用户姓名:
            </td>
            <td width="200px" nowrap>
                <div class="employee-spirit-container-1">
                    <input type="hidden" name="employeeId" value="0">
                    <input type="text" name="employeeName" value="" class="inputbox  cust-employee-spirit">
                </div>
            </td>
        </tr>
    </table>
</body>
</HTML>

关键就在于这一段:
'beforequery': function (e) {
                    var combo = e.combo;
                    if (!e.forceAll) {
                        var input = e.query;
						//input:管
                        e.query = encodeURI(input);
						//before:%E7%AE%A1
						//后台java代码:String query = URLDecoder.decode(StringTool.safeToString(_form.getQuery(), ""), "UTF-8");
						//after:管
                        combo.expand();
                    }
                }

    可以从代码注释中看出,我在输入框中传递的文本是“管”,encode之后转为了“%E7%AE%A1”,在后台需要再次将它转回UTF-8格式。就这样,困扰我多日的问题也就随之解决,希望对于同样碰到此问题的同学们起到帮助。
0
0
分享到:
评论

相关推荐

    extjs和struts的技术结合

    11. **Ext JS中文乱码解决方案**:在开发过程中,可能会遇到中文乱码问题,这通常与编码设置有关,需要确保项目编码、服务器编码、浏览器编码一致。 12. **Eclipse中JS中文乱码**:Eclipse作为IDE,其JavaScript...

    电力系统中基于MATLAB的价格型需求响应与电价弹性矩阵优化

    内容概要:本文详细介绍了如何利用MATLAB进行价格型需求响应的研究,特别是电价弹性矩阵的构建与优化。文章首先解释了电价弹性矩阵的概念及其重要性,接着展示了如何通过MATLAB代码实现弹性矩阵的初始化、负荷变化量的计算以及优化方法。文中还讨论了如何通过非线性约束和目标函数最小化峰谷差,确保用户用电舒适度的同时实现负荷的有效调节。此外,文章提供了具体的代码实例,包括原始负荷曲线与优化后负荷曲线的对比图,以及基于历史数据的参数优化方法。 适合人群:从事电力系统优化、能源管理及相关领域的研究人员和技术人员。 使用场景及目标:适用于希望深入了解并掌握价格型需求响应机制的专业人士,旨在帮助他们更好地理解和应用电价弹性矩阵,优化电力系统的负荷分布,提高能源利用效率。 其他说明:文章强调了实际应用中的注意事项,如弹性矩阵的动态校准和用户价格敏感度的滞后效应,提供了实用的技术细节和实践经验。

    一级医院医疗信息管理系统安装调试技术服务合同20240801.pdf

    一级医院医疗信息管理系统安装调试技术服务合同20240801.pdf

    表5 文献综述.doc

    表5 文献综述.doc

    36W低压输入正激电源, 正激变压器设计方法步骤及谐振电感的设计方法,主要讲诉了正激电源变压器测的输入输出参数,按输入的条件设计相关的变压器的参数,同时将输出电感的设计方法一并例出,详细的设计步骤

    36W低压输入正激电源 变压器电感设计

    基于YOLOv8的深度学习课堂行为检测系统源码(含检测图片和视频)

    基于YOLOv8的深度学习课堂行为检测系统源码,软件开发环境python3.9,系统界面开发pyqt5。在使用前安装python3.9,并安装软件所需的依赖库,直接运行MainProgram.py文件即可打开程序。模型训练时,将train,val数据集的绝对路径改为自己项目数据集的绝对路径,运行train.py文件即可开始进行模型训练,内含项目文件说明,以及检测图片和视频。

    odbc-oracle zabbix模版原版

    odbc_oracle zabbix模版原版

    基于纳什谈判理论的风光氢多主体能源系统合作运行方法——综合能源交易与优化模型

    内容概要:本文探讨了利用纳什谈判理论来优化风光氢多主体能源系统的合作运行方法。通过MATLAB代码实现了一个复杂的优化模型,解决了风电、光伏和氢能之间的合作问题。文中详细介绍了ADMM(交替方向乘子法)框架的应用,包括联盟效益最大化和收益分配谈判两个子任务。此外,还涉及了加权残差计算、目标函数构造、可视化工具以及多种博弈模式的对比等功能模块。实验结果显示,合作模式下系统总成本显著降低,氢能利用率大幅提升。 适合人群:从事能源系统研究的专业人士、对博弈论及其应用感兴趣的学者和技术人员。 使用场景及目标:适用于需要优化多主体能源系统合作运行的场合,如工业园区、电网公司等。主要目标是提高能源利用效率,降低成本,增强系统的灵活性和稳定性。 其他说明:代码中包含了丰富的可视化工具,能够帮助研究人员更好地理解和展示谈判过程及结果。同时,提供了多种博弈模式的对比功能,便于进行性能评估和方案选择。

    C#与Halcon联合编程实现高效视觉几何定位与测量框架

    内容概要:本文详细介绍了如何利用C#与Halcon联合编程构建高效的视觉几何定位与测量框架。主要内容涵盖模板创建与匹配、圆测量、数据持久化以及图像采集等方面的技术细节。首先,通过创建形状模板并进行匹配,实现了工件的精确定位。接着,针对圆形物体的测量,提出了动态ROI绘制、亚像素边缘提取和稳健圆拟合的方法。此外,还讨论了模板管理和图像采集的最佳实践,确保系统的稳定性和高效性。最后,强调了Halcon对象的内存管理和错误处理机制,提供了实用的优化建议。 适合人群:具备一定编程基础,尤其是对C#和Halcon有一定了解的研发人员和技术爱好者。 使用场景及目标:适用于工业生产线上的自动化检测设备开发,旨在提高工件定位和尺寸测量的精度与效率。主要目标是帮助开发者掌握C#与Halcon联合编程的具体实现方法,从而构建稳定可靠的视觉检测系统。 其他说明:文中提供了大量实战代码片段和调试技巧,有助于读者快速理解和应用相关技术。同时,作者分享了许多实际项目中的经验和教训,使读者能够避开常见陷阱,提升开发效率。

    QT6 C++视频播放器实现(基于QGraphicsVideo)

    QT视频播放器实现(基于QGraphicsView)

    评估管线钢环焊缝质量及其对氢脆的敏感性.pptx

    评估管线钢环焊缝质量及其对氢脆的敏感性.pptx

    机器学习(预测模型):专注于 2024 年出现的漏洞(CVE)信息数据集

    该是一个在 Kaggle 上发布的数据集,专注于 2024 年出现的漏洞(CVE)信息。以下是关于该数据集的详细介绍:该数据集收集了 2024 年记录在案的各类漏洞信息,涵盖了漏洞的利用方式(Exploits)、通用漏洞评分系统(CVSS)评分以及受影响的操作系统(OS)。通过整合这些信息,研究人员和安全专家可以全面了解每个漏洞的潜在威胁、影响范围以及可能的攻击途径。数据主要来源于权威的漏洞信息平台,如美国国家漏洞数据库(NVD)等。这些数据经过整理和筛选后被纳入数据集,确保了信息的准确性和可靠性。数据集特点:全面性:涵盖了多种操作系统(如 Windows、Linux、Android 等)的漏洞信息,反映了不同平台的安全状况。实用性:CVSS 评分提供了漏洞严重程度的量化指标,帮助用户快速评估漏洞的优先级。同时,漏洞利用信息(Exploits)为安全研究人员提供了攻击者可能的攻击手段,有助于提前制定防御策略。时效性:专注于 2024 年的漏洞数据,反映了当前网络安全领域面临的新挑战和新趋势。该数据集可用于多种研究和实践场景: 安全研究:研究人员可以利用该数据集分析漏洞的分布规律、攻击趋势以及不同操作系统之间的安全差异,为网络安全防护提供理论支持。 机器学习与数据分析:数据集中的结构化信息适合用于机器学习模型的训练,例如预测漏洞的 CVSS 评分、识别潜在的高危漏洞等。 企业安全评估:企业安全团队可以参考该数据集中的漏洞信息,结合自身系统的实际情况,进行安全评估和漏洞修复计划的制定。

    QML Combobox 自动过滤,输入字符串后自动匹配

    博客主页:https://blog.csdn.net/luoyayun361 QML ComboBox控件,输入关键字后自动过滤包含关键字的列表,方便快速查找列表项

    【人工智能领域】人工智能技术发展历程、核心原理及应用指南:涵盖机器学习、深度学习、NLP和计算机视觉的全面介绍

    内容概要:本文全面介绍了人工智能技术的发展历程、核心技术原理、应用方法及其未来趋势。首先阐述了人工智能的定义和核心目标,随后按时间顺序回顾了其从萌芽到爆发的五个发展阶段。接着详细讲解了机器学习、深度学习、自然语言处理和计算机视觉等核心技术原理,并介绍了使用现成AI服务和开发自定义AI模型的应用方法。此外,还展示了智能客服系统、图像分类应用和智能推荐系统的具体实现案例。针对普通用户,提供了使用大模型的指南和提问技巧,强调了隐私保护、信息验证等注意事项。最后展望了多模态AI、可解释AI等未来发展方向,并推荐了相关学习资源。; 适合人群:对人工智能感兴趣的初学者、技术人员以及希望了解AI技术应用的普通大众。; 使用场景及目标:①帮助初学者快速了解AI的基本概念和发展脉络;②为技术人员提供核心技术原理和应用方法的参考;③指导普通用户如何有效地使用大模型进行日常查询和任务处理。; 其他说明:本文不仅涵盖了AI技术的基础知识,还提供了丰富的实际应用案例和实用技巧,旨在帮助读者全面理解人工智能技术,并能在实际工作中加以应用。同时提醒读者关注AI伦理和版权问题,确保安全合法地使用AI工具。

    本学习由 Matrix 工作室制作并开发,包括算法与数据结构的学习路线和各种题解

    本学习由 Matrix 工作室制作并开发,包括算法与数据结构的学习路线和各种题解。

    基于智慧图书馆基础业务流程Axure11高保真原型设计

    本项目致力于构建基于微服务架构的智慧图书馆管理平台,重点突破多校区图书馆异构系统间的数据壁垒。通过建立统一数据治理规范、部署智能分析模块、重构业务流程引擎,系统性实现以下建设目标:构建跨馆业务数据的标准化整合通道,实施容器化部署的弹性资源管理体系,开发具备机器学习能力的业务辅助决策系统,打造可量化评估的管理效能提升模型,最终形成支持PB级数据处理的分布式存储体系与全维度数据资产图谱。

    mysql中慢sql分析

    根据processlist查询出慢sql 1.修改配置文件中的mysql链接 2.目前是15秒执行一次获取执行时间在5秒上的sql,可以在配置中修改 3.执行后查出的慢sql会记录到log文件夹中以日期命名的txt文件中,可自行查验

    全域通航 低空经济服务平台建设实施方案.pptx

    全域通航 低空经济服务平台建设实施方案.pptx

    全国联合交通查询手册,涵盖各大城市

    全国交通一卡通互联互通服务手册,支持在线查询

    电力电子中移相全桥DC-DC变换器的Simulink离散化建模与优化

    内容概要:本文详细介绍了如何在Simulink中进行移相全桥DC-DC变换器的离散化建模及其优化。主要内容包括搭建主电路、PWM波形生成、数字PI调节器的设计以及针对负载突变情况下的闭环控制优化。文中特别强调了移相控制、死区时间设置、采样周期选择、积分限幅、前馈补偿等关键技术点的应用,确保在极端负载条件下(如从3kW突变为3.6W)输出电压仍能保持稳定。此外,作者还分享了许多实践经验,如避免非线性磁化曲线带来的数值振荡、合理设置仿真步长等。 适合人群:从事电力电子研究或开发的技术人员,尤其是对移相全桥变换器感兴趣的研究者和技术爱好者。 使用场景及目标:适用于需要深入了解移相全桥DC-DC变换器工作原理及其在Simulink环境下的离散化建模和优化的人群。目标是掌握如何通过合理的参数设定和算法改进,使系统能够在复杂工况下保持良好的性能。 其他说明:文中提供了大量具体的Matlab/Simulink代码片段,帮助读者更好地理解和实践相关概念。同时,作者也指出了许多常见的陷阱和注意事项,有助于初学者少走弯路。

Global site tag (gtag.js) - Google Analytics