CODEWITHSUNDEEP
htmlhref
Ninja Cowgirl
Ninja Cowgirl

Reputation: 11201

adding <a> tag in div but href does not work

I have following html code but the TasksCount class does not show up as hyperlink. Any idea? I updated the anchor with the wording Link but still no good.

<div id="TaskNotification" style="display: inline!important;  float: left; border; 3px solid #8AC007;PADDING: 5px;"> 
<img id="NotificatioImg" class="n-img" "="" src="../SiteAssets/tasks_sm.png?rev=23" alt="Notification">
<div class="TasksCount">
    <a href="../pages/Tasks.aspx">Link </a> 
</div>
</div>

Here is the CSS

<style>

body {
    font-family:Calibri;
}
#customTaskNotification {
    position:relative;


}
.TasksCount {
    position:absolute;
    top: -.1px; 
    right:-.1px;
    padding:1px 2px 1px 2px;
    background-color:#ff0000; /* orange #ef8913* dark-pink #d06079 */
    color:white;
    font-weight:bold;
    font-size:1.05em;
    width:50%;
    text-align: center;

    border-radius:50%!important;
    box-shadow:1px 1px 1px gray;
}

div.TasksCount:empty { 
    display: none;
}
</style>

Here is the jQuery that populates TasksCount Div

<script type="text/javascript" language="javascript" src="_layouts/15/jquery/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        var rowCount = $(".ms-WPBody tr").not(":has(th)").length;
        var x = $('.ms-WPBody tr td  a').html();
        if(x.indexOf("There are no items") !== -1){        
        rowCount = "";
        }
         $(".rowCount").text(rowCount);
         $(".TasksCount").text(rowCount);
    });     
</script>

Upvotes: 0

Views: 373

Answers (3)

mplungjan
mplungjan

Reputation: 177684

Because you populate TaskCount overwriting the link? - try 

$(".TaskCount>a").text(rowCount)

instead

Upvotes: 0

user5454715
user5454715

Reputation: 

<div id="TaskNotification" style="display: inline!important;  float: left; border; 3px solid #8AC007;PADDING: 5px;"> 
<img id="NotificatioImg" class="n-img" "=" src="../SiteAssets/tasks_sm.png?rev=23" alt="Notification">
<div class="TasksCount">
    <a href="../pages/Tasks.aspx">Link</a> 
</div>
</div>

The anchor tag has no text. Just put in some text.

Not what you are looking for? Let me know :)

Upvotes: 3

Nuriddin Rashidov
Nuriddin Rashidov

Reputation: 966

<img class="n-img" "="" src="../SiteAssets/tasks_sm.png?rev=23" alt="Notification">

Upvotes: 0

Related Questions