I'm trying to display my Validation Summary in a MessageBox and it simply inst working. Here's what I have.
<asp:ValidationSummary ID="ValidationSummary1" runat="server" Height="24px" Width="100%"ShowMessageBox="True" ShowSummary="False"></asp:ValidationSummary>
<tr>
<td align="right">
<asp:Label ID="Label2" runat="server" CssClass="label" Width="138px">* Serial Number</asp:Label>
</td>
<td>
<asp:TextBox ID="txtSerial" runat="server" ></asp:TextBox>
<asp:RequiredFieldValidator ID="valSerial" runat="server"
ControlToValidate="txtSerial" ErrorMessage="Serial number is required" >*</asp:RequiredFieldValidator>
</td>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" Height="20px"></asp:Button>
I have followed every guide I can find on the internet but i can't get it to work.
What am i missing? Thanks!
I answered it. I had <xhtmlConformance mode="Legacy" /> in my web config. This prevented the MessageBox from displaying.
Related
TextBox is Enabled="false", which is why the tooltip is not showing on TextBox.
What should I do to show the ToolTip without changing state of TextBox?
<asp:TextBox ID="txtDescription" data-original-title="Description" Enabled="false" runat="server" Class="txtDescription form-control tooltips"></asp:TextBox>
I use ReadOnly="true" and it's work.
<asp:TextBox ID="txtDescription" data-original-title="Description" ReadOnly="true" runat="server" Class="txtDescription form-control tooltips"></asp:TextBox>
How to align labels in same way because if am using style=textalign:end it shift the label before textbox and looks fine in Google chrome but in IE10 label position change to start.
Can anyone please tell me is there any common css that works in all browsers and gives same look and feel.
<td style="text-align: end">
<asp:Label ID="lblParameterA" runat="server" Text="a" CssClass="lblNormal"></asp:Label>
</td>
<td>
<asp:TextBox ID="textbox1" runat="server" Width="90px" CssClass="txtMediumText"> </asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" CssClass="mandatory" ControlToValidate="textbox1"></asp:RequiredFieldValidator>
<span class="mandatory">*</span>
</td>
From MDN https://developer.mozilla.org/en-US/docs/Web/CSS/text-align
"This is an experimental API that should not be used in production code."
You won't be able to make it cross-browser.
It's still on the working draft of css level-3, per october 2013
I want to validate some text boxes in my ASP.NET page using ASP required field validation. And I want to display that error message in top of the page.
<table>
<tr><td colspan='2'><b> User Input</b><br/></td></tr>
<tr><td colspan='2'>
<%--input validations--%>
<asp:RegularExpressionValidator ID="regexpName1" runat="server"
ErrorMessage="This expression does not validate."
ControlToValidate="TextBox_adTitle"
ValidationExpression="^[a-zA-Z'.\s]{1,40}$" />
<br />
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="TextBox_1" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
<br />
</td>
</tr>
<tr><td>
<asp:Label ID="Label_name" runat="server" Text="Seller Name * "></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox_1" runat="server" ReadOnly="True" ></asp:TextBox>
</td>
</tr>
...
This is working fine. However, the first table row is keeping its space even error messages are not displaying on it. This will cause the UI to look bad on the page since unnecessary space is there when the page loads.
How can I hide the space of the first row (validation's error messages row) while the page is loading and when there is no validation error?
You need to set
Display="Dynamic"
property to your validator, this will cause desirable behaviour.
Add the below property in field validator:
display="dynamic"
I found a good way to resolve this.
Put your validation inside a panel, and make them display as "none".
<asp:Panel ID="Panel1" runat="server" >
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ErrorMessage="RequiredFieldValidator1" ControlToValidate="TextBox1" Display="None"></asp:RequiredFieldValidator><br />
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
ErrorMessage="RequiredFieldValidator2" ControlToValidate="TextBox2" Display="None"></asp:RequiredFieldValidator><br />
</asp:Panel>
And top of your ASP page Add a Validation Summary.
<table>
<tr>
<td> <asp:ValidationSummary id="summery1" runat="server"/></td>
</tr>
....
Validation summary only gets required space in Page.
Just add Property.
Display="Dynamic"
within your Validator, Example give below.
<asp:RequiredFieldValidator ID="rfvEmail" runat="server" Display="Dynamic" ForeColor="Red" ErrorMessage="Please enter Email" ControlToValidate="txtEmail" ValidationGroup="addManufacture"></asp:RequiredFieldValidator>
Simple solution. Add this to validator:
CssClass="AT3RValidator"
.AT3RValidator {
display:none;
}
And set to display="Dynamic", but that will still render empty space because that sets visibility:hidden style to generated validator span, which is different from display:none, it renders undesired empty space.
To hide validators do this
<tr>
<td>TEXT</td>
</tr>
<tr>
<td>INPUT
<br/>
<asp:validator....></>
</td>
</tr>
OR
<tr>
<td>TEXT</td>
</tr>
<tr>
<td>INPUT
<div>
<asp:validator....></>
</div>
</td>
</tr>
My current code using tables to render thumbnails. When the page is resized, I use javascript to recalculate the number of rows and reinsert the cells into the correct columns.
This works fine for 100 thumbnails but is kind of slow when displaying 3000 thumbnails.
So I've looked at how bing displays its thumbnails and it appears to use span tags with display:inline-block. I've tested laying out thumbnails using span tags this has the benefit of automatically wrapping the thumbnails for me when I resize the page. I've also tested using DIV tags with float:left and it appears to be much slower than span on some browsers but not others.
However I'm wondering which method is typically fastest on all browsers for the kind of thumbnail layout i want.
a) Table
b) DIV tags with float:left
c) Span tags with display:inline-block
and in general do DIV tags render slower than span tags?
Of course the div / span solution will always be faster than the table solution because you don´t have to use javascript.
About the difference between span's, div's, floats and inline-blocks: I can´t imagine that there is a difference, but if there is, it will depend on the browser you´re using so you will have to test that in different browsers.
This may not be a direct answer to your question. But I would look at pagination. 3000 is a lot of records for one page. If you paginate (see YUI's carousel) you can reduce it down to 100 thumbnail chunks. Using the YUI pagination you could also allow the user to choose how many to put on one screen. Plus, the pagination does not need to do a server round trip if you don't want it too.
I would think that spans would load quicker but I have little substantial information on which to base this assumption. However, there is an approach you can take, I forget the term, but only content visible on the screen will load. Content that would need scrolling to be visible would not be loaded until it would be visible on the screen. This may help you speed up your loading.
Take a look at this link and it will give a script to do this loading technique: http://www.dynamicdrive.com/forums/showthread.php?p=200232
I created this script as a test:
<html>
<body>
<script type="text/javascript">
var i=0;
var startDate = Date();
for (i=0;i<=3000;i++)
{
document.write("<div style='float: left;display: inline;border: black 1px dotted; width: 100px; height: 100px;'>The number is " + i + "</div>");
}
var endDate = Date();
document.write("<br/>");
document.write("<strong>Started :</strong> " + startDate );
document.write("<br/><br/>");
document.write("<strong>Finished:</strong> " + endDate );
</script>
</body>
</html>
Switching to a span created no noticeable performance difference.
However, I know for a fact that IE has serious problems if you set the background to an image in a table cell or a DIV. It just doesn't render as fast. Not sure if that is how you are inserting the thumbnails.
Guys found some very interesting results. let me know if you can confirm. So I went extreme and tested with binding a 20,000 record xml to an asp.net listview to benchmark. very interesting.
this listview template which uses span
firefox: takes 10 seconds to render and refreshes/wraps immediately as page is resized. uses 367mb of memory
IE 8: takes 20 seconds to render and takes 10 seconds to wrap as page is resized. uses 605mb of memory.
<asp:ListView ID="ListView1" runat="server" DataSourceID="XmlDataSource1" >
<LayoutTemplate>
<div runat="server" id="lstProducts">
<div runat="server" id="itemPlaceholder" />
</div>
</LayoutTemplate>
<ItemTemplate>
<span runat="server" style="display:inline-block">
<asp:Image runat="server" Style="width: 100px" enableviewstate="false" ID="ImageButton1" ImageUrl='<%# Eval("ImageUrl", "~/Photos/{0}") %>' />
<br />
<asp:Label ID="PropertyTypeLabel" runat="server" enableviewstate="false" Text='<%# Eval("PropertyType") %>' />
<br />
Bedrooms:
<asp:Label ID="BedroomsLabel" runat="server" enableviewstate="false" Text='<%# Eval("Bedrooms") %>' />
<br />
Town:
<asp:Label ID="TownLabel" runat="server" enableviewstate="false" Text='<%# Eval("Town") %>' />
<br />
Lat:
<asp:Label ID="LatLabel" runat="server" enableviewstate="false" Text='<%# Eval("Lat") %>' />
<br />
Lon:
<asp:Label ID="LonLabel" runat="server" enableviewstate="false" Text='<%# Eval("Lon") %>' />
<br />
Price:<asp:Label ID="PriceLabel" runat="server" enableviewstate="false" Text='<%# Eval("Price", "£{0}") %>' />
</span>
</ItemTemplate>
</asp:ListView>
this listview template which uses div looks like this
<asp:ListView ID="ListView1" runat="server" DataSourceID="XmlDataSource1" >
<LayoutTemplate>
<div runat="server" id="lstProducts">
<div runat="server" id="itemPlaceholder" />
</div>
</LayoutTemplate>
<ItemTemplate>
<div runat="server" style="float:left">
<asp:Image runat="server" Style="width: 100px" enableviewstate="false" ID="ImageButton1" ImageUrl='<%# Eval("ImageUrl", "~/Photos/{0}") %>' />
<br />
<asp:Label ID="PropertyTypeLabel" runat="server" enableviewstate="false" Text='<%# Eval("PropertyType") %>' />
<br />
Bedrooms:
<asp:Label ID="BedroomsLabel" runat="server" enableviewstate="false" Text='<%# Eval("Bedrooms") %>' />
<br />
Town:
<asp:Label ID="TownLabel" runat="server" enableviewstate="false" Text='<%# Eval("Town") %>' />
<br />
Lat:
<asp:Label ID="LatLabel" runat="server" enableviewstate="false" Text='<%# Eval("Lat") %>' />
<br />
Lon:
<asp:Label ID="LonLabel" runat="server" enableviewstate="false" Text='<%# Eval("Lon") %>' />
<br />
Price:<asp:Label ID="PriceLabel" runat="server" enableviewstate="false" Text='<%# Eval("Price", "£{0}") %>' />
</div>
</ItemTemplate>
</asp:ListView>
firefox: takes > 2 minutes seconds to render and refreshes/wraps take 40 seconds as page is resized. uses 500mb of memory
IE 8: takes 50 seconds to render and takes 20 seconds to wrap as page is resized. uses 600mb of memory.
so it looks like firefox handles rendering thousands of divs much worse than IE. and on both browsers thousands of spans render faster than divs.
I use a modal popup extender, i followed all the instructions on the toolkit sample page, except that i didn't set the property BackgroundCssClass.
this is what happens:
Is there a way I can get rude of it without setting the cssclass prop?
I don't need any styles.
If the answer is NO then please show me an example how to set it with a cssclass (even dummy).
Thanks in advance.
Here is the code:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<div style="size: 100%; vertical-align: middle">
<asp:LinkButton ID="lnkUpload" Text="Upload" ToolTip="Upload new file" runat="server" OnClick="lnkUpload_Click" />
<cc1:ModalPopupExtender ID="lnkUpload_ModalPopupExtender" runat="server" Drag="true" PopupDragHandleControlID="pnlUploadTitle" DynamicServicePath="" PopupControlID="pnlUpload" Enabled="True" TargetControlID="lnkUpload" CancelControlID="btnCancel" />
</div>
<asp:Panel ID="pnlUploadTitle" runat="server" Visible="false">
<center>
Upload file
</center>
</asp:Panel>
<asp:Panel ID="pnlUpload" runat="server" Visible="false">
<center>
<br />
<asp:FileUpload ID="upFiles" runat="server" /><br />
<br />
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
<br />
</center>
</asp:Panel>
</div>
</form>
You can set the ModalPopupExtender's backgroundCssClass within the actual HTML markup.
Example from the asp.net modal popup page:
<ajaxToolkit:ModalPopupExtender ID="MPE" runat="server"
TargetControlID="LinkButton1"
PopupControlID="Panel1"
**BackgroundCssClass="modalBackground"**
DropShadow="true"
OkControlID="OkButton"
OnOkScript="onOk()"
CancelControlID="CancelButton"
PopupDragHandleControlID="Panel3" />
I spent ages looking up a solution for the similar problem
Set your PopUpControlId to be the ClientID of the control.
It solved the problem for me.
Also read more on: Codeplex
Ha-ha, I remember more then 2 years ago in AJAX beta not setting the BackgroundCssClass property caused modal popup not to be really modal, but just popup. I remember setting a style class solved the problem. I haven't used AJAX for a long time, it's funny if similar problems still persist.
Anyway, create stylesheet class inside your ASPX page or in CSS file referenced form it and set the property value to it. Maybe, this will also help.