带有twitter bootstrap组件的基本asp.net表单

时间:2012-04-17 18:24:51

标签: asp.net twitter-bootstrap

你们有一个在基本的asp.net表单上工作的bootstrap组件的例子(按钮背后的代码,获取下拉选择的值等)?

我真的不知道如何让它发挥作用。

2 个答案:

答案 0 :(得分:9)

只要您了解ASP.NET服务器控件如何在HTML中呈现

示例:

此服务器控件:

<asp:Button ID="Button1" runat="server" CssClass="btn" Text="Button 1" />

呈现此HTML:

<input type="submit" class="btn" id="Button1" value="Button 1" name="Button1">

然后您就开始使用带有ASP.NET webforms的引导程序

CssClass="btn"就是用引导程序设置按钮样式所需的全部内容。

将下面的标记粘贴到.ASPX页面中以查看示例

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="Button1" runat="server" CssClass="btn" Text="Button 1" />
    </div>
    </form>
</body>
</html>

修改

您可以通过添加runat="server"将任何标准HTML控件转换为服务器控件,然后添加服务器端的Click事件处理程序。

HTML:

<a id="actionLink" runat="server">Action</a>

代码隐藏:

protected void Page_Load(object sender, EventArgs e)
{
    actionLink.ServerClick += new EventHandler(actionLink_ServerClick);
    ...
}

void actionLink_ServerClick(object sender, EventArgs e)
{
    ...
}

渲染锚标记:

<a id="actionLink" href="javascript:__doPostBack('actionLink','')">Action</a>

这可以帮助您获得在这些按钮下拉列表和无线电引导控件上实现服务器点击所需的功能。

答案 1 :(得分:0)

在GitHub上可以找到几乎完整的Pedro Fernandes提供的ASP.NET Bootstrap控件,但不确定许可证:

https://github.com/cr1t/BootstrapControls

它仅支持2.3.0版。将它转换为3.0应该不难。