菜鸟的学习日记总结(八)From表单数据的提交

From表单数据的提交目前学了两种方法,一种方法是使用插件来提交,另一种则是将数据一个个的进行提交。使用插件提交from表单数据的方法很简单,首先引入提交from表单数据的方法的插件
在这里插入图片描述
在将插件引进来后,再给from标签一个ID
在这里插入图片描述
插件提交from表单数据就是通过from表单的ID来确定from表单从而获取到其中的数据。在获取到其中的数据后就可以对其进行提交。
在这里插入图片描述
ajaxSubmit(obj)方法是jQuery的一个插件jquery.form.js里面的方法,所以使用此方法需要先引入这个插件。除此之外还需要在from表单中加上提交数据的路径。
在这里插入图片描述
(该路径为你所写的需要将数据提交过去的方法的路径)
action里面的路径就是需要提交数据的路径。如果不在action中加上路径那么from的数据会提交失败。而且如果使用插件在需要回填from表单的数据的时候也可以通过该插件中方法进行数据的回填。
在这里插入图片描述
如果需要重置表单的内容也可以通过该插件的方法来进行重置。
在这里插入图片描述
但是如果用插件来提交from表单的数据会有个缺点,每个from表单中的数据都是分开的,不能共用一个from表单来提交数据。因为插件是通过ID来获取from表单中数据的,而ID在每一个页面中又是唯一存在的,且使用插件提交form表单的数据需要在from表单中添加路径,所以使用插件是不能共用一个from表单来提交数据的。

如果使用不使用插件的方法来提交from表单中的数据就会比较复杂一点,因为它没有插件那么方便,提交数据是你需要将数据一个个传递过去。
在这里插入图片描述
(以提交修改的数据为例)
在获取到页面的数据后,就需要通过这样的方法将从页面获取到的数据传递到控制器那边。除此之外如果需要回填表单中的数据则需要一个一个数据的进行回填。
菜鸟的学习日记总结(八)From表单数据的提交_第1张图片
且需要重置表单时所使用的重置表单的方法也有所不同。
在这里插入图片描述
但如果不使用插件的方法提交form表单中的数据可以只设置一个from表单,让它们共用一个from表单的样式。和使用插件时不同他提交数据的路径是不需要绑定在from表单中的,只需要在提交数据是写上路径即可。
使用插件来提交form表单中的数据除了是为了方便之外,还有就是插件中ajaxSubmit(obj)的方法可以提交数据量大的表单数据,如果使用其他的方法如post等,在提交数据量大的from表单数据时可能会出现异常。所以一般来说都会选择使用插件来提交from表单中的数据。
但是插件也不百分百完美的,在使用插件来回填表单中的数据时如果遇到下拉框的数据就不能通过插件将它的数据回填回来。因为下拉框的数据需要通过先绑定好数据才能将数据回填回来,所以这个时候使用插件会没有效果,因为这个插件没有这种方法。
在这里插入图片描述
如上图,回填某个学生的学院的下拉框数据,回填数据时需要先通过该学生的学生ID

查询出数据,然后再绑定该下拉框的学院的数据,绑定完成后通过学生ID查询出来的学院ID进行数据的回填。其实无论使不使用插件如果想要回填from表单中的下拉框的数据只能通过这种方法。
使用和不使用插件来提交from表单中的数据主要是看个人习惯,因为目前来说没有哪一种方法是完美的,都有各自的优缺点看个人如何选择。

你可能感兴趣的:(学习日记总结)