将bootstrap代码与.aspx.cs文件链接

时间:2014-05-17 18:00:52

标签: c# asp.net twitter-bootstrap-3 visual-studio-2013

任何人都可以告诉我如何将我在bootstrap 3.1.1中编写的代码与我的aspx.cs文件中的代码链接起来。 我基本上想要做的是使用他们的ID访问.aspx.cs文件中的不同元素(bootstrap设计)。

例如,我有这个HTML代码:

 <div class="panel panel-success" style="margin-top:100px;margin-left:50px">
        <div class="panel-heading" style="font-size:16px">   To-Do List </div>
        <ol class="list=group" id="list1">
                <li class="list-group-item"> Complete HCI Assignment </li>
                <li class="list-group-item"> Complete BE Assignment </li>
                <li class="list-group-item"> Complete Programming Task </li>
                <li class="list-group-item"> Send Code Correction </li>
        </ol>
        <div class="panel-body">
            <button class="btn btn-default btn-success btn-sm" style="margin-left:65px;
              margin-right:10px" id="b1">
                <span class="glyphicon glyphicon-plus"></span> Add Task
            </button>
            <button class="btn btn-default btn-success btn-sm" id="b2"> 
             <span class="glyphicon glyphicon-remove"></span> Remove Task
            </button>
       </div>
    </div> 

我想在此面板中显示数据库(SQL Server)中的数据。我该怎么做呢?

1 个答案:

答案 0 :(得分:1)

为了访问代码隐藏文件中的HTML控件,您需要使用ASP.NET服务器控件。要改进现有网页,您需要使用带有runat =&#34;服务器&#34;的表单标记将所有服务器控件括起来。属性。然后,您可以在表单内的任何位置添加服务器控件,例如带有ID&#34; ServerControl&#34;的标签。如下所示。请注意,只有一个表单使用runat =&#34; server&#34;属性可以存在于网页上。

<form runat="server">
<div class="panel panel-success" style="margin-top:100px;margin-left:50px">
    <div class="panel-heading" style="font-size:16px">   To-Do List </div>
    <ol class="list=group" id="list1">
        <% foreach(var task in tasks) { %>
            <li class="list-group-item"> <%=task.name&> </li>
        <% } %>
    </ol>
    <asp:Label runat="server" ID="ServerControl" Text="results" />
    <div class="panel-body">
        <button class="btn btn-default btn-success btn-sm" style="margin-left:65px;
          margin-right:10px" id="b1">
            <span class="glyphicon glyphicon-plus"></span> Add Task
        </button>
        <button class="btn btn-default btn-success btn-sm" id="b2"> 
         <span class="glyphicon glyphicon-remove"></span> Remove Task
        </button>
   </div>
</div>
</form>

http://www.w3schools.com/aspnet/aspnet_controls.asp

您的代码可以执行SQL查询并更新网页上的服务器控件。我已经添加了C#标记,它将从一系列任务中输出一个列表&#39;。在加载Web表单期间,将从SQL填充该集合。