在一个ExtJs小例子中注意的问题

1、当form组件为combox类型时,要想得到值必须指定hiddenName属性,而非name属性。

{
        	xtype: 'combo',
            fieldLabel: '性别',
            name: 'sexText',
            hiddenName: 'sex',   //这是combobox实际的参数名称
            store: new Ext.data.SimpleStore({
                fields: ['value','text'],
                data: [['1','男'],['2','女']]
            }),
            emptyText: '请选择',
            mode: 'local',
            triggerAction: 'all',
            valueField: 'value',
            displayField: 'text',
            readOnly: true
        }

 2、得到form里面组件的值用form.getForm().findField('id').getValue()而不是用Ext.get("id").getValue(),因为后者貌似在火狐里面有错。

3、grid重新加载和form重设的方法:

grid.getStore().reload();

form.getForm().reset();

 4、grid和form交互的方法:

	grid.on("rowclick",function(grid,rownum,event){
		var record=grid.getStore().getAt(rownum);
		form.getForm().loadRecord(record);//将record中的数据赋予form中的输入组件,前提:form的name和record中定义的属性一致即可。
	});

 

5、无论是form提交还是ajax请求,与后台交互时,需要返回json格式的字符串,如jsp页面应该这样写:

<%@ page contentType="application/json;charset=utf-8"  %>
<%
    request.setCharacterEncoding("utf-8");
    response.setCharacterEncoding("utf-8");

    .....
 
    out.print("{success:true,msg:'删除成功'}");
%>

    那么前台应该这样获得返回的内容:

form.getForm().submit({
			url:"/stuSave.jsp",  
			success:function(f,action){   //注意这里的参数不能是form,要换个名称
				if(action.result.success){  //为true
					Ext.Msg.alert("消息",action.result.msg);
				}				
			},
			failure:function(){
				Ext.Msg.alert("错误","修改失败");
			}					
		});

 

 

以下是一个使用ExtJS 6调用百度地图的完整示例: 1. 首先,我们需要在HTML文件引入ExtJS 6和百度地图API: ``` <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>ExtJS6调用百度地图示例</title> <script type="text/javascript" src="ext-all.js"></script> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的百度地图API密钥"></script> </head> <body> <div id="map"></div> </body> </html> ``` 请注意,您需要将“你的百度地图API密钥”替换为您自己的密钥。 2. 接下来,在ExtJS 6应用程序创建一个包含地图的面板: ``` Ext.application({ name: 'MyApp', launch: function() { Ext.create('Ext.panel.Panel', { renderTo: Ext.getBody(), width: 800, height: 600, title: '百度地图', layout: 'fit', items: [{ xtype: 'component', id: 'map-canvas', autoEl: { tag: 'div' }, listeners: { afterrender: function() { var map = new BMap.Map(this.id); // 创建百度地图实例 var point = new BMap.Point(116.404, 39.915); // 创建点坐标 map.centerAndZoom(point, 15); // 初始化地图,设置心点坐标和缩放级别 } } }] }); } }); ``` 此代码创建一个ExtJS面板,并在面板包含一个组件,该组件将在ExtJS应用程序启动后动态创建百度地图实例。 3. 最后,我们需要在浏览器运行ExtJS应用程序: 将上面的代码保存为一个HTML文件,然后在浏览器打开该文件即可。您应该会看到一个包含百度地图的面板。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值