form表单提交,上传文件以及提交前验证的问题。

 form表单是在开发中比较基础也比较常见的问题了,今天就给大家分享一下有关form表单提交的一些小问题.   

 首先我们来看一下基本的form结构.这里面我直接引用的bootstrap的form表单的框架。

<form class="form-horizontal" id="form1" name="myForm" action="/cgjxx/fwjl_delete_servlet" method="post" enctype="multipart/form-data">
                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">Email</label>
                    <div class="col-sm-10">
                        <input type="text" name="email" class="form-control" id="inputEmail3" placeholder="phone">
                    </div>
                </div>
                <div class="form-group">
                    <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
                    <div class="col-sm-10">
                        <input type="password" name="password" class="form-control" id="inputPassword3" placeholder="Password">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <div class="checkbox">
                            <label>
                              <input type="checkbox"> Remember me
                        </label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <input type="submit" class="btn btn-default"  value="提交">
                    </div>
                </div>
            </form>

 简单来说一下form表单提交时候设置的属性:

   name="myForm"  /*所代表的表单的名字*/

    action="/cgjxx/fwjl_delete_servlet" /*表单提交地址*/

   method="post"  /*提交方式:(get,post)看需要来更换*/

   enctype="multipart/form-data"  /*规定在发送表单数据之前如何对其进行编码。默认是:"application/x-www-form-urlencoded"*/

   注意 a:在提交的form表单中如果包括提交文件(包含input='file'),那么enctype必需设置成:
enctype="multipart/form-data",否则会报错(或者提交失败).
   注意 b:的就是 input 标签需要设置name=""值否则提交也会报错(或者提交失败),因为传到服务器的时候也是fname=asdf & lname=asdf 类似这种key=val格式的所以不填也会报错

 这样当点击submit按钮的时候表单就会直接提交,但是我们有时候需要做一些验证功能,直接提交就不能验证了,好大家往下看:

 解决方案一:将type="submit"改成type="button",把所需要写的验证功能或者其他功能写在function formSubmit(){} 这个方法里面就可以了。

 
  
<input type="submit"  class="btn btn-default"  value="提交">

<input type="button" onclick="formSubmit()" class="btn btn-default" value="signin">
 
 

解决方案二:在form 里面加上 onsubmit 属性在提交表单提交时触发,这样也可以解决类似提交前验证等问题。

<form class="form-horizontal" id="form1" name="myForm" action="/cgjxx/fwjl_delete_servlet" method="post" enctype="multipart/form-data">

<form class="form-horizontal" id="form1" name="myForm" action="/cgjxx/fwjl_delete_servlet" method="post" enctype="multipart/form-data"  οnsubmit="return formSubmit()">
  

  好了分享就到这里,希望可以帮助有需要的朋友,大神路过也请观看指正!!!.

转载于:https://www.cnblogs.com/jiadong/p/7783623.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值