prevent the behabiour of a link when we click on a span which is inside the link tag javascript

Hi i am using ng repeat on a div using angualar js. This div has a link tag inside it which is wrapping the while tags.the a link tag also has a span tag which has a class btnConatctme when i click on this span then a bootstarp modal is popping up but when the page is also redirecting to the src in the link tag.i have also tried to use this

$('.btnConatctme').on('click',function(e){
    e.preventDefault();
});

but still tha page is redirecting what i want to do is when we click on the whole a link then the page should redirect to the src which is given in the a link tag.but when we click on btnConatctme span then the bootstarp modal should popup and page does not redirect to next page here is my full code of the div which is inside ng-repeat

<div class="todo-tasklist"  >
   <a href="{{ url('post-shipments/user_view') }}" class="divShipments">
        <div class="todo-tasklist-item todo-tasklist-item-border-green">
            <div class="col-md-12">
              <img class="todo-userpic pull-left" src="{{ url('default/img/document.jpg') }}">
              <div class="todo-tasklist-item-title"> shipment Name 
                <span class="pull-right">
                    <span class="todo-tasklist-badge"> 21 DAYS LEFT</span>&nbsp;
                    <span class="todo-tasklist-badge btnConatctme"  data-toggle="modal" data-target="#myModal"> Contact me</span>&nbsp;
                </span>
              </div>
            </div>
        </div>
    </a>
</div>

here is the website page link on which i am using it i am using angular js in it to kindly help me on this it will be really appreciated

Upvotes: 2

Views: 2335

Answers (2)

Ibrahim Khan
Ibrahim Khan

Reputation: 20740

You can do it like below. Hope this will help you.

$('body').on('click', '.divShipments', function(e){
     if(e.target.className=='btnConatctme') 
         e.preventDefault();
})

Upvotes: 3

zer00ne
zer00ne

Reputation: 43910

$('.btnConatctme').on('click',function(e){
    e.preventDefault();
    e.stopImmediatePropagation();
});

Alternative:

$('.btnConatctme').on('click',function(e){
    e.preventDefault();
    e.stopPropagation();
});

Upvotes: 2

Related Questions