Solved

Remove Hyperlink from ASP.NET Calendar

Posted on 2008-06-13
10
2,740 Views
Last Modified: 2012-06-27
I have an ASP.Net Calendar. I'd like the Calendar to display the dates without the hyperlink and when the user hovers a date it should show the hyperlink. I tried CSS it didnt work, i tried coding it in the Day_Render event, that didnt work either.

This is the code:

    Protected Sub Calendar1_DayRender(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DayRenderEventArgs) Handles Calendar1.DayRender
        e.Cell.Style.Add("textDecoration", "none")
    End Sub

the rendered html:
</td><td class="calendar" align="center" style="color:DarkGray;font-size:7.5pt;width:14%;textDecoration:none;"><a href="javascript:__doPostBack('Calendar1','3068')" style="color:DarkGray" title="May 26">26</a>
0
Comment
Question by:digitalZo
  • 5
  • 4
10 Comments
 
LVL 18

Expert Comment

by:Pawel Witkowski
ID: 21784536
IF you dont want any A in table you could do this from CSS like this:

.classNameForYourCalendar a
{
display:none;
}


IF you want only to turn off this A, you could add ID parameter for this element like <a href="..." id="turnMeOff"> </a>  and then turn it off from CSS:
#turnMeOff
{
  display:none
}

You could turn it off from JS too, but I think that you dont need that :)

hope it helps
0
 
LVL 10

Author Comment

by:digitalZo
ID: 21784629
Nope doesn't work. Nothing happens. it still gives the same output:

<td class="calendar" align="center" style="font-size:7.5pt;width:14%;textDecoration:none;"><a href="javascript:__doPostBack('Calendar1','3075')" style="color:#006699" title="June 02">2</a></td>
0
 
LVL 2

Expert Comment

by:Keale2
ID: 21785220
digitalZo,
Try this and let me know how it goes:

Add a style in the head of your page. Also, add class="day" to each applicable anchor element.


<style type="text/css">
 

td.calendar a.day

{

	text-decoration: none !important;

}
 

td.calendar a.day:hover

{

	text-decoration: underline !important;

	color: #0000FF !important;

}
 

</style>

Open in new window

0
 
LVL 18

Expert Comment

by:Pawel Witkowski
ID: 21786854
If you mean that text output is not changed - this is correct behaviour. If you would like to get rid of this, you would have to change it in code somewhere hmm... could be difficult. I just provided you code from CSS that will not display it. If you want trully erase this you have two choices - changing hard coded script, or do a workover in Javascript, that after creating this element - finds correct one and remove it by using .removeChild. Second might be more easy to do, but both are difficult. If you dont know how to do this just stick with CSS and everything will be OK i think... Hope it helps
0
 
LVL 10

Author Comment

by:digitalZo
ID: 21791304
<<Add a style in the head of your page. Also, add class="day" to each applicable anchor element.
>>

 How do I add the day class to the anchor element? The anchor element is rendered during run time.

This is the ASP.Net calendar code:

  <asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="#006699" CellPadding="1" DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt" ForeColor="#006699" Height="159px" Width="165px" NextMonthText="" PrevMonthText="">
            <SelectedDayStyle BackColor="#76ACC8" Font-Bold="True" ForeColor="White" />
            <SelectorStyle BackColor="#006699" ForeColor="White" />
            <WeekendDayStyle BackColor="#006699" ForeColor="White" />
            <OtherMonthDayStyle ForeColor="DarkGray" />
            <NextPrevStyle Font-Size="8pt" ForeColor="White" />
            <DayHeaderStyle BackColor="#76ACC8" ForeColor="White" Height="1px" Font-Size="7.5pt" />
            <TitleStyle BackColor="#006699" BorderWidth="1px" Font-Bold="True" Font-Size="8pt"
                ForeColor="White" Height="25px" />
            <DayStyle Font-Size="7.5pt" CssClass="day" />
           
         </asp:Calendar>

wilq32:
<<<If you mean that text output is not changed - this is correct behaviour. >>>>

Sorry, I meant it's not displaying the Calendar without hyperlinks even when I added your code
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 18

Expert Comment

by:Pawel Witkowski
ID: 21797628
Hmmm it might be because of javascript styling overwrites CSS styles, in that case you have two choices - do a routine in JS, or look inside ASP libary, both options are ... stupid.. i know, but what to do ?. You could do something like this:

in onload event just fire your routine in javascript, that will localise this anchor element and remove it from calendar via .removeChild, for example:

<div> some container:
<a href="blabla" id="removeME"> some anchor </a>

</div>

<script type="text/javascript">
document.getElementById('removeME').parentNode.removeChild(document.getElementById('removeME'));
</script>
0
 
LVL 10

Author Comment

by:digitalZo
ID: 21811012
<<<<<div> some container:
<a href="blabla" id="removeME"> some anchor </a>

</div>>>>>>>

the anchor tag is generated during runtime. how do i add the ID in that case?
0
 
LVL 10

Author Comment

by:digitalZo
ID: 21811018
personally tho, wilq32, removing the anchor tag is not the right solution i feel. if the anchor tag is removed it wont select the date and do a postback will it?
0
 
LVL 18

Expert Comment

by:Pawel Witkowski
ID: 21828810
anchor is only a control element. You could fire its event in other way (of course if you want to). What .js you include in your html ASP.NET ?? I think that i will have to look into their libary to remove this anchor... But do you really need to remove it? maybe some other option would be good?
0
 
LVL 10

Accepted Solution

by:
digitalZo earned 0 total points
ID: 21828837
<<But do you really need to remove it? maybe some other option would be good?>>>

i dont need to remove the anchor tag. i just dont want the "underline" to come which as far as i know is removed by coding text-decoration:none. but this solution doesnt seem to be working.

as for the anchor element, it's generated during the run time. there's no javascript involved. it's the standard asp.net calendar which behaves this way.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Syntax error 9 45
Error in JQuery 5 39
Materializecss - Different Behaviors in Browser's 1 20
rebind a grid after user clicks on node in treeview 1 16
Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now