The onclick in the parent div and the parameterized function in the other div are triggered at the same time. How do I prevent the parent from firing?

Question

<div class="@renkClass prgOzet" data-link="@Url.Action("ProgramOzetTooltip", "Program", new { ID = item.ID, area = "yonetim", TurID = item.TurID,Tarih=item.Tarih.Value.ToString("dd.MM.yyyy HH:mm") })">
   @if (Fonksiyonlar.YetkiKontrol("Program Ekle##") && isPrgGosterim && !Model.Filtre.isDisardan && (!isKisitli ||
   (isKisitli &&((GunSinir == (int)Sabitler.ProgramGunSinir.SadeceGecmis && Trh.Date >= BugunBas) ||
   (GunSinir == (int)Sabitler.ProgramGunSinir.SadeceGelecek && Trh.Date <= BugunSon) ||
   (GunSinir >= 0 && (Trh.Date >= SinirBasTarih && Trh.Date < SinirBitTarih))))))
   {
    <div class="yeniekle hidden-print" onclick="YeniProgramModal(0,'@string.Format("{0:00}", Trh.Hour):00','@(Trh.ToString("dd-MM-yyyy"))');"><span><i class="fa fa-plus"></i> yeni ekle</span></div>
   }

prgOzet datalink and yeniekle onclick are triggered at the same time. Clicking yeniekle triggers on prgOzet. How do I get only yeniekle to trigger

 function YeniProgramModal(ID, sa, tarih, TurID) {
    $('.tooltipster-base').css('pointer-events', 'none');
    $('#HizliKayitEkle iframe').attr("src", "/yonetim/program/HizliKayit?ID=" + ID + "&sa=" + sa + "&GelisTarihi=" + tarih + "&TurID=" + TurID);
    $('#HizliKayitEkle iframe').attr("height", $(window).height());
    $('#HizliKayitEkle').modal();
    $('.tooltipster-base').css('opacity', '0');
  }

I added tooltipster display none to prevent other one from opening when YeniProgramModal is opened but it didn't work

Answer 1

Use basic event Object methods inside an event handler.

• To stop propagation up the DOM tree, event.stopPropagation() ,
• To stop immediate propagation to other event listeners added to the same element, event.stopImmediatePropagation() , and
• To prevent browser default actions for the event (eg pressing space to scroll down the page in a keyboard event handler), event.preventDefault() .

These event methods are also documented in jQuery API documentation.