I have repeater & table controls. My table has one column. When I run the code each cell in the row covers around 25% (based on content of cell) of the row & background color also changes for that area only. I want cell to cover the entire row. Following is the code. I set the column width to 100%, however it did not solve the issue. I do not want to hard code the width for cell.
<div style="overflow-y: auto; width: 100%; height: 395px; border: 0px solid #3C454F; background-color: #FFFBE6; border: 0px solid #3C454F;">
<asp:Repeater ID="TestList" runat="server">
<HeaderTemplate>
<table>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: aqua; padding-top: 5px">
<td style="width: 100%;">
<%#Container.DataItem%>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: white; padding-top: 5px">
<td style="width: 100%;">
<%#Container.DataItem%>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
Try this one:
<div style="overflow-y: auto; width: 100%; height: 395px; border: 0px solid #3C454F; background-color: #FFFBE6; border: 0px solid #3C454F;">
<asp:Repeater ID="TestList" runat="server">
<HeaderTemplate>
<table style="width:100%;">
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: aqua; padding-top: 5px">
<td style="width: 100%;">
<%#Container.DataItem%>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: white; padding-top: 5px">
<td style="width: 100%;">
<%#Container.DataItem%>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
Related
Good Afternoon,
I would like to know if this is possible. I have a gridview with several (4 template fields). The 4 fields include
First Name
Last Name
Phone
Email
What I would like to do is get a fifth data column(address) completely on a different row so that the data looks like this.
Row #1 | First Name | Last Name | Phone | Email| Record #1
Row #2 | Address | Record #1
Row #3 | First Name | Last Name | Phone | Email| Record #2
Row #4 | Address | Record #2
Can anybody help me with this, please?
For some reason this question is upvoted. I will wrote you an answer:
<table>
<asp:Repeater runat="server" ID="repeater1" >
<ItemTemplate>
<tr>
<td> <%#Eval("FirstName")%></td>
<td> <%#Eval("LastName")%></td>
....//other <td></td>
</tr>
<tr>
<td><%#Eval("Address")%></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
I will leave for you the css part, also if you want to have column names look into <th> tags, but I don't know how you will achieve that properly when you have on row 1 columns different form row 2. If you want to have delete/edit functionality you should add new td with linkButton/ImageButton/Button with functionality which will delete/edit the current row. For this you will need <%#Eval("ID")%> in CommandArguments of the button. But again in this case this will be interesting because you have one record on 2 rows. The design decision is done by you this is the solution.
You should probably look how to have multiple columns on row 1 and only one on row 2, this was attribute of td colspan
In code behind:
repeater1.DataSource = dst; // this should be data set containing all the needed values
repeater1.DataBind();
I'm not sure why it isn't more common knowledge that you can do this in a GridView. You can mix and match spanned rows and throw some regular GridView columns on at the end of the span (bound or templated).
You do lose some of the bells and whistles of the GridView, because you will have to manually handle sorting and some of the other things that make the GridView easy to work with. But unlike the Repeater, you still get some of the extra functionality of the GridView.
If you throw together a datasource that matches the fields I'm binding to here, you will see it has a second row that spans multiple columns (all the way to the last templated column of the GridView).
It's basically a header template, Two HTML tables, and then whatever type of GridView columns you need after that, if any at all.
The first html table is the normal row. The second html table is the just a long row to put something like a long description or notes.
Didn't include the CSS here, but that's how you will format column widths and alignment.
Works fine, but it sure takes longer to build these. You have to spend a lot of time adjusting column widths, and it is a pain to get the header column to match up with row columns. But, not much different than what you would run into making a template for a repeater.
<asp:GridView ID="GridView2" AutoGenerateColumns="False" runat="server" >
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<table id="Table1" runat="server" >
<tr id="Tr1" runat="server" >
<td id="Td1" style="width: 55px; text-align: center; vertical-align: bottom; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lbPoNoSort" CommandArgument="id" CommandName="Sort" runat="server">ID#</asp:LinkButton></td>
<td id="Td2" style="width: 85px;" runat="server">
<asp:LinkButton ID="lbDateRequested" CommandArgument="ReqDate" CommandName="Sort" runat="server">Date</asp:LinkButton></td>
<td id="Td3" style="width: 100px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lblNameSort" CommandArgument="col2" CommandName="Sort" runat="server">Name</asp:LinkButton></td>
<td id="Td4" style="width: 130px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lblApprovSort" CommandArgument="approved_by" CommandName="Sort" runat="server">User</asp:LinkButton></td>
<td id="Td5" style="width: 175px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lbVendorSort" CommandArgument="vendor" CommandName="Sort" runat="server">Vendor</asp:LinkButton></td>
<td id="Td7" style="width: 150px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lbTypeSort" CommandArgument="col4" CommandName="Sort" runat="server">Type</asp:LinkButton></td>
<td id="Td8" style="width: 65px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lbNoSort" CommandArgument="col5" CommandName="Sort" runat="server">OrderNo</asp:LinkButton></td>
<td id="Td9" style="width: 90px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lbCostSort" CommandArgument="col6" CommandName="Sort" runat="server">Est. Cost</asp:LinkButton></td>
<td id="Td10" style="width: 75px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lbPaymentTypeSort" CommandArgument="col10" CommandName="Sort" runat="server">Payment Type</asp:LinkButton></td>
<td id="Td11" style="width: 75px; text-align: center; vertical-align: bottom; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:LinkButton ID="lbLocationSort" CommandArgument="col7" CommandName="Sort" runat="server">Inventory Location</asp:LinkButton></td>
<td id="Td12" style="width: 75px; text-align: center; vertical-align: bottom; border-left: solid 1px black;" runat="server">
<asp:LinkButton ID="lbDeliverySort" CommandArgument="col13" CommandName="Sort" runat="server">Delivery Method</asp:LinkButton></td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table >
<tr>
<td style="width: 55px; text-align: center; vertical-align: top; border-right: solid 1px black;">
<asp:Label ID="Label7" runat="server" Visible="false" Text='<%# Bind("id") %>'></asp:Label>
<asp:LinkButton ID="lbPoNo" CommandName="View" runat="server" Visible="true" Text='<%# Bind("id") %>' ></asp:LinkButton>
</td>
<td style="width: 85px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;">
<asp:Label ID="Label2" runat="server" Text='<%# Eval("Date")%>' >
</asp:Label>
</td>
<td style="width: 100px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;">
<asp:Label ID="Label3" runat="server" Text='<%# Eval("col1")%>' >
</asp:Label>
</td>
<td style="width: 130px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;">
<asp:Label ID="Label4" runat="server" Text='<%# Eval("col2")%>' >
</asp:Label>
</td>
<td style="width: 175px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;">
<asp:Label ID="Label5" runat="server" Text='<%# Eval("col3")%>' >
</asp:Label>
</td>
<td style="width: 150px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;">
<asp:Label ID="Label6" runat="server" Text='<%# Eval("col4")%>' >
</asp:Label>
</td>
<td style="width: 65px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;">
<asp:LinkButton ID="lbOrderNo" runat="server" CommandName="ViewOrder" Text='<%# DataBinder.Eval(Container.DataItem, "col5") %>'></asp:LinkButton>
</td>
<td style="width: 90px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:Label ID="Label8" runat="server" Text='<%# Eval("col6")%>' >
</asp:Label>
</td>
<td style="width: 75px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;" runat="server">
<asp:Label ID="Label9" runat="server" Text='<%# Eval("col7")%>' >
</asp:Label>
</td>
<td style="width: 75px; text-align: center; vertical-align: top; border-left: solid 1px black; border-right: solid 1px black;">
<asp:Label ID="Label10" runat="server" Text='<%# Eval("col8")%>' >
</asp:Label>
</td>
<td style="width: 75px; text-align: center; vertical-align: top; border-left: solid 1px black;">
<asp:Label ID="Label11" runat="server" Text='<%# Eval("col9")%>' >
</asp:Label>
</td>
</tr>
</table>
<table class="job-info">
<tr class="TableData">
<td style="width: 1100px">
<asp:Label ID="Label13" CssClass="details" runat="server" Text="Details:" ></asp:Label> <asp:Label ID="Label12" BackColor="WhiteSmoke" runat="server" Text='<%# Eval("col10")%>' >
</asp:Label>
</td>
</tr>
</table>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField Visible="True" HeaderText="Accounting">
<ItemTemplate>
<asp:CheckBox ID="check" runat="server" Enabled="False" />
</ItemTemplate>
<HeaderStyle Width="60px" />
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
</Columns>
</asp:GridView>
i have a project where first user upload some documents and then admin approves it.... i show documents in repeater table and use it so when admin log in and click on submit button for approving documents like this please check pic
like this:
and when i click on submit button then table entirely changes a different look like this it show some thing like a very long columns:
this is ASPX.CS PAGE
<div class="CSSTableGenerator">
<table border="0" width="100%" cellpadding="0" cellspacing="0" id="results">
<asp:Repeater ID="Repeater2" OnItemCommand="Repeater2_ItemCommand"
runat="server" OnItemDataBound="Repeater2_ItemDataBound">
<HeaderTemplate>
<tr>
<%--<td></td>--%>
<td>DocumentID</td>
<td>Document Name</td>
<td>File Name</td>
<td>Uploaded By</td>
<td>Email</td>
<td>Department</td>
<td>Status</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><asp:Label ID="DocId" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "DocID")%>'></asp:Label></td>
<td><asp:Label ID="DocName" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "DocName")%>'></asp:Label></td>
<td><asp:Label ID="Uploadfile" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "Uploadfile")%>'></asp:Label></td>
<td><asp:Label ID="Label1" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "UploadedBy")%>'></asp:Label></td>
<td><asp:Label ID="YourEamil" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "UserEmail")%>'></asp:Label></td>
<td><asp:Label ID="DepType" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "DepType")%>'></asp:Label></td>
<td>
<asp:Label ID="lblCountry" runat="server" Text='<%# Eval("ApproveID") %>' Visible="false" />
<asp:DropDownList ID="DropDownList4" runat="server" EnableViewState="true" class="vpb_dropdown1" DataTextField="ApproveType" DataValueField="ApproveID" AutoPostBack="true" OnSelectedIndexChanged="DropDownList4_SelectedIndexChanged">
<asp:ListItem Text="Pending" Selected="selected" Value="3"></asp:ListItem>
<asp:ListItem Text="Approve" Value="1"></asp:ListItem>
<asp:ListItem Text="Reject" Value="2"></asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
</div>
THIS IS CSS
.CSSTableGenerator {
margin:0px;padding:0px;
width:100%;
box-shadow: 10px 10px 5px #888888;
border:1px solid #ffffff;
-moz-border-radius-bottomleft:0px;
-webkit-border-bottom-left-radius:0px;
border-bottom-left-radius:0px;
-moz-border-radius-bottomright:0px;
-webkit-border-bottom-right-radius:0px;
border-bottom-right-radius:0px;
-moz-border-radius-topright:0px;
-webkit-border-top-right-radius:0px;
border-top-right-radius:0px;
-moz-border-radius-topleft:0px;
-webkit-border-top-left-radius:0px;
border-top-left-radius:0px;
}.CSSTableGenerator table{
width:100%;
height:100%;
margin:0px;padding:0px;
}.CSSTableGenerator tr:last-child td:last-child {
-moz-border-radius-bottomright:0px;
-webkit-border-bottom-right-radius:0px;
border-bottom-right-radius:0px;
}
.CSSTableGenerator table tr:first-child td:first-child {
-moz-border-radius-topleft:0px;
-webkit-border-top-left-radius:0px;
border-top-left-radius:0px;
}
.CSSTableGenerator table tr:first-child td:last-child {
-moz-border-radius-topright:0px;
-webkit-border-top-right-radius:0px;
border-top-right-radius:0px;
}.CSSTableGenerator tr:last-child td:first-child{
-moz-border-radius-bottomleft:0px;
-webkit-border-bottom-left-radius:0px;
border-bottom-left-radius:0px;
}.CSSTableGenerator tr:hover td{
background-color:#d3e9ff;
}
.CSSTableGenerator td{
vertical-align:middle;
background-color:#aad4ff;
border:1px solid #ffffff;
border-width:0px 1px 1px 0px;
text-align:center;
padding:7px;
font-size:9px;
font-family:Arial;
font-weight:normal;
color:#000000;
}.CSSTableGenerator tr:last-child td{
border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
border-width:0px 0px 0px 0px;
}
.CSSTableGenerator tr:first-child td{
background:-o-linear-gradient(bottom, #0057af 5%, #0057af 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #0057af), color-stop(1, #0057af) );
background:-moz-linear-gradient( center top, #0057af 5%, #0057af 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#0057af", endColorstr="#0057af"); background: -o-linear-gradient(top,#0057af,0057af);
background-color:#0057af;
border:0px solid #ffffff;
text-align:center;
border-width:0px 0px 1px 1px;
font-size:9px;
font-family:Arial;
font-weight:normal;
color:#ffffff;
}
.CSSTableGenerator tr:first-child:hover td{
background:-o-linear-gradient(bottom, #0057af 5%, #0057af 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #0057af), color-stop(1, #0057af) );
background:-moz-linear-gradient( center top, #0057af 5%, #0057af 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#0057af", endColorstr="#0057af"); background: -o-linear-gradient(top,#0057af,0057af);
background-color:#0057af;
}
.CSSTableGenerator tr:first-child td:first-child{
border-width:0px 0px 1px 0px;
}
.CSSTableGenerator tr:first-child td:last-child{
border-width:0px 0px 1px 1px;
}
.CSSTableGenerator span {font-size:9px;}
.CSSTableGenerator td
{
padding-left: 4px;
padding-right: 4px;
}
can any one here please tell me where is the probelm occur?
.CSSTableGenerator table{
width:100%;
height:inherit;
margin:0px;padding:0px;
}
replace height value 100% with inherit
I followed this link here on how to create html table to pdf in asp.net
I followed the sample code and wired it to my button event handler, and when i clicked it, the pdf file is automatically generated in the respective file directory. But when i clicked it for the second time, it says my filename pdf has been used. I checked the file directory and there is indeed a pdf file being generated. How do i stop the duplication of pdf files when i clicked the button the 2nd time. I'm trying to convert my html table data into a pdf format. I'm wondering if i'm following the correct source.
Attempted sample code :
protected void Button1_Click(object sender, EventArgs e)
{
var document = new Document(PageSize.A4, 50, 50, 25, 25);
var output = new FileStream(Server.MapPath("MyFirstTestPDF.pdf"), FileMode.Create);
var writer = PdfWriter.GetInstance(document, output);
document.Open();
var welcomeParagraph = new Paragraph("Hello, World!");
document.Add(welcomeParagraph);
document.Close();
}
My html table in asp.net
<ul id="Report">
Case ID :
<asp:DropDownList ID="DDLCase" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DDLCase_SelectedIndexChanged"
AppendDataBoundItems="true" >
<asp:ListItem Value="-1">Select Member Report ID</asp:ListItem>
</asp:DropDownList>
<table style="width: 100%; height: 576px;">
<tr>
<th style="width: 98px; height: 49px;">Full Name :</th>
<td style="width: 351px; height: 49px; text-align: left;">
<asp:Label ID="lblFullName" runat="server" Text=""></asp:Label>
</td>
<th style="height: 49px; width: 76px">Contact :</th>
<td style="width: 185px; height: 49px; text-align: left;">
<asp:Label ID="lblContact" runat="server" Text=""></asp:Label>
</td>
</tr>
<tr>
<th style="width: 98px">Location :</th>
<td style="width: 351px; height: 49px; text-align: left;">
<asp:Label ID="lblLocation" runat="server" Text=""></asp:Label>
</td>
<th style="width: 76px">Type of Crime :</th>
<td style="width: 185px; height: 49px; text-align: left;">
<asp:Label ID="lblTOC" runat="server" Text=""></asp:Label>
</td>
</tr>
<tr>
<th style="width: 98px">Picture : </th>
<td style="width: 351px; height: 49px; text-align: left;">
<asp:Label ID="lblPicture" runat="server" Text=""></asp:Label>
</td>
<th style="width: 76px">Citizen Report Date & Time :</th>
<td style="width: 185px; height: 49px; text-align: left;">
<asp:Label ID="lblCRDT" runat="server" Text=""></asp:Label>
</td>
</tr>
<tr>
<th style="width: 98px">AssignTo :</th>
<td style="width: 351px; height: 49px; text-align: left;">
<asp:Label ID="lblAssign" runat="server" Text=""></asp:Label>
</td>
<th style="width: 76px">Police Report Date & Time :</th>
<td style="width: 185px; height: 49px; text-align: left;">
<asp:Label ID="lblPRDT" runat="server" Text=""></asp:Label>
</td>
</tr>
<tr>
<th style="width: 98px; height: 100px;">Citizen Report :</th>
<td colspan="4" style="height: 100px" text-align:"left">
<asp:Label ID="lblCR" runat="server" Text="" style="display: block; text-align: left;"></asp:Label>
</td>
</tr>
<tr>
<th style="width: 98px; height: 135px;">Police Report :</th>
<td colspan="4" style="height: 135px" text-align: "left">
<asp:Label ID="lblPR" runat="server" Text="" style="display: block; text-align: left;"></asp:Label>
</td>
</tr>
<tr>
<th style="width: 98px; height: 135px;">Official Report :</th>
<td colspan="4" style="height: 135px" text-align: "left">
<asp:Label ID="lblOR" runat="server" Text="" style="display: block; text-align: left;"></asp:Label>
</td>
</tr>
</table>
Did you close the document?
// Close the Document - this saves the document contents to the output stream
document.Close();
I have following Modal Dialog (popup) using only CSS3 in my asp page for user registration:
HTML :
<%-- Modal PopUp starts here--%>
<div id="openModal" class="modalDialog">
<div> X
<table style="width:100%;">
<tr>
<td style="text-align: center; width: 100%;"></td>
</tr>
<tr>
<td style="text-align: center; width: 100%;">
<asp:Label ID="lblErrorMSG2" runat="server" Font-Bold="True" ForeColor="#FF3300" Text="Email ID Already Taken " Visible="False"></asp:Label>
</td>
</tr>
<tr>
<td style="text-align: center; width: 100%;">
<input id="txtCustFName" name="txtCustFName" type="text" required placeholder="Enter Your First Name" style="width: 80%" />
</td>
</td>
</tr>
<tr>
<td style="text-align: center; width: 100%;">
<input id="txtCustLName" name="txtCustLName" type="text" required placeholder="Enter Your Last Name" style="width: 80%" />
</td>
</td>
</tr>
<tr>
<td style="text-align: center; width: 100%;">
<input id="txtCustREmail" name="txtCustREmail" type="email" required placeholder="Enter Valid Email ID" style="width: 80%" />
</td>
</td>
</tr>
<tr>
<td style="text-align: center; width: 100%;">
<input id="txtCustRPwd" name="txtCustRPwd" type="password" required placeholder="Enter Password" style="width: 80%" />
</td>
</td>
</tr>
<tr>
<td style="text-align: center; width: 100%;">
<input id="txtCustRePwd" name="txtCustRePwd" type="password" required placeholder="ReType Password" style="width: 80%" />
</td>
</td>
</tr>
<tr>
<td style="text-align: center; width: 100%;">
<input id="txtCustPh" name="txtCustPh" type="number" size="10" min="10" max="10" required placeholder="Enter Valid Mobile No" style="width: 80%" />
</td>
</td>
</tr>
<tr>
<td class="style1" style="text-align: center; width: 100%;" onclick="btnSignUp()">
<asp:Button ID="btnSingUp" runat="server" onclick="signUp" Text="Login" />
</td>
</tr>
<tr>
<td style="text-align: center; width: 100%;"> </td>
</tr>
</table>
</div>
</div>
<%--Modal PopUp Ends Here--%>
CSS :
.modalDialog {
position: fixed;
font-family: Arial, Helvetica, sans-serif;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0,0.8);
z-index: 99999;
opacity:0;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
pointer-events: none;
}
.modalDialog:target {
opacity:1;
pointer-events: auto;
}
.modalDialog > div {
width: 400px;
position: relative;
margin: 10% auto;
padding: 5px 20px 13px 20px;
border-radius: 10px;
background: #fff;
background: -moz-linear-gradient(#fff, #999);
background: -webkit-linear-gradient(#fff, #999);
background: -o-linear-gradient(#fff, #999);
}
.close {
background: #606061;
color: #FFFFFF;
line-height: 25px;
position: absolute;
right: -12px;
text-align: center;
top: -10px;
width: 24px;
text-decoration: none;
font-weight: bold;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;}
.close:hover { background: #00d9ff;
}
In my asp page I've following anchor tag which is used to display the popup:
Register
Now the problem is:
As this is registration form, I want server side validation of existing email id .
If user entered email id already exist in DB I want to reopen the above modal dialog with an error message Email ID already exist.
I m not able to reopen that dialog box.
Is there any way to do this using js?
Plz help me.
The tutorial for modal dialog is on site:
click here
For visualizing modal dialog:
click here
Thanx in advance.
for server side validation I suggest you to use javascript web method for this. By using this web method your popup didn't close while page check server side validation.....
Change the :target to also accept a class:
.modalDialog:target, .modalDialog.target {
opacity:1;
pointer-events: auto;
}
And then when you find out the email is invalid, you can just do:
$('.modalDialog').addClass('target')
or the non-jquery equivalent.
Just for curiosity can i give a control that is outside a repeater a binneded value
for example :
<asp:Repeater ID="topicRepeater" runat="server">
<ItemTemplate>
<table border="0" id="bodyTable" runat="server" style="width: 100%; height: 100%;">
<tr>
<td align="left" valign="top" style="padding-top: 6px; padding-right: 30px; padding-left: 5px; width: 50px;">
<img src='App_Themes/WebPortalTheme/images/ProfilePicSmall/<%# Eval("ProPic") %>'
style="width: 50px; height: 50px;" />
<div runat="server" id="username" style="padding-left: 8px; color: #002D79;">
<%# Eval("UserName") %></div>
</td>
</tr>
</table>
</ItemTemplate>
</asp:Repeater>
<telerik:RadTextBox ID="EditedReplyTxt" Text='<%# Eval("msg_text")%>' runat="server" Width="300px" TextMode="MultiLine" Height="100px"></telerik:RadTextBox>
Yes you can, read this example
http://msdn.microsoft.com/fr-fr/library/4hx47hfe(v=vs.80).aspx