ASP.NET的Form表单

83 篇文章 0 订阅
35 篇文章 0 订阅

Form 表单:一个页面只能有一个

  • runat=“server”不是必须的,加上后,会在输出的源代码里多了一行
    <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNzgzNDMwNTMzZGR/8ZxOm5Tn0sfHNJaqE12hKqqJTQ==" />
    嘿,这不就是传说中的viewstate吗。原来这就是.net中的FORM跟HTML中FORM的区别。
    viewstate是通过HTML控件的name属性来跟踪HTML控件中的数据,这就是为什么在HTML控件中输入数据时也能显示以前曾经输入过的数据。
    假如FORM没有加runat="server"属性的话,HTML控件就不会有这样的效果了。如果FORM加了runat属性,则它的action属性便会失效,或者说action属性值永远为本页。
  • 【action属性】的默认值应该是本页
  • 【method】默认的值是get

    • html Form 表单:一个页面可以有多个
    • 【action属性】的默认值应该是submit按钮触发到action的指向页面
      表单的动作属性(Action)和确认按钮当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
    • 【method】Method的默认值为Get
      在客户端,Get方式在通过URL提交数据;而Post提交后地栏不变。
      在服务器端只能用Request.QueryString来获取Get方式提交来的数据,用Post方式提交的数据只能用Request.Form来获取。
      特别说明
      一般来说,尽量避免使用Get方式提交表单,因为有可能会导致安全问题。比如说在登陆表单中用Get方式,用户输入的用户名和密码将在地址栏中暴露无遗。不过在分页程序中,用Get方式就比用Post好。
      Get把参数添加到action属性指定的地址中,并以锚方式打开。
      Post通过HTTP post处理发送数据。

       

    HTML Form的表单取值:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="htmlInput.aspx.cs" Inherits="htmlInput" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>html标签演示</title>

        <script type="text/javascript">
        function getValue()
        {
            var obj = document.getElementsByName("textName");//使用文本框的name属性
            var obj2 = document.getElementById("password1").value;//使用密码框的id属性
            var obj3 = document.getElementById("textarea1").value;//name名称:不区分大小写
           
            alert(obj[0].value + "/r" + obj2 + "/r" + obj3);
            //alert("换/r行")  confirm("abcdef/u000d123456")  


    •         //单选框
              var oSex = document.getElementsByName("sex");//获取的是一个集合
              var ssex = "";
              for (var i=0;i<oSex.length;i++)
              {       
                  if (oSex[i].checked)
                  {
                    ssex = oSex[i].value;
                    break;
                  }
              }
              if (ssex == "")
                  alert("Please choose a Sex!!");
              else
                  alert("Your Sex is: " + ssex);
             
             
              //多选框
              var oLike = document.getElementsByName("Like");//获取的是一个集合
              var slike = "";
              for (var i=0;i<oLike.length;i++)
              {       
                  if (oLike[i].checked)
                  {
                    slike += oLike[i].value + ",";
                  }
              }
              if (slike == "")
                  alert("Please choose a Like!!");
              else
                  alert("Your Like is: " + slike);
    •     }
         
          function getValue2()
          {
              var obj = document.getElementById("File1").value;//文件上传路径,FF 3上可能会有问题
              var obj2 = document.getElementById("select1").value;//下拉框
             
              alert(obj + "/r" + obj2);
          }
          </script>
    • </head>
      <body>
          <form id="form1" action="getValue.aspx" method="post">
              <div>
                  <ul>
                      HTML控件:
                      <li>文本框:
                          <input id="Text1" name="textName" /></li><!--type="text"可以不写,默认值-->
                      <li>密码框:
                          <input id="Password1" type="password" name="pwd" /></li>
                      <li>隐藏框:
                          <input id="Hidden1" type="hidden" name="hidden" value="abcde" /></li>
                      <li>单选框:
                          <input type="radio" name="sex" value="男" />男<input type="radio" name="sex" value="女" />女</li>
                      <li>复选框:
                          <input id="Checkbox1" type="checkbox" name="like" value="1" />足球<input id="Checkbox2"
                              type="checkbox" name="like" value="2" />篮球<input id="Checkbox3" type="checkbox" name="like"
                                  value="3" />排球<input id="Checkbox4" type="checkbox" name="like" value="4" />台球</li>
                      <li>多行文本框:
                          <textarea id="TextArea1" cols="20" rows="2" name="txtArea"></textarea></li>
                      <li>普通按钮:
                          <input id="Button1" type="button" value="button" name="btn" οnclick="getValue()" /></li>
                      <li>提交按钮:
                          <input id="Submit1" type="submit" value="submit" name="btnSubmit" /></li>
                      <li>清空按钮:
                          <input id="Reset1" type="reset" value="reset" name="btnCancel" /></li>
                  </ul>
              </div>
              <hr />
              <div>
                  <ul>
                      <li>
                          文件上传:<input id="File1" type="file" name="file" /></li>
                      <li>下拉框:
                          <select id="Select1" name="select">
                              <option value="1北京">北京</option>
                              <option value="2上海">上海</option>
                              <option value="3山东">山东</option>
                          </select>
                      </li>
                      <li>
                          <img src="image/logo-yy.gif" alt="aaa" title="baidu" /></li>
                      <li>
                          <input id="Button2" type="button" value="button" name="btn2" οnclick="getValue2()" /></li>
                      <li>
                          <span id="test">aaaaaaa</span>
                      </li>
                  </ul>
              </div>
          </form>
      </body>
      </html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值