asp.net label over asp.net image - asp.net

I want to palce a asp.net label over asp.net image
<asp:Image ID="Image1" runat="server" ImageUrl="~/option.PNG" />
<asp:Label ID="Label1" runat="server" Text="Labelsssssss"></asp:Label>
here it will come one after another only. I have to use both asp controls no html controls are allowed.How?

if possible, remove the image, put the label in a div, set the background-image of the div to your image.

<asp:Panel runat="server" ID="pnl">
<asp:Label runat="server" ID="lbl" Text="this is text" ForeColor="Red"></asp:Label>
</asp:Panel>
CS page:
pnl.Attributes.Add("style", "background:url(/option.PNG)");

Related

How to add child object to textbox in asp.net?

I want to add child object to a TextBox, but this code gives an error
How can I achieve this?
<asp:TextBox ID="TextBox2" runat="server">
<asp:Label runat="server" Text="Label"></asp:Label>
</asp:TextBox>`
TextBox and Label are two different controls. You cant nest a Label inside a text Box.
Eg:
<asp:Label runat="server" Text="Label"></asp:Label>
<asp:TextBox ID="TextBox2" runat="server"> </asp:TextBox>
What do you want to do here?
As there are some of the ASP.NET controls like Linkbutton which allows you to hold HTML controls inside them
<asp:LinkButton ID="lnkDelete" runat="server" CssClass="remove">
<span><font color="#fb4202">x</font> Remove</span>
</asp:LinkButton>
but it is not possible to hold a asp:Label in a asp:Textbox control
What you are trying to do is impossible. While WPF has a framework that enables this kind of things, HTML and thus ASP.NET does not.
If you are trying to set the text, try this:
<asp:TextBox ID="TextBox2" runat="server" Text="abc" />
Else, just put them side by side:
<asp:Label runat="server" Text="Label" />
<asp:TextBox ID="TextBox2" runat="server" />
Textbox is a Editable Control and Label is non-Editable Control, so you can't put Label inside TextBox. You can Put Label Just Before The Textbox as :
<asp:Label ID="Label1" runat="server" Text="Enter Text"><asp:Label>
<asp:TextBox ID="txtValue" runat="server"/>

restrict data rows in datalist and add a load more button in the footer

datalist is as follows:
<asp:DataList ID="DataListComments" runat="server"
DataKeyField="Pk_Comment_Id" DataSourceID="SqlDataSourceComments" Width="100%">
<HeaderStyle BackColor="Gray" HorizontalAlign="Center" />
<HeaderTemplate>
<asp:Label ID="Label1" runat="server" BackColor="Gray"
ForeColor="White" Text="Comments" Width="100%" />
</HeaderTemplate>
<ItemTemplate>
<div class="CommentBox">
<div class="CommentImage">
<asp:HyperLink ID="HyperLink1" runat="server"
NavigateUrl='<%# "Profile.aspx?uid=" + Eval("fk_User_Id")%>'>
<asp:Image ID="imgUserC" runat="server"
ImageUrl='<%# Eval("Profile_Pic") %>' CssClass="scaling-image" />
</asp:HyperLink>
</div>
<div class="CommentInfo">
<div class="CommentUsername">
<asp:HyperLink ID="linkUserProfile" runat="server"
NavigateUrl='<%# "Profile.aspx?uid=" + Eval("fk_User_Id")%>'><%# Eval("Username") %></asp:HyperLink>
</div>
<div class="CommentDate">(<%# Eval("Date") %>)</div>
<div class="CommentDescription"><%# Eval("Description") %></div>
</div>
</div>
</ItemTemplate>
</asp:DataList>
Now, suppose there are 24 entries for [comments] in the database... I want to show only 3 here... And add a load more button in the footer template, on clicking this load more 5 more comments should be displayed..
If there is a possible solution to this with ajax, i wouldn't have any problem with that. I just need a working solution to this, as I am clueless on how to achieve this.
It's quite complicated when you are using runat server controls like gridview and datalist etc.
To achieve your goal:
You need to create web service
Get records from data base by using the service and JavaScript
Append the result at bottom by using JavaScript
These are things you need to do, and many other problem will start when you will work with server controls.

background-image eval

I am using DataList to show thumbnails, how can I use background-image url with eval
This code gives me The server tag is not well formed error.
<asp:DataList ID="DataListPortfolio" runat="server" RepeatColumns="3">
<ItemTemplate>
<asp:Image ID="ImageButton1" runat="server"
style="background-image: url('<%#Eval("featuredImagesSmall")%>');" />
</ItemTemplate>
</asp:DataList>
According to your comments, you probably just want to use a div instead of <asp:Image (which renders as an img), in order to achieve thumbnails that are all the same size regardless of the image size:
<asp:DataList ID="DataListPortfolio" runat="server" RepeatColumns="3">
<ItemTemplate>
<div style='width:100px;height:100px;background-position:center;background-image:url(<%# Eval("featuredImagesSmall") %>)'></div>
</ItemTemplate>
</asp:DataList>
I just put an arbitrary height and width on the div, but that will ensure all the thumbnails are the same size. You can play with the CSS to position the image inside the div.
Why not use the ImageUrl property of the ASP.NET Image control? Something like this:
<asp:DataList ID="DataListPortfolio" runat="server" RepeatColumns="3">
<ItemTemplate>
<asp:Image ID="ImageButton1" runat="server" ImageUrl='<%# Eval("featuredImagesSmall")%>' />
</ItemTemplate>
</asp:DataList>

1px line gap between two asp elements?

I want to be able to control the gap between two asp elements.
The gap got from is too much and id like to reduce it to half of that. I tried using the following modified br tah to no avail.
Please advise.
<asp:Image ID="Image5" runat="server" ImageUrl="/_Layouts/Bullet.png" /> <asp:LinkButton ID="LinkButton4" runat="server" CssClass="PreviousPollLinkButtonStyle" Onclick="renderingCurrentPoll">Current Poll</asp:LinkButton>
**<br style="line-height:2px;"/>**
<asp:Image ID="Image2" runat="server" ImageUrl="/_Layouts/Bullet.png" />&nbsp<asp:LinkButton ID="LinkButton1" runat="server" CssClass="PreviousPollLinkButtonStyle" Onclick="renderingPreviousPollResults">Previous Poll Results</asp:LinkButton>
You could put your Image and LinkButton in a DIV and use a bottom-margin:
<div style="bottom-margin:1px;padding:0;">
<asp:Image ID="Image5" runat="server" ImageUrl="/_Layouts/Bullet.png" /> <asp:LinkButton ID="LinkButton4" runat="server" CssClass="PreviousPollLinkButtonStyle" Onclick="renderingCurrentPoll">Current Poll</asp:LinkButton>
</div>
<asp:Image ID="Image2" runat="server" ImageUrl="/_Layouts/Bullet.png" />&nbsp<asp:LinkButton ID="LinkButton1" runat="server" CssClass="PreviousPollLinkButtonStyle" Onclick="renderingPreviousPollResults">Previous Poll Results</asp:LinkButton>
You may have to change the PreviousPollLinkButtonStyle CSS class.

asp panel default button not working

I am using ajax colllapsible panel extender in my project. So in one of the Price Range function panel i have 2 text boxes and one asp button that will handle the function of price range. Well i'm trying to set button as default button inside that asp panel but it does not work. I tried my page in firefox, IE & chrome also. It just performs no action and reloads the page.
Below i am adding the asp code,
<asp:Panel ID="PricePanel" runat="server" CssClass="ui-widget-header ui-corner-all"
Style="padding: 0.1em 0.3em; text-align: left;">
<asp:Image ID="imgPrice" runat="server" />
<asp:Label ID="AllPrices" runat="server" Text="Price Range"></asp:Label>
</asp:Panel>
<asp:Panel ID="PricePanelContent" runat="server" CssClass="collapsePanel" DefaultButton="btnPrice">
<div class="PriceRange">
<asp:Label ID="lblPriceFrom" runat="server" Text="Rs" Width="20px"></asp:Label><asp:TextBox
Width="60px" ID="txtPriceFrom" runat="server"></asp:TextBox>
<asp:Label ID="lblPriceTo" runat="server" Text="To Rs " Width="42px"></asp:Label><asp:TextBox
ID="txtPriceTo" Width="60px" runat="server" AutoPostBack="True" Wrap="True"></asp:TextBox>
<asp:Button ID="btnPrice" runat="server" Text="Go" OnClick="btnPrice_Click" />
</div>
</asp:Panel>
<asp:CollapsiblePanelExtender TargetControlID="PricePanelContent" ImageControlID="imgPrice"
ExpandedImage="~/images/open.png" CollapsedImage="~/images/close.png" ID="CollapsiblePrice"
ExpandControlID="PricePanel" CollapseControlID="PricePanel" CollapsedText="All Price"
TextLabelID="AllPrices" ExpandedText="" Collapsed="true" runat="server" SuppressPostBack="true">
</asp:CollapsiblePanelExtender>
If any one can help me on this.
Thanks & Regards,
Mehul Makwana.
Try to remove the AutoPostBack="True" from your txtPriceTo text box, and see if that helps.

Resources