JS表单提交

JavaScript表单提交:
form表单用于收集用户输入的不同类型的信息,然后进行提交表单的数据,接着控制器对传来的数据进行接收与处理
1、在进行表单提交时,控制器会有4种方式来接收表单数据:
(1)通过形参的方式来接收表单提交的数据:

 public ActionResult First(string name,string sex)
        {
            var str = name + "  " + sex;
            return Content(str);  //返回字符串内容
        }

(2)通过FormCollection来接收表单数据
(只能接收通过post提交过来的数据)

 public ActionResult Second(FormCollection form)
        {
            string name = form["name"];
            string sex = form["sex"];
            string str = name+" "+sex;
            return Content(str);
        }

(3)通过 Request.Form[“name的属性值”]获取表单数据
(只能接收通过post提交过来的数据)

public ActionResult Thirst()
        {
            string name = Request.Form["name"];
            string sex = Request.Form["sex"];
            string str = name + " " + sex;
            return Content(str);
        }

(4)通过EntityClass实体类接收数据:

public ActionResult Four(Person person)
        {
            string name = person.name;
            string sex = person.sex;
            string str = name + " " + sex;
            return Content(str);
        }

        //创建实体类
        public class Person
        {
           public string name { get; set; }
           
           public string sex  { get; set; }

        }

2、使用form表单中默认(submit)的提交方式:
(1):如果在form表单中未设置type属性则会默认为type=“submit”
type=“submit”为button表单提交的属性
type=“reset”为button表单的重置属性

(2) 表单的属性action与method
Action 规定当提交表单时向何处发送表单数据
Method 规定用于发送form-data的HTTP方法(提交表单的方式get/post)
get与post区别:
与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
然而,在以下情况中,请使用 POST 请求:
1.无法使用缓存文件(更新服务器上的文件或数据库)
2.向服务器发送大量数据(POST 没有数据量限制)
3.发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠
get/post区别:
1.GET方法是用来向服务器上获取数据,而PSOT是用来向服务器上传递修改数据。
2.GET将表单里的数据添加到action所指向的URL后面,并且两者之间使用”?”连接,而各个变量之间使用"&"连接
PSOT是将表单中的数据放在form的数据体(FormData)中,
按照键值对的方式,传递到所指向的action
3.GET是不安全的,因为在传输过程中,数据被放在请求的url中这样用户可以直接在浏览器上看到提交的数据,
POST的所有操作对用户来说都是不可见的,数据都在数据体(FormData)中
4.GET方法向URL添加数据,URL的长度是受限制的(URL的最大长度是2048个字符),
POST提交无限制
5.GET为form表单的默认提交方式
6.GET方式获取数据后,刷新不会有负面的影响,因为它只是获取数据,
POST数据会被重新提交可能会产生不良的后果(浏览器应该告知用户数据会被重新提交)
7.数据类型的限制:GET只允许ASCII字符,POST则无限制
(如果提交二进制数据(例如:图片),需要使用POST方法)

   3、使用js手动提交方式:
          给button按钮添加点击方法:
 function sumbit() {
            var name = document.getElementById("name").value;
            var sex = document.getElementById("sex").value;
            //获取form表单元素
            var form = document.getElementById("form");
            //使用form元素的属性
            form.action = "/One/First";
            form.method = "post";
            form.submit();
        }

Form表单中还有一个属性就是:
Onsubmit=“return false”防止表单自动提交的特征

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值