jquery+ajax实现动态加载表单

jquery+ajax实现动态加载表单,第1张

场景:

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 。效果如下

var formHtml = null

function createDiv(){

formHtml = '<form><form>'

return formHtml

}

$(btn).bind('click',function(){

var obj = $(form)

var div = formHtml || createDiv()

$(obj[obj.length-1]).after(div)

})

每次点击创建一个form 然后放在最后一个form的后面。

你可以在《物证材料信息的表格》外面套一个div,获取这个div的innerHTML,加入到下面即可;

只设置name,不要加id了;后台通过name获取数组。

后台循环数组添加即可


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11897956.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-19
下一篇 2023-05-19

发表评论

登录后才能评论

评论列表(0条)

保存