今天还算是比较轻巧的,吴哥去重庆出差了,给我留下了任务,就拂袖而去。
最近两天可真是忙,忙,忙,写了两天的前段jquery,终于把效果实现了,剩下这几天改bug,哎,bug效果都不能重现,可真是一件比较麻烦的事情,没有数据呐。在一个比较小的实现效果里面也会遇到各种各样的问题啊。
首先就说一说我这两天的事情吧。要实现的效果呢,不太难,左栏中的分类菜单中点击一个子类别,加载出来一个页面,在页面中呢,左边一个下拉菜单,两个子选项option,切换不同的选项,然后显示出不同个数隐藏的输入框input,点击输入框下面的按钮,实现右边表格中的数据显示以及数据切换。
说说我在其中遇到的一些问题和解决方案吧!
首先在写代码之前呢,要熟悉两个问题,数据从哪里来:Controller/数据库,数据如何显示及其显示效果:jsp/jquery
因为我们这里有保密,实现效果,以及种种不能给大家以效果图的形式来展示,不过这对于猿们,脑补应该不是问题。
①下拉框切换的时候,显示不同个数的输入框
这个效果实现不难,但是在实现的过程中会遇到下拉框切换的问题,需要在代码中不同的选择中来回调试显示和隐藏
②点击左边的查询按钮,怎样实现右边数据表格的刷新数据,以及数据展示
这个问题,很是明白,如果不想使页面刷新或重新载入,使用ajax,否则直接返回页面,但是我当时做的时候,是将输入框统一放到form表单中的,使用form表单无法实现局部刷新效果,于是只能手动提交的表单的功能了,采用的是给按钮添加函数,在函数中加入ajax表单提交,在ajax中实现请求的提交,以及对于数据的处理及展示。
③在点击查询按钮的时候,右边表格中显示数据,当切换下拉菜单中的选项,再次提交请求时,数据会在显示列表的后面直接添加,上一次选择菜单的数据,不会清除。
这是理论意义上的冗余,记得原来做过这个,什么clean,clear,empty,“”,remove,具体记不大清楚了,没有使用jqGrid,用的是最简单的table
<table><thread><tr>列1</tr><tr>列2</tr><tr>列3</tr>
</thread>
<tbody></tbody></table>
原来是在tbody后面after<tr></tr>,但是清空不可以选中tbody
$(table td).remove();这样可以清空上一次的数据
好了不多说了,该用膳了。