ASP.NET-FineUI开发实践-9(二)

其实我也不会,老实教人学怕误人子弟,但是抱着毁人不倦的精神还是糊弄糊弄个别小白吧,最起码能加点原创。

下面以表单为例,打开官方项目,版本为FineUI_4.1.1,打开form_compare页,右键在浏览器中查看,右键查看源文件,这次要做的是前台通过按钮点击生成form及与后台的交互。

1.生成一个行

form_compare里有文本行 文本框1 ,源文件里搜 文本框1

看到了什么,fieldLable就是‘文本框 1‘,说明生成的lable和后面的input(就是textbox)是一个元素,在 form_compare.aspx里也是一个元素,那太好办了,直接拿过来,这里要注意写在</form>后面,为啥呢,例子里都这么写的。

var f4肯定不能要了,一看源文件就是f1.f2.f3 一直生成下来的,改;

f_state 不知道干啥的,也没东西,不管;id,肯定不能重复,先扔掉;

fieldLabel 就是前面标题的意思,改成自己喜欢的;

lablelWidth字面就是宽度,不管理了;

anchor 不知道,不管了;

name 先放着;

allowBlank 不知道是啥,不管了;

成这样了

        F.ready(function () {
            var row = Ext.create(‘Ext.form.field.Text‘, {
                f_state: {},
                fieldLabel: "自己喜欢的",
                labelWidth: 180,
                anchor: "0",
                name: "SimpleForm1$TextBox1",
                allowBlank: false
            });
        });

  干有元素不行啊,还加到表单里,extjs 当然提供了表单的插入方法,开api ,找到form.panel 为啥:

明显f15就是表单,items就是表单的项,f4在里面呢。下面就是猜了,好多属性和方法

新增插入的关键词:add,insert,new 挨个搜,不行就全看一边,恩搜到了

写的太清楚了,昨天已经看到F(‘ID‘)就是获取元素,那就试试吧

F(‘<% =SimpleForm1.ClientID %>‘).insert(3, row);

位置是我随便写的。

2.生成一个按钮

恩,我把重置也沾过来了,同样插入

3.给添加按钮写方法

昨天已经看见了handler就是点击事件,把新增行的事件写在方法里就可以了。

        F.ready(function () {
            var mybutton = Ext.create(‘Ext.button.Button‘, {
                text: "添加自己喜欢的",
                cls: "marginr",
                handler: function () {
                    add();
                    //重置表单
                    F(‘SimpleForm1‘).f_reset();
                }
            });
            F(‘<% =SimpleForm1.ClientID %>‘).insert(13, mybutton);
        });
        window.row_nub = 0;
        function add() {
            row_nub++;
            var row = Ext.create(‘Ext.form.field.Text‘, {
                f_state: {},
                fieldLabel: "自己喜欢的" + row_nub,
                labelWidth: 180,
                anchor: "0",
                name: "SimpleForm1$TextBox1",
                allowBlank: false
            });
            F(‘<% =SimpleForm1.ClientID %>‘).insert(3, row);
        }

  

OK,完成了,就不贴效果了。

恩,还会扩展 text的change回发及改text的颜色。该回家了不写了。

时间: 2024-10-26 08:23:21

ASP.NET-FineUI开发实践-9(二)的相关文章

FineUI开发实践-目录

FineUI初学手册 下载,实例项目搭建 ASP.NET-FineUI开发实践-1 实际开发环境是FineUI 4.0.4,编辑页面回发,__doPostBack应用 ASP.NET-FineUI开发实践-2 1.Window控件显示2.显示隐藏控件4.直接通过行号修改指定列内容5.获取iframe ASP.NET-FineUI开发实践-3 1.参照模拟数据库分页通过缓存重写内存分页,优化页面响应速度2.得到指定行指定列的值后台3.按钮至少选择一项的通用方法,OnClientClick+=累加.

使用ADO实现BLOB数据的存取 -- ADO开发实践之二

使用ADO实现BLOB数据的存取 -- ADO开发实践之二 http://www.360doc.com/content/11/0113/16/4780948_86256633.shtml 一.前言 在上一篇文章<>中我们详细介绍了ADO基本的操作方法,在实际的开发过程中我们常常需要存储较大的二进制数据对象,比如:图像.音频文件.或其它二进制数据,这些数据我们称之为二进制大对象BLOB(Binary Large Object),其存取的方式与普通数据有所区别.本文将介绍利用ADO在数据库中存取B

ASP.NET5+EntityFramework7开发实践(三)

1.说明 在<ASP.NET5+EntityFramework7开发实践(一)>介绍过仓储模式,只是没有在控制器中如何使用? 本章重新补充一下.注意,也会使用ASP.NET5中的依赖注入. 2.仓储模式 先看接口: 1 public interface IRoleRepository:IDisposable 2 { 3 //IEnumerable和IQueryable 4 //二者在EF都会延迟加载,不同的是: 5 //IEnumerable是数据加载到内存,刷选在内存中的数据上执行 6 //

Git工程开发实践(二)——Git内部实现机制

Git工程开发实践(二)--Git内部实现机制 一.Git仓库内部实现简介 Git本质上是一个内容寻址(content-addressable)的文件系统,根据文件内容的SHA-1哈希值来定位文件.Git核心部分是一个简单的键值对数据库(key-value data store).向Git数据库插入任意类型的内容,会返回一个键值,通过返回的键值可以在任意时刻再次检索(retrieve)插入的内容.通过底层命令hash-object可以将任意数据保存到.git目录并返回相应的键值.Git包含一套面

ASP.NET-FineUI开发实践-13(二)

1.加图标和事件 上次已经通过DataSimulateTreeLevelField属性控制了树节点的显示,不用看也知道就是给指定列数据前面加个图标的HTML 可以在SimulateTreeHeper类里看到实现方法,不多说了,原理就是循环行累加上图片就可以了,注意图片的ID和样式 /// <summary> /// 给树赋值 /// </summary> private void SetValueTree() { if (EnableTree) { foreach (GridRow

ASP.NET-FineUI开发实践-6(二)

1.上回说到修改以前的会出现好几个5: 这是因为新增时是只新增到最后一行,所以点击选好了就跑到最后一行了,而且行号不会累积,只加到初始化的行号. 其实js里是有插入的,例子里可以插入到第一行,新增是add,插入是insert.在ext-part2.js里 insert的参数是0,就是第一行,换成行号就可以了.我重写了方法 insert 的参数是rowIndex,  rowIndex=window._selectrowIndex window._selectrowIndex是在弹出windown时

ASP.NET-FineUI开发实践-4(二)

在网上找了找,实验了一下window弹出和关闭的动画效果分享一下. 接上次的代码 default.js window_tips.animCollapse= true;//打开动画效果 window_tips.animateTarget = Ext.getBody();//开始的定位,就是以哪定位,是个el,=按钮 也行 ext-part2.js f_showTips: function里加上 window_tips.on('beforehide', this.f_hideTips);//注册关闭

ASP.NET5+EntityFramework7开发实践(一)

 1.创建项目 创建“空白解决方案”,名为GiveCase. 在解决方案里,添加ASP.NET5 Empty模板项目,名为GiveCase.Web.  2.实体类 实体基类: 1 /// <summary> 2 /// 实体 抽象基类 3 /// </summary> 4 /// <typeparam name="TKey">主键类型</typeparam> 5 public abstract class EntityBase<TK

API开发实践(二) 接受url请求

先简单理解GET请求与POST请求的区别 HTTP请求中POST与GET的区别 在浏览器地址栏输入 http://服务器地址:服务器端口/文件路径 即可访问目的文件或服务 如果带有参数就以 ?参数名=参数值[&参数名=参数值].* 的形式添加到请求中,再在服务器中用request.getParameter()方法取出. 代码:url:  http://localhost:8080/APITest/getMap.java?shipperCode="*"&logisticC