Mar 22, 2013, 8:07 AM
BootStrap With Ext.Net
HI ,
I am trying to use Bootstrap in Ext.net, but it is not working properly, can you give any resource how to integrate bootstrap with ext.net? if possible
see the below sample i have tried with bootstrap, but am unable to get the Radiobutton.
I am trying to use Bootstrap in Ext.net, but it is not working properly, can you give any resource how to integrate bootstrap with ext.net? if possible
see the below sample i have tried with bootstrap, but am unable to get the Radiobutton.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebAppBootStrap.WebForm1" %>
<!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></title>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.indcls
{
display: inline-block;
width: auto;
height: 22px;
min-width: 20px;
padding: 4px 2px;
font-size: 14px;
font-weight: normal;
line-height: 10px;
text-align: center;
text-shadow: 0 1px 0 #ffffff;
background-color: #eeeeee;
border: 0px solid #ccc;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
margin-left: -20px;
margin-top: -5px;
-webkit-border-radius: 0 4px 4px 0;
-moz-border-radius: 0 4px 4px 0;
border-radius: 0 4px 4px 0;
}
</style>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
this.strsamp.DataSource = new object[]
{
new object[] { "TaxGroup1","Yes" },
new object[] { "TaxGroup2","Yes" },
new object[] { "TaxGroup3","No"},
new object[] { "TaxGroup4","Yes"}
};
this.strsamp.DataBind();
}
protected void show(object sender,EventArgs e)
{
pnl.Hidden = false;
}
public void close(object sender, EventArgs e)
{
pnl.Hidden = true;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager runat="server">
</ext:ResourceManager>
<ext:TextField runat="server" Cls="icon-envelope">
</ext:TextField>
<ext:Button runat="server" Text="<b>Save</b>" MarginSpec="10 0 0 0" Cls="btn btn-small btn-primary">
</ext:Button>
<ext:LinkButton runat="server" Text="Click Me" Cls="active" MarginSpec="10 0 0 0"
OnDirectClick="show">
</ext:LinkButton>
<ext:Panel runat="server" ID="pnl" Border="false" Hidden="true" BodyCls="alert">
<Content>
<button type="button" class="close" data-dismiss="alert" runat="server" id="htmlbtn"
onserverclick="close">
×</button>
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</Content>
</ext:Panel>
<ext:GridPanel ID="gpsamp" runat="server" Border="false" MarginSpec="10 0 0 0" Width="950"
BodyCls="table table-bordered">
<Store>
<ext:Store ID="strsamp" runat="server" PageSize="7">
<Model>
<ext:Model ID="mdlsamp" runat="server">
<Fields>
<ext:ModelField Name="name">
</ext:ModelField>
<ext:ModelField Name="status">
</ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:RowNumbererColumn ID="RowNumbererColumn1" runat="server" Width="45" />
<ext:TemplateColumn ID="TemplateColumn1" runat="server" Text="<b>Product Image<b/>"
Flex="10" Width="60" DataIndex="url" TemplateString='<img style="width:50px;height:40px;" class="thumbnail" src="img/Trio-Icon.jpg" />'>
</ext:TemplateColumn>
<ext:Column ID="clmname" runat="server" Text="<b>Group Name</b>" DataIndex="name"
Width="200">
</ext:Column>
<ext:Column ID="clmdisplay" runat="server" Text="<b>Display</b>" DataIndex="status"
Width="230">
</ext:Column>
<ext:CommandColumn ID="CommandColumn1" runat="server" Width="350">
<Commands>
<ext:CommandSeparator />
<ext:GridCommand CommandName="Edit" Text=" " Icon="NoteEdit" MinWidth="40">
<ToolTip Text="Edit" />
</ext:GridCommand>
<ext:CommandSeparator />
<ext:GridCommand CommandName="Delete" Text=" " Icon="Delete" MinWidth="40">
<ToolTip Text="Delete" />
</ext:GridCommand>
</Commands>
</ext:CommandColumn>
</Columns>
</ColumnModel>
<BottomBar>
<ext:PagingToolbar ID="PagingToolbar1" runat="server" />
</BottomBar>
</ext:GridPanel>
<ext:NumberField runat="server" IndicatorText="$" IndicatorCls="indcls" MarginSpec="15 0 0 05" EmptyText="Enter Amount" HideTrigger="true">
</ext:NumberField>
<ext:Container ID="cn1" runat="server" PreventBodyReset="true">
<Content>
<ext:Radio runat="server" ID="r1" BoxLabel="kkkkk" MarginSpec="0 0 0 20">
</ext:Radio>
</Content>
</ext:Container>
</div>
</form>
</body>
</html>
Originally Posted by RCN
