需求的产生:公司要求用系统对产品价格实现全球控管,在价格管理模块要求动态产生输入表单,其效果就像Excel的操作一样,具体见下图:
“1”控制红框范围内表单“2”的生成(不同产品线有不固定数量的产品所致)
“3”控制蓝框范围内表单“4”的生成(不同产品在同一段时间内定价策略各异)
解决方案:
“2”中除“4”部分表单采取Web控件
“4”中表单采取Html代码模拟。
经过摸索发现,动态产生的Web控制,只要控件ID相同,刷新之后是可以保留状态信息的(先在Aspx的Page中加入EnableViewState=true),所以现在要解决的问题就是需要有一个隐藏控件ItemCount记录有多少个“2”产生了,ItemCount是拉进来的非动动的控件,状态信息可以保留,所以“1”所做的动作其实就是给ItemCount的记数自加,然后在Page_Load的时候循环产生“2”,记得所有控件应该有规律(控件类型_控件意义_行号)的生成标识即控件ID。
“3”对“4”的生成需要用Hmtl代码来模拟,原本想过也用Web控件,最终研究的结果是动态控件中的动态控件没有办法保留状态信息,所以这里的状态信息以及表单本身都只能模拟出来。所以又要拖进来一个控件PriceValue来保存价格信息,存储格式“行号1,价钱1,日期1|行号2,价钱2,日期2……”,后台要完成两个动作,一个是拼出如此格式的字符串,另外就是根据数据库的价格信息模拟出价格输入表单。要注意的就是,任何一个价格表单的改动都应该触发一个客户端脚本,重新遍历一下所有的价格表单,然后重写PriceValue的信息,这样才能保证价格信息即时保存下来,才人会在页面刷新的时候丢失。
虽然上面讲的很简单,但实际开发的时候有许多细节需要考虑,比如一个简单的删除可能就会打乱规律,要作特殊处理,另外图片选择信息用户也要求保留(文件选择框一刷文件选择信息就没了,天经地义)……最后这一个页面的后台编码写了近三千行,实在是很失败,但用户想要的都实现了,用户却满意了……
分享到:
相关推荐
基于HTML5的表单输入提示的实现,内核由jquery.label_better.js、jquery.label_better.min.js实现,当鼠标放在表单输入框上时,会浮动显示出文字提示,有动态效果,测试时最好在火狐台Chrome浏览器下。
当数据表单发生变化,用户点击了关闭按钮,则根据监听结果来判断用户输入或编辑了数据,进而出现弹窗提示,让用户选择是否离开;当数据没发生变化,则不必提示。 确认离开提示框 实现效果 先实现一个确认离开提示框...
电子政务或办公自动系统中动态电子输入表单定义,录入,打印的实现 pdf文档
HTML5实现带提示的精美登录表单特效,当鼠标点击文本框的时候,也就是输入框获得焦点的时候,会向下显示出用户曾经输入过的内容,只需选择这些内容即可显示在文本框中,提升了用户操作体验。
JS实现表单输入正则表达式验证功能源码.zip
本文通过python3、第三方python库Selenium和谷歌浏览器Chrome,完成WPS表单的自动填写。 开发环境配置 python3的安装:略,网上都有教程。 Selenium的安装:在命令行输入pip3 install selenium并回车...
纯jquery的表单正则表达式,用来动态检测所输入密码的强度。
在完整继承了 element 的form表单属性的基础上进行了简单扩展,一些非表单组件或者封装的自定义组件,如图片上传、富文本等也可进行整合,从而用户能够通过使用一段预设的数据渲染出一个完整的表单。
jQuery实现的表单输入文字计数显示特效代码.zip
jQuery实现的用户注册表单输入验证特效源码.zip
html5+css3实现的表单美化效果,以及具有输入验证特效,此种特效在网站非常实用,需要此段代码的朋友们可以前来下载使用。
利用Ajax技术实现表单输入信息的验证。以用户注册页面示例,在注册页面中需要对用户名和两次输入的密码进行验证,其中用户名是唯一的,不能重复,而两次输入的密码必须相同,只用这样的输入才是有效地。并且要求,...
报名时候不确定报名人数,姓名表单默认只有一个,可自主添加表单。大概就是这个意思吧! 还有一个升级版本,请看另一个资源
goods表)的信息带出来,在数量列输入数量,会自动算出小计,点击保存会把数据写入tbl_record表,点击加载会把tbl_record的数所显示在表格上,以上简单示例适用于进销存或商业ERP的表单录入或数据录入界面,...
动态渲染就是有一个异步的数据,大概长这样: { "inline": true, "labelPosition": "right", "labelWidth": "", "size": "small", "statusIcon": true, "formItemList": [ { "type": "input", "label": ...
控制文本输入数字的功能限制!控制文本输入数字的功能限制!控制文本输入数字的功能限制!控制文本输入数字的功能限制!
//获取到input标签框框里面输入的值,是一个字符串 var regExp = new RegExp("^\\w*$","gm");//一定要写上开头^和结尾$不然匹配上后,没办法排除别的,要打上*号,表示可以0个以上匹配的字符 var ismacth=regExp....