Web表单和Web表单与母版页之间的区别？

时间：2014-06-11 16:33:32

标签： asp.net forms webforms visual-studio-2013 site.master

我刚开始使用网络应用程序。我目前正在使用visual studio 2013，我已经创建了一个Web应用程序。我希望有一个员工填写的表单，然后当他们点击提交时，表单将添加，更改或从数据库中删除。从研究开始，我最初尝试制作一个网络表格。这不允许我保留在我的母版页上进行的格式化，当我尝试将其连接到母版页时由于<form>而不允许它。然后我创建了一个包含母版页的Web表单。这允许我保留主页面的格式，但现在我无法使用<form>创建表单。所以我的问题是如何创建一个表单，该表单将提交并仍保留主页面的格式？

母版页：

 <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="WebApplication1.SiteMaster" %>

<!DOCTYPE html>

<html lang="en">
<head runat="server">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title><%: Page.Title %> Employee Information</title>

    <asp:PlaceHolder runat="server">
        <%: Scripts.Render("~/bundles/modernizr") %>
    </asp:PlaceHolder>
    <webopt:bundlereference runat="server" path="~/Content/css" />
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />

</head>
<body>
    <form runat="server">
        <asp:ScriptManager runat="server">
            <Scripts>
                <%--To learn more about bundling scripts in ScriptManager see http://go.microsoft.com/fwlink/?LinkID=301884 --%>
                <%--Framework Scripts--%>
                <asp:ScriptReference Name="MsAjaxBundle" />
                <asp:ScriptReference Name="jquery" />
                <asp:ScriptReference Name="bootstrap" />
                <asp:ScriptReference Name="respond" />
                <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js" />
                <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebUIValidation.js" />
                <asp:ScriptReference Name="MenuStandards.js" Assembly="System.Web" Path="~/Scripts/WebForms/MenuStandards.js" />
                <asp:ScriptReference Name="GridView.js" Assembly="System.Web" Path="~/Scripts/WebForms/GridView.js" />
                <asp:ScriptReference Name="DetailsView.js" Assembly="System.Web" Path="~/Scripts/WebForms/DetailsView.js" />
                <asp:ScriptReference Name="TreeView.js" Assembly="System.Web" Path="~/Scripts/WebForms/TreeView.js" />
                <asp:ScriptReference Name="WebParts.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebParts.js" />
                <asp:ScriptReference Name="Focus.js" Assembly="System.Web" Path="~/Scripts/WebForms/Focus.js" />
                <asp:ScriptReference Name="WebFormsBundle" />
                <%--Site Scripts--%>
            </Scripts>
        </asp:ScriptManager>

        <div class="navbar navbar-inverse navbar-fixed-top">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <!--<a class="navbar-brand" runat="server" href="~/">Employee Information</a>-->
                </div>
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li><a runat="server" href="~/HomePage">Home</a></li>
                        <!--<li><a runat="server" href="~/About">About</a></li>-->
                        <li><a runat="server" href="~/EmployeeInput">Add Employee</a></li>
                        <li><a runat="server" href="~/EditEmployee">Edit Information</a></li>
                        <li><a runat="server" href="~/Terminate">Terminate Employee</a></li>
                    </ul>
                    <asp:LoginView runat="server" ViewStateMode="Disabled">
                        <AnonymousTemplate>
                            <ul class="nav navbar-nav navbar-right">
                                <li><a runat="server" href="~/Account/Register">Register</a></li>
                                <li><a runat="server" href="~/Account/Login">Log in</a></li>
                            </ul>
                        </AnonymousTemplate>
                        <LoggedInTemplate>
                            <ul class="nav navbar-nav navbar-right">
                                <li><a runat="server" href="~/Account/Manage" title="Manage your account">Hello, <%: Context.User.Identity.GetUserName()  %> !</a></li>
                                <li>
                                    <asp:LoginStatus runat="server" LogoutAction="Redirect" LogoutText="Log off" LogoutPageUrl="~/" OnLoggingOut="Unnamed_LoggingOut" />
                                </li>
                            </ul>
                        </LoggedInTemplate>
                    </asp:LoginView>
                </div>
            </div>
        </div>
        <div class="container body-content">
            <asp:ContentPlaceHolder ID="MainContent" runat="server">
            </asp:ContentPlaceHolder>
            <hr />
            <footer>
                <p>&copy; <%: DateTime.Now.Year %> </p>
            </footer>
        </div>
    </form>
</body>
</html>

网络表单

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="WebApplication1.WebForm3" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <div id="Column1" style="height:355px;width:250px;float:left;">
        First Name: <input type="text" name="FirstName" />
        First Name: <input type="text" name="FirstName" />
        First Name: <input type="text" name="FirstName" />
        First Name: <input type="text" name="FirstName" />
        First Name: <input type="text" name="FirstName" />
        First Name: <input type="text" name="FirstName" />
        First Name: <input type="text" name="FirstName" />
        First Name: <input type="text" name="FirstName" />
        First Name:&nbsp; <input type="text" name="FirstName1" size="20" />
        <select id="Select1" name="D1">
            <option>This</option>
            <option>That</option>
            <option>The other thing</option>
        </select></div>
    <div id="Column2" style="height:355px;width:250px;float:left;">
        First Name: <input type="text" name="FirstName2" size="20" />
        First Name: <input type="text" name="FirstName3" size="20" />
        First Name: <input type="text" name="FirstName4" size="20" />
        First Name: <input type="text" name="FirstName5" size="20" />
        First Name: <input type="text" name="FirstName6" size="20" />
        First Name: <input type="text" name="FirstName7" size="20" />
        First Name: <input type="text" name="FirstName8" size="20" />
        First Name: <input type="text" name="FirstName9" size="20" />
        First Name: <input type="text" name="FirstName10" size="20" />
    </div>
    </body>
</html>

我希望将我的网络表单正文中的所有内容都作为表单。

2 个答案:

答案 0 :(得分：6)

您只能在复合页面（页面+母版页）上拥有一个具有runat="server"属性的表单。

解决方案是将表单放在母版页中，并将内容占位符放在表单中。 Page本身并不需要拥有内容并在内部声明标记。执行页面时，页面和母版页的标记将合并为一个发送给客户端的HTML文件。

示例母版页：

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="Site" %>

<!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>Working with Data Tutorials</title>
    <link href="Styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="wrapper">

        <form id="form1" runat="server">

            <div id="header">
                <span class="title">Working with Data Tutorials</span>
                <span class="breadcrumb">TODO: Breadcrumb will go here...</span>
            </div>

            <div id="content">
                <asp:contentplaceholder id="MainContent" runat="server">
                  <!-- Page-specific content will go here... -->
                </asp:contentplaceholder>
            </div>

            <div id="navigation">
                TODO: Menu will go here...
            </div>
        </form>
    </div>
</body>
</html>

示例内容页面：

<%@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" Title="Home" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" Runat="Server">
    <h1>Welcome to the Working with Data Tutorial Site</h1>

    <p>This site is being built as part of a set of tutorials that illustrate some of the new data access and databinding features in ASP.NET 2.0 and Visual Web Developer.</p>

<asp:TextBox runat="server" id="TextBox1" /><br />
<asp:TextBox runat="server" id="TextBox2" /><br />
<asp:Button runat="server" id="Btn1" OnClick="Btn1_Click" Text="Click to submit!" />

        </asp:Content>

在页面背后的代码（.cs文件）上，您可以从文本框中读取值，如下所示：

protected void Btn1_Click(object sender, EventArgs e)
{
    string sometext=TextBox1.Text;
    string somemoretext=TextBox2.Text;
}

示例from MSDN。

答案 1 :(得分：0)

两者都相同但如果您使用母版页创建Webform Visual Studio隐式添加母版页的引用

<%@ Page Title="" Language="C#" MasterPageFile="~/My.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="project.WebForm1" %>

如果您创建了Webform，则不会添加Master Page甚至Master Page的引用。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="project.Bhand" %>
相关问题
最新问题