jquery+ajax实现动态加载表单

场景：

springMVC+jquery+ajax+jsp实现在页面中输入数字后，点击按钮，表单中自动加载指定行数据。

1、user实体类

2、创建controller组件类。

toDymyuser（）方法用于跳转到jsp页面

getMyUserClass（）方法用于jsp页面的数据加载来源

3、新增jsp页面

1）、获取当前服务路径bathpath

2）、引入jquery包，这里直接使用的是 http://cdn.static.runoob.com 下的jquery包，在浏览器中输入该地址可访问，即为可用

3）、引入style样式，让页面简洁美观

4）、在script中，使用ajax时，需要传入参数便于动态显示表格，所以需要与controller层交互，这里使用post的方式，并在url中引入controller中设置的地址，数据传输成功后，动态追加到htmltxt中，最后使用jquery选择器将htmltxt传到元素的html即可。

4、使用springMVC必须要配置web.xml文件

5、web.xml中使用到了/spring-mvc-servlet.xml，所以要在web-inf目录下新增该文件

6、启动tomcat，在浏览器中输入： http://localhost:8080/dyuser 。效果如下

HTML

因为本人没用过jQuery，所以前期写了一堆事件，做了一些调试工作...

后边要使用到 name 做判断

HTML

JS

网页

注意：

radio 和 checkbox 中的 value 不止一个。

若要把多个数据填充给一个 key ，是需要使用数组存放数据的。

第一次写的时候没考虑到 radio 和 checkbox 的数据，就直接使用字符串赋值了。

后来调试的时候发现，不管多选框中选择多少个项， hobby 的 value 始终是最后一个 checkbox 的 value ....

使用数组，首先就要初始化对象。

因为使用 Array 对象的 push() 方法可以很方便的向后插入数据...

jquery表单提交数据的方法有两种：

一种是直接提交，调用submit()方法，

第二种是用ajax提交，ajax提交要注意讲数据序列化。

比如：

1、调用submit()方法

$(表单).submit()

2、ajax提交

$.ajax({

url: url,

data: $(表单).serialize(),

type: 'post',

success: function (data) {

}

})

---