i read so many solutions and blogs on this but still not able to get it done.
I have a Repeater in my code, which has labels in ItemTemplate. I need to do a client side validation (using jQuery) on the values entered in the TextBox on a button click event. i have some value in my label which I want to access to make comparision between the values entered in the textbox and text of label. Now I added a custom attribute named datakey to the label and textbox both, so that comparision is easy.
I access the text box and get the datakey attribute.
I get the label with the datakey value same as that of textbox and do my comparision.
Now in Jquery I am not able to access that label.
This is what i wrote in Jquery:
var lbl = $("label").find("[datakey='" + expID + "']");
ASP Code.
<table class="tblDispData">
<asp:Repeater ID="PrjBudgetDetails" runat="server" ClientIDMode="Static">
<HeaderTemplate>
<tr>
<th class="thDataDisp">
<asp:Label ID="LbExpType" runat="server" Text="Expenditure Type" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
<th class="thDataDisp">
<asp:Label ID="LbAllocatedBudget" runat="server" Text="Allocated Budget" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
<th class="thDataDisp">
<asp:Label ID="LbAvailedBudget" runat="server" Text="Available Budget" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
<th class="thDataDisp">
<asp:Label ID="LbRequestedBudget" runat="server" Text="Budget Requested" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td class="tdDataDisp">
<asp:Label ID="ExpTypeText" runat="server" Text='<%#Eval("ExpType") %>' CssClass="LbTblDataDisp"
AssociatedControlID="BudgetRequestedText"></asp:Label>
</td>
<td class="tdDataDisp">
<asp:Label ID="BudgetAllocatedText" runat="server" Text='<%#Eval("BudgetAllocated") %>'
CssClass="LbTblDataDisp" AssociatedControlID="BudgetRequestedText"></asp:Label>
</td>
<td class="tdDataDisp">
<asp:Label ID="BudgetAvailableText" runat="server" dataKey='<%#Eval("ExpID") %>'
Text='<%#Convert.ToDouble(Eval("BudgetAllocated")) - Convert.ToDouble(Eval("BudgetAvailed")) %>'
CssClass="LbTblDataDisp" ClientIDMode="Static" AssociatedControlID="BudgetRequestedText"></asp:Label>
</td>
<td class="tdDataDisp">
<asp:TextBox ID="BudgetRequestedText" runat="server" dataKey='<%#Eval("ExpID") %>'
dataValue='<%#Eval("ExpType") %>' CssClass="tblDataInput"></asp:TextBox>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
<tr>
<td colspan="3">
<span id="Legend1" class="frmInstructions" runat="server">Please enter zero(0) if not
requesting budget for any particular expenditure. The currency is INR. </span>
</td>
<td>
<asp:Button ID="prjBudgetSubmitBtn" runat="server" Text="Submit Budget" CssClass="formNext"
ClientIDMode="Static" OnClick="prjBudgetSubmitBtn_Click" />
</td>
</tr>
</table>
The RESULTING MARKUP HERE
<table class="tblDispData">
<tr>
<th class="thDataDisp">
<span id="LbExpType" class="LbTblDataDisp" style="font-weight:bold;">Expenditure Type</span>
</th>
<th class="thDataDisp">
<span id="LbAllocatedBudget" class="LbTblDataDisp" style="font-weight:bold;">Allocated Budget</span>
</th>
<th class="thDataDisp">
<span id="LbAvailedBudget" class="LbTblDataDisp" style="font-weight:bold;">Available Budget</span>
</th>
<th class="thDataDisp">
<span id="LbRequestedBudget" class="LbTblDataDisp" style="font-weight:bold;">Budget Requested</span>
</th>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Hardware</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP001">7</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl01$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP001" dataValue="Hardware" dataAmount="7" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Software</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP002">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl02$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP002" dataValue="Software" dataAmount="9" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Software AMC</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP003">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl03$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP003" dataValue="Software AMC" dataAmount="9" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Hardware AMC</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP004">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl04$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP004" dataValue="Hardware AMC" dataAmount="9" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">UPS</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP006">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl05$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP006" dataValue="UPS" dataAmount="9" />
</td>
</tr>
<tr>
<td colspan="3">
<span id="pageMainContent_Legend1" class="frmInstructions">Please enter zero(0) if not
requesting budget for any particular expenditure. The currency is INR. </span>
</td>
<td>
<input type="submit" name="ctl00$pageMainContent$prjBudgetSubmitBtn" value="Submit Budget" id="prjBudgetSubmitBtn" class="formNext" />
</td>
</tr>
</table>
Thanks in advance.
Following code will give you the related label.
$("label[dataKey='" + expID + "']")
Demo
Related
So basically i have Web page form named Lab4.aspx but everytime i pressed button, it will always direct to script runat="server" and not the aspx.cs,also the button is changed back to Button_1 when i changed it to BtnSubmit
<script runat="server">
Protected Sub Button1_Click(sender As Object, e As EventArgs)
End Sub
</script>
For the aspx.cs, i already changed the public partial class to public partial class Lab4: System.Web.UI.Page in the aspx.cs and also name the file to Lab4.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class Lab4 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void BtnSubmit_Click(object sender, EventArgs e)
It would be great if this mystery can be solved because i have tried search for this solution everywhere
Here's the code for the button control on aspx page
<asp:Button ID="BtnSubmit" runat="server" onclick="Button1_Click" Text="Submit"
Width="85px" />
and this is the full code for aspx page
<script runat="server">
Protected Sub Button1_Click(sender As Object, e As EventArgs)
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.style1
{
font-size: xx-large;
font-family: "Tw Cen MT";
height: 1161px;
}
.style2
{
text-decoration: underline;
}
.style3
{
font-size: x-large;
background-color: #9933FF;
}
.style4
{
width: 100%;
}
.style5
{
width: 243px;
}
.style6
{
width: 609px;
}
.style7
{
width: 243px;
height: 32px;
}
.style8
{
width: 609px;
height: 32px;
background-color: #FFFFFF;
}
.style9
{
height: 32px;
}
.style10
{
background-color: #9966FF;
}
.style11
{
width: 243px;
height: 31px;
}
.style12
{
width: 609px;
height: 31px;
}
.style13
{
height: 31px;
}
.style14
{
width: 303px;
font-size: x-large;
}
.style15
{
width: 303px;
height: 41px;
}
.style16
{
height: 41px;
}
.style17
{
font-size: x-large;
}
.style20
{
width: 254px;
}
.style21
{
width: 254px;
height: 41px;
}
.style22
{
width: 243px;
height: 45px;
}
.style23
{
width: 609px;
height: 45px;
}
.style24
{
height: 45px;
}
.style25
{
width: 303px;
font-size: x-large;
height: 32px;
}
.style26
{
width: 254px;
height: 32px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="style1">
Nasi Tapau O<span class="style2">nline Order
</span>
<br />
<br />
<span class="style3"><span class="style10">Customer's Details
</span>
<br />
<table class="style4">
<tr>
<td class="style5">
Name :
</td>
<td class="style6">
<span class="style3">
<asp:TextBox ID="TxtName" runat="server" Width="545px"></asp:TextBox>
</span>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="style7">
</td>
<td class="style8">
</td>
<td class="style9">
</td>
<td class="style9">
</td>
</tr>
<tr>
<td class="style5">
Contact Number :</td>
<td class="style6">
<span class="style3">
<asp:TextBox ID="TxtContactNo" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
</td>
<td class="style6">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
Email :</td>
<td class="style6">
<span class="style3">
<asp:TextBox ID="TxtEmail" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="style7">
</td>
<td class="style8">
</td>
<td class="style9">
</td>
<td class="style9">
</td>
</tr>
<tr>
<td class="style5">
Order Details :</td>
<td class="style6">
</td>
<td>
Quantity :
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
</td>
<td class="style6">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
Rice :</td>
<td class="style6">
<asp:RadioButton ID="RBYes" runat="server" Text="Yes" />
<span class="style3"><asp:RadioButton ID="RBNo" runat="server"
style="background-color: #FFFFFF" Text="No" />
</span>
</td>
<td>
<span class="style3">
<asp:TextBox ID="TxtQRice" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style22">
</td>
<td class="style23">
</td>
<td class="style24">
</td>
<td class="style24">
</td>
</tr>
<tr>
<td class="style5">
Side Dishes :</td>
<td class="style6">
<asp:CheckBox ID="CBChicken" runat="server" style="background-color: #FFFFFF" Text="Chicken Curry - RM4.50" />
</td>
<td>
<span class="style3">
<asp:TextBox ID="TxtQChicken" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style7">
</td>
<td class="style8">
<span class="style3">
<asp:CheckBox ID="CBMixed" runat="server" OnCheckedChanged="CBMixed_CheckedChanged" style="background-color: #FFFFFF" Text="Mixed Vegetables - RM2.50" />
</span>
</td>
<td class="style9">
<span class="style3">
<asp:TextBox ID="TxtQMixed" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td class="style9">
</td>
</tr>
<tr>
<td class="style5">
</td>
<td class="style6">
<span class="style3">
<asp:CheckBox ID="CBGrilled" runat="server" style="background-color: #FFFFFF" Text="Grilled Fish - RM4.00" />
</span>
</td>
<td>
<span class="style3">
<asp:TextBox ID="TxtQGrilled" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style7">
</td>
<td class="style8">
<span class="style3">
<asp:CheckBox ID="CBCondiment" runat="server" style="background-color: #FFFFFF" Text="Condiment - RM1.50" />
</span>
</td>
<td class="style9">
<span class="style3">
<asp:TextBox ID="TxtQCondiment" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td class="style9">
</td>
</tr>
<tr>
<td class="style5">
Beverages :</td>
<td class="style6">
<span class="style3">
<asp:CheckBox ID="CBMangoJ" runat="server" style="background-color: #FFFFFF" Text="Mango Juice - RM3.00" />
</span>
</td>
<td>
<span class="style3">
<asp:TextBox ID="TxtMangoJuice" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
</td>
<td class="style6">
<span class="style3">
<asp:CheckBox ID="CBCendol" runat="server" style="background-color: #FFFFFF" Text="Cendol - RM3.00" />
</span>
</td>
<td>
<span class="style3">
<asp:TextBox ID="TxtCendol" runat="server" Width="165px"></asp:TextBox>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
</td>
<td class="style6">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="style11">
Delivery:</td>
<td class="style12">
<asp:DropDownList ID="DdlDelivery" runat="server">
<asp:ListItem Value="0">Self-pickup</asp:ListItem>
<asp:ListItem Value="1.50">Request For Delivery</asp:ListItem>
</asp:DropDownList>
</td>
<td class="style13">
</td>
<td class="style13">
</td>
</tr>
<tr>
<td class="style11">
</td>
<td class="style12">
</td>
<td class="style13">
<asp:Button ID="BtnSubmit" runat="server" onclick="Button1_Click" Text="Submit"
Width="85px" />
</td>
<td class="style13">
</td>
</tr>
</table>
<br />
<br />
<asp:Label ID="Label1" runat="server" style="background-color: #9966FF"
Text="Thank you for choosing us! Here are you order details :"></asp:Label>
<br />
<br />
</span>
<table class="style4">
<tr>
<td class="style14">
<span class="style17">Name :
</td>
<td class="style20">
<asp:Label ID="lblName" runat="server" Font-Size="X-Large"></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
Telephone :</td>
<td class="style20">
<span class="style17">
<asp:Label ID="LblTel" runat="server"></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
Email :</td>
<td class="style20">
<span class="style17">
<asp:Label ID="lblEmail" runat="server"></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td style="font-size: x-large">
Quantity :</td>
</tr>
<tr>
<td class="style25">
Rice :</td>
<td class="style26">
<span class="style17">
<asp:Label ID="lblRice" runat="server"></asp:Label>
</span>
</td>
<td class="style9">
<span class="style17">
<asp:Label ID="lblQRice" runat="server"></asp:Label>
</span>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
Side Dishes :</td>
<td class="style20">
<span class="style17">
<asp:Label ID="Label6" runat="server" Visible="False"></asp:Label>
</span>
</td>
<td>
<span class="style17">
<asp:Label ID="Label16" runat="server" Visible="False"></asp:Label>
</span>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
<span class="style17">
<asp:Label ID="Label7" runat="server" Visible="False"></asp:Label>
</span>
</td>
<td>
<span class="style17">
<asp:Label ID="Label17" runat="server" Visible="False"></asp:Label>
</span>
</td>
</tr>
<tr>
<td class="style15">
</td>
<td class="style21">
<span class="style17">
<asp:Label ID="Label8" runat="server" Visible="False"></asp:Label>
</span>
</td>
<td class="style16">
<span class="style17">
<asp:Label ID="Label18" runat="server" Visible="False"></asp:Label>
</span>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
<span class="style17">
<asp:Label ID="Label9" runat="server" Visible="False"></asp:Label>
</span>
</td>
<td>
<span class="style17">
<asp:Label ID="Label19" runat="server" Visible="False"></asp:Label>
</span>
</td>
</tr>
<tr>
<td class="style14">
Beverages :</td>
<td class="style20">
<span class="style17">
<asp:Label ID="lblMangoJ" runat="server"></asp:Label>
</span>
</td>
<td>
<span class="style17">
<asp:Label ID="lblQMangoJ" runat="server"></asp:Label>
</span>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
<span class="style17">
<asp:Label ID="lblCendol" runat="server"></asp:Label>
</span>
</td>
<td>
<span class="style17">
<asp:Label ID="lblQCendol" runat="server"></asp:Label>
</span>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
Delivery Method :</td>
<td class="style20">
<span class="style17">
<asp:Label ID="lblDelivery" runat="server"></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
Total :</td>
<td class="style20">
<span class="style17">
<asp:Label ID="lblTotal" runat="server"></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
Grand Total(Inclusive GST) :</td>
<td class="style20">
<span class="style17">
<asp:Label ID="lblTotalWGST" runat="server"></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
<tr>
<td class="style14">
</td>
<td class="style20">
</td>
<td>
</td>
</tr>
</table>
<br />
<br />
</div>
</form>
</body>
</html>
Your aspx page should actually start with something like this.
<%# Page Title="" Language="C#" MasterPageFile="" AutoEventWireup="true" CodeBehind="Lab4.aspx.cs" Inherits="" %>
CodeBehind="Lab4.aspx.cs" is the place where you specify which is your code behind file in C#.
Every aspx will have a page directive which will tell compiler where to look for its code file
<%# Page CodeFile="Lab4.aspx.cs" %>
documentation
I have checkboxlist within a table I am using. The checklist I need to line up with checkboxes in the second column. The spacing of each row of the textboxes(second row) is 26px. I can not find how to do spacing between items on checkbox list. Setting margins only does the outside of the list not items within.
I tried cellspacing but I cant get it quite lined up.
Update 2
<td style="vertical-align: top" rowspan="7" Width="175" style="padding: 0;">
<asp:CheckBoxList ID="cbtasklist" runat="server" CssClass="radiobutton">
<asp:ListItem Value="Task 1">Task 1</asp:ListItem>
<asp:ListItem Value="Task 2">Task 2</asp:ListItem>
<asp:ListItem Value="Task 3">Task 3</asp:ListItem>
<asp:ListItem>Task 4</asp:ListItem>
<asp:ListItem Value="Task 5">Task 5</asp:ListItem>
<asp:ListItem Value="Other1">Other</asp:ListItem>
<asp:ListItem Value="Other2">Other</asp:ListItem>
</asp:CheckBoxList>
</td>
<td class="auto-style187" style="vertical-align: top" colspan="2">
</td>
.auto-style187 {
height: 26px;
width: 357px;
}
Update 3:
Would it be easier to do a checkbox for each line so I can use the same CSS as the other column?
The reason for the checkbox list is for validation that 1 must be selected.
I hope you are looking for this
<form id="form1" runat="server">
<div style="width: 100%">
<table class="auto-style1">
<tr>
<td class="auto-style3">
<asp:CheckBoxList ID="CheckBoxList1" runat="server" Height="163px">
<asp:ListItem>a</asp:ListItem>
<asp:ListItem>b</asp:ListItem>
<asp:ListItem>c</asp:ListItem>
<asp:ListItem>d</asp:ListItem>
<asp:ListItem>e</asp:ListItem>
<asp:ListItem>f</asp:ListItem>
</asp:CheckBoxList>
</td>
<td class="auto-style8">
<table class="auto-style1">
<tr>
<td class="auto-style5">
<asp:TextBox ID="TextBox1" runat="server" OnTextChanged="TextBox1_TextChanged"></asp:TextBox>
</td>
<td>aaaa</td>
</tr>
<tr>
<td class="auto-style6">
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</td>
<td class="auto-style7">aaaa</td>
</tr>
<tr>
<td class="auto-style5">
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
</td>
<td>aaaa</td>
</tr>
<tr>
<td class="auto-style10">
<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
</td>
<td class="auto-style11">aaaa</td>
</tr>
<tr>
<td class="auto-style12">
<asp:TextBox ID="TextBox5" runat="server"></asp:TextBox>
</td>
<td class="auto-style13">aaaa</td>
</tr>
<tr>
<td class="auto-style5">
<asp:TextBox ID="TextBox6" runat="server" OnTextChanged="TextBox6_TextChanged"></asp:TextBox>
</td>
<td>aaaa</td>
</tr>
</table>
</td>
<td class="auto-style4"></td>
</tr>
<tr>
<td class="auto-style2"> </td>
<td class="auto-style9"> </td>
<td> </td>
</tr>
<tr>
<td class="auto-style2"> </td>
<td class="auto-style9"> </td>
<td> </td>
</tr>
<tr>
<td class="auto-style14"></td>
<td class="auto-style15"></td>
<td class="auto-style11"></td>
</tr>
<tr>
<td class="auto-style2"> </td>
<td class="auto-style9"> </td>
<td> </td>
</tr>
</table>
</div>
</form>
see the image
I just took table inside a table .You can just remove the unwanted column as your desire
don't forget to edit the text box lineup its up to you
why don't you try with this on your CSS:
checkbox { padding-bottom: 10px; }
enter code![as you can see here the tabs are half eaten!][1] here
Hello, I have a problem with showing the tab stripe I don't know what is wrong with it. can any one help? when I run this the tabs are not fully shown I have three tabs and I tried this with different browsers but the issue persists.
below is a sample of the code:
<asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" BackColor="#62A5C8" BorderStyle="none" ForeColor="#ffffff" Height="450px" server="" Style=" background-color:#012F54; margin-top: 0px;" Width="100%" ScrollBars="Both" Font-Size="Medium"
ToolTip="Move between tabs to fill-in all information">
<asp:TabPanel runat="server" HeaderText="Student Information" ID="TabPanel1">
<ContentTemplate>
<asp:UpdatePanel ID="updatePanel1" runat="server">
<ContentTemplate>
<table class="auto-style15">
<tr>
<td class="auto-style27">
<br />
<span class="auto-style117">First Name:<br /> </span>
</td>
<td class="auto-style21">
<br />
<strong>
<asp:TextBox ID="TextBox1" runat="server" BorderColor="Black" BorderStyle="Solid" Height="23px" Width="198px" CssClass="auto-style116"></asp:TextBox>
</strong>
</td>
<td> </td>
</tr>
<tr>
<td class="auto-style28"> </td>
<td class="auto-style21"> </td>
<td> </td>
</tr>
<tr>
<td class="auto-style117">Last Name:</td>
<td class="auto-style24"><strong>
<asp:TextBox ID="TextBox2" runat="server" BorderStyle="Solid" Height="21px" Width="198px" BorderColor="Black" CssClass="auto-style116"></asp:TextBox>
</strong>
</td>
<td class="auto-style25"></td>
</tr>
<tr>
<td class="auto-style17"></td>
<td class="auto-style20"></td>
<td class="auto-style18"></td>
</tr>
<tr>
<td class="auto-style27" style="font-size: small; color: #043d5d">Student ID:</td>
<td class="auto-style21"><strong>
<asp:TextBox ID="TextBox3" runat="server" BorderStyle="Solid" Height="23px" Width="198px" BorderColor="Black" CssClass="auto-style116"></asp:TextBox>
</strong>
</td>
<td> </td>
</tr>
<tr>
<td class="auto-style28"> </td>
<td class="auto-style21"> </td>
<td> </td>
</tr>
<tr>
<td class="auto-style27" style="font-size: small; color: #043d5d">Department:</td>
<td class="auto-style21"><strong>
<asp:DropDownList ID="DropDownList1" runat="server" Height="27px" Width="295px" style="margin-left:7px;">
<asp:ListItem>Cardiac Technology</asp:ListItem>
<asp:ListItem>Clinical Laboratory Sciences</asp:ListItem>
</asp:DropDownList>
</strong>
</td>
<td> </td>
</tr>
<tr>
<td class="auto-style28"> </td>
<td class="auto-style21"> </td>
<td> </td>
</tr>
<tr>
<td class="auto-style28"> </td>
<td class="auto-style21"> </td>
</tr>
<tr>
<td class="auto-style28"> </td>
<td class="auto-style21"> </td>
</tr>
<tr>
<td class="auto-style28"> </td>
<td class="auto-style21"> </td>
<td>
<asp:Button ID="Button1" runat="server" BackColor="#4DA3B0" BorderColor="#4DA3B0" Font-Bold="False" Font-Size="12pt" ForeColor="White" Height="36px" style="margin-left:10px;" Text="Next ►" Width="166px" />
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</ContentTemplate>
</asp:TabPanel>
<asp:TabPanel ID="TabPanel2" runat="server" HeaderText="Graduate Form">
<ContentTemplate>
**
Hi brother use below code
first add refrence at the top of the page
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
then use below code
<asp:ScriptManager runat="server" ID="sc">
</asp:ScriptManager>
<asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" BackColor="#62A5C8"
BorderStyle="none" ForeColor="#ffffff" Height="450px" server="" Style="background-color: #012F54;
margin-top: 0px;" Width="100%" ScrollBars="Both" Font-Size="Medium" ToolTip="Move between tabs to fill-in all information">
<asp:TabPanel runat="server" HeaderText="Student Information" ID="TabPanel1">
<ContentTemplate>
<table class="auto-style15">
<tr>
<td class="auto-style27">
<br />
<span class="auto-style117">First Name:<br />
</span>
</td>
<td class="auto-style21">
<br />
<strong>
<asp:TextBox ID="TextBox1" runat="server" BorderColor="Black" BorderStyle="Solid"
Height="23px" Width="198px" CssClass="auto-style116"></asp:TextBox>
</strong>
</td>
<td>
</td>
</tr>
<tr>
<td class="auto-style28">
</td>
<td class="auto-style21">
</td>
<td>
</td>
</tr>
<tr>
<td class="auto-style117">
Last Name:
</td>
<td class="auto-style24">
<strong>
<asp:TextBox ID="TextBox2" runat="server" BorderStyle="Solid" Height="21px" Width="198px"
BorderColor="Black" CssClass="auto-style116"></asp:TextBox>
</strong>
</td>
<td class="auto-style25">
</td>
</tr>
<tr>
<td class="auto-style17">
</td>
<td class="auto-style20">
</td>
<td class="auto-style18">
</td>
</tr>
<tr>
<td class="auto-style27" style="font-size: small; color: #043d5d">
Student ID:
</td>
<td class="auto-style21">
<strong>
<asp:TextBox ID="TextBox3" runat="server" BorderStyle="Solid" Height="23px" Width="198px"
BorderColor="Black" CssClass="auto-style116"></asp:TextBox>
</strong>
</td>
<td>
</td>
</tr>
<tr>
<td class="auto-style28">
</td>
<td class="auto-style21">
</td>
<td>
</td>
</tr>
<tr>
<td class="auto-style27" style="font-size: small; color: #043d5d">
Department:
</td>
<td class="auto-style21">
<strong>
<asp:DropDownList ID="DropDownList1" runat="server" Height="27px" Width="295px" Style="margin-left: 7px;">
<asp:ListItem>Cardiac Technology</asp:ListItem>
<asp:ListItem>Clinical Laboratory Sciences</asp:ListItem>
</asp:DropDownList>
</strong>
</td>
<td>
</td>
</tr>
<tr>
<td class="auto-style28">
</td>
<td class="auto-style21">
</td>
<td>
</td>
</tr>
<tr>
<td class="auto-style28">
</td>
<td class="auto-style21">
</td>
</tr>
<tr>
<td class="auto-style28">
</td>
<td class="auto-style21">
</td>
</tr>
<tr>
<td class="auto-style28">
</td>
<td class="auto-style21">
</td>
<td>
<asp:Button ID="Button1" runat="server" BackColor="#4DA3B0" BorderColor="#4DA3B0"
Font-Bold="False" Font-Size="12pt" ForeColor="White" Height="36px" Style="margin-left: 10px;"
Text="Next ►" Width="166px" />
</td>
</tr>
</table>
</ContentTemplate>
</asp:TabPanel>
<asp:TabPanel ID="TabPanel2" runat="server" HeaderText="Graduate Form">
<ContentTemplate>
</ContentTemplate>
</asp:TabPanel>
</asp:TabContainer>
Here is my code
<asp:Repeater ID="rpRatesheetDetails" runat="server"
onitemcommand="rpRatesheetDetails_ItemCommand"
onitemdatabound="rpRatesheetDetails_ItemDataBound">
<HeaderTemplate>
<tr>
<td width="110" height="25px" class="content">
<table cellpadding="0" cellspacing="1">
<tr>
<td style="cursor:pointer;" runat="server" onclick="toggle();">
Carrier
</td>
<td align="right">
<asp:ImageButton ID="btnCarrierSortAsc" runat="server" ImageUrl="~/Images/Arrow_T.png" ToolTip="Sort Ascending Order" style="display:none;"
CommandName="SortCarrierASC" />
</td>
<td align="right">
<asp:ImageButton ID="btnCarrierSortDsc" runat="server" ImageUrl="~/Images/Arrow_B.png" ToolTip="Sort Descending Order" style="display:none;"
CommandName="SortCarrierDESC" />
</td>
</tr>
</table>
</td>
<td width="110" class="content">
<table cellpadding="0" cellspacing="1">
<tr>
<td>
Date
</td>
<td align="right">
<asp:ImageButton ID="btnDateSortAsc" runat="server" ImageUrl="~/Images/Arrow_T.png" ToolTip="Sort Ascending Order" style="display:none;"
CommandName="SortDateASC" />
</td>
<td align="right">
<asp:ImageButton ID="btnDateSortDesc" runat="server" ImageUrl="~/Images/Arrow_B.png" ToolTip="Sort Descending Order" style="display:none;"
CommandName="SortDateDESC" />
</td>
</tr>
</table>
</td>
<td width="82" class="content">
Call Type
</td>
<td width="110" class="content">
Format
</td>
<td width="100" class="content">
<table cellpadding="0" cellspacing="1">
<tr>
<td>
Status
</td>
<td align="right">
<asp:ImageButton ID="btnStatusAsc" runat="server" ImageUrl="~/Images/Arrow_T.png" ToolTip="Sort Ascending Order" style="display:none;"
CommandName="SortStatusASC" />
</td>
<td align="right">
<asp:ImageButton ID="btnStatusDsc" runat="server" ImageUrl="~/Images/Arrow_B.png" ToolTip="Sort Descending Order" style="display:none;"
CommandName="SortStatusDESC" />
</td>
</tr>
</table>
</td>
<td width="70" class="content">
User
</td>
<td width="82" class="content">
File Name
</td>
<td width="110" class="content">
System
</td>
<td width="110" class="content">
<table cellpadding="0" cellspacing="1">
<tr>
<td>
No. Of Days
</td>
<td align="right">
<asp:ImageButton ID="btnDaysAsc" runat="server" ImageUrl="~/Images/Arrow_T.png" ToolTip="Sort Ascending Order"
CommandName="SortNoOfDaysASC" />
<asp:ImageButton ID="btnDaysDsc" runat="server" ImageUrl="~/Images/Arrow_B.png" ToolTip="Sort Descending Order"
CommandName="SortNoOfDaysDESC" />
</td>
</tr>
</table>
</td>
</tr>
</HeaderTemplate>
Above is the header template of my repeater.By default when my repeater loads it is sorted by the last column.Now i want dat if the user want to sort by any other column he should click on dat column.Only den the sort icon will be shown and the records will be sorted.I am showing this icon on the ItemDataBound event but how to fire an ItemDataBound event while clicking on header??
The order of the items in the repeater depends on the order in the bound collection (the DataSource).
Sort the items in the DataSource before binding in order to get a sorted list in your repeater.
Do this in your rpRatesheetDetails_ItemCommand - check the command name, sort the collection accordingly, then bind.
because I manually want to show the modal popup (this might be due to the fact that the controls inside the popup have to initialized according to the pressed button or row). Can anyone help me? The button NEVER goes to this EditBtn_Click method, it just aways show my panel.
Code:
protected void EditBtn_Click(object sender, EventArgs e)
{
LinkButton btn = (LinkButton)sender;
GridViewRow row = (GridViewRow)btn.NamingContainer;
int i = Convert.ToInt32(row.RowIndex);
string uid = (string)ManageStaffGrid.Rows[i].Cells[1].Text;
//bind panel
AjaxControlToolkit.ModalPopupExtender mpe = (AjaxControlToolkit.ModalPopupExtender)row.FindControl("EditBtn_ModalPopupExtender");
mpe.Show(); //show the modal popup extender
}
Design:
(from grid)
<ItemTemplate>
<asp:LinkButton ID="EditBtn" runat="server" onclick="EditBtn_Click">Edit</asp:LinkButton>
<asp:ModalPopupExtender ID="EditBtn_ModalPopupExtender" runat="server" CancelControlID="CancelBtn" Enabled="True" PopupControlID="UpdatePanel" TargetControlID="EditBtn">
</asp:ModalPopupExtender>
</ItemTemplate>
<asp:Panel ID="UpdatePanel" runat="server" Style="display: none" BackColor="White" GroupingText="Update User">
<div>
<table><tr>
<td style="width:12px"></td>
<td><asp:Label ID="lblLegend" runat="server" Text=""></asp:Label></td></tr></table>
<br />
<table>
<tr>
<td style="width:12px"></td>
<td style="width: 76px">
<asp:Label ID="lblName" runat="server" Text="Name"></asp:Label>
</td>
<td>
<asp:Label ID="lblStaffName" runat="server"></asp:Label>
</td>
<td>
</td>
</tr>
<tr>
<td style="width:12px"> </td>
<td style="width: 76px">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
<asp:Label ID="lblUserId" runat="server" Text="User ID"></asp:Label>
</td>
<td>
<asp:Label ID="lblStaffUid" runat="server"></asp:Label>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td valign="top" style="width: 70px">
<asp:Label ID="lblSection" runat="server" Text="Section"></asp:Label>
</td>
<td>
<asp:ListBox ID="listSection" runat="server" SelectionMode="Multiple"
CssClass="standardManage" onMouseDown="GetCurrentListValues(this);"
onchange="FillListValues(this);">
</asp:ListBox>
</td>
<td valign="top">
<asp:RequiredFieldValidator ID="RequiredValidatorSection" runat="server"
ControlToValidate="listSection" Display="Dynamic" EnableClientScript="False"
EnableTheming="True" ErrorMessage="Required" ForeColor="Red"></asp:RequiredFieldValidator>
<asp:Label ID="lblValidatorSection" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
<asp:Label ID="lblFunction" runat="server" Text="Function"></asp:Label>
</td>
<td>
<asp:DropDownList ID="ddlFunction" runat="server" CssClass="standardManage">
</asp:DropDownList>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
<asp:Label ID="lblStaffGender" runat="server" Text="Gender"></asp:Label>
</td>
<td>
<asp:Label ID="lblGender" runat="server"></asp:Label>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
<asp:Label ID="lblRole" runat="server" Text="Role"></asp:Label>
</td>
<td>
<asp:DropDownList ID="ddlRole" runat="server" CssClass="standardManage">
</asp:DropDownList>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 76px">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td> </td>
<td style="width: 70px">
</td>
<td align="right">
<asp:Button ID="UpdateBtn" runat="server" Text="Update" OnClick="UpdateBtn_Click"/>
<asp:Button ID="CancelBtn" runat="server" Text="Cancel" />
</td>
<td>
</td>
</tr>
</table>
</div></asp:Panel>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
i found a very helpful link that eventually solves my problems! Please check it out!
http://www.aspdotnet-suresh.com/2011/03/how-to-show-modalpopup-to-edit-gridview.html