Dojo - Programlı olarak ToolTip Dialog'u bağlantı oluşturmak için nasıl bağlantı kurabilirsiniz

Question

Başlığın belirttiği gibi. Bağlantıyı tıkladıktan ve bu içeriğe özel içerik yükledikten sonra TooltipDialog'u oluşturmak istiyorum. Araç ipucu gövdesi tam yer tutucudur, bunu işlemek için herhangi bir sunucu mantığı yapmadım. Şimdiye kadar ben bu noktaya var:

  PreviewThread: function (ThreadID) { 

      var tooltip = new dijit.TooltipDialog({ 
       href: "/Account/SingIn?ReturnUrl=" + Jaxi.CurrentLocation 
      }); 
     }, 

<a href="javascript:Jaxi.PreviewThread(@thread.ThreadID)" class="preview-thread" id="@tp.ToString()">Preview</a> 

noktası iletişim kutusuna, içerik yüklemek için, ama nasıl ilk etapta açmak için bile nasıl değil mi? Bir şekilde çalışıyor

  PreviewThread: function (ThreadID) { 

      var tooltip = new dijit.TooltipDialog({ 
       href: "/Account/SingIn?ReturnUrl=" + Jaxi.CurrentLocation, 
       closable: true 
      }); 
      dojo.query(".thread-preview").connect("onclick", function() { 
       dijit.popup.open({ popup: tooltip, around: this }); 
      });    
     }, 

:

daha googling ve yargılama Sonunda bu lazım & hata sonra. ToolTipDialog açılır, ancak .. İki kez tıklamam gerekir ve dışarıdan tıkladıktan sonra veya mouseleave'den sonra iletişim kutusunu kapatamıyorum.

Tamam bu, dev kütük gibi göz başlayacağım ama umarım diğerlerine bazı headchace kazandıracak:

Sonunda istediğiniz yere pop-up başardı için: Ben

  PreviewThread: function (ThreadID) { 

      var tooltip = new dijit.TooltipDialog({ 
       href: "/Account/SingIn?ReturnUrl=" + Jaxi.CurrentLocation, 
       closable: true 
      }); 

      dijit.popup.open({ popup: tooltip, around: dojo.byId("thread-preview-" + ThreadID) }); 
     }, 
<a href="javascript:Jaxi.PreviewThread(@thread.ThreadID)" id="@tp.ToString()" >Click Me</a> 

Not Asp .NET MVC kullanarak m. sol Şimdi tek şey bunu iki yolu afaik vardır .. kullanıcı dostu bir şekilde lanet şeyi kapatmak için

Answer 1

olduğunu, ve ikisi de tbh ilk dijit.popup.open() kullanmaktır :-P

çok şık ve iletişim kutusunu göstermek ve gizlemek için close(). Bu durumda istenen koordinatları sağlamanız gerekir. Ben sadece bir iş parçacığı kimliği ile PreviewThread fonksiyonunu sağlamak görmek, ama aynı zamanda olay nesnesinin tack varsayarak, yapabileceğiniz: Bu yöntemi kullanarak bittiğinde

PreviewThread: function (ThreadID, event) { 

    Jaxi.tooltip = new dijit.TooltipDialog({ 
     href: "/Account/SingIn?ReturnUrl=" + Jaxi.CurrentLocation 
    }); 
    dijit.popup.open({ 
     popup: Jaxi.tooltip, 
     x: event.target.pageX, 
     y: event.target.pageY 
    }); 
} 

, el ile de yakın zorunda Örneğin, dışarıdaki bir şey tıklandığında açılır. Bu, araç çubuğunuzda dijit için bir yere ihtiyacınız olduğu anlamına gelir, örneğin yukarıda yaptığım gibi Jaxi.tooltip. (Yan not: dijit.TooltipDialog aslında bir singleton, bu yüzden sayfanızın etrafında birçok gizli araç ipucu olmayacak). Genellikle, araç ipucu iletişim kutularını gizlemek için böyle bir şeyle sonuçlanırım.

dojo.connect(dojo.body(), "click", function(event) 
{ 
    if(!dojo.hasClass(event.target, "dijitTooltipContents")) 
     dijit.popup.close(Jaxi.tooltip); 
}); 

Bu elbette sizin için işe yaramayabilir, bu nedenle, özel düzenlemenize uyan bir şey bulmak zorundasınız.

İkinci yol, dijit.form.DropDownButton'u kullanmaktır, ancak bir bağlantıymış gibi şekillendirmektir. Bu konuda ayrıntılara girmeyeceğim, sadece sayfanıza bir DropDownButton getirin ve düzenli bağlantılar gibi görünene kadar Firebug'u kullanın. FYC, link to DropDownButton reference guide.

Answer 2

Sen deneyebilirsiniz: Eğer iletişim dışına fareyi moove olarak

PreviewThread: function (ThreadID) { 

     var tooltip = new dijit.TooltipDialog({ 
      href: "/Account/SingIn?ReturnUrl=" + Jaxi.CurrentLocation, 
      closable: true, 
      onMouseLeave: function(){dijit.popup.close(tooltip);} 
     }); 

     dijit.popup.open({ popup: tooltip, around: dojo.byId("thread-preview-" + ThreadID) }); 
}, 

Bu en kısa sürede iletişim kutusunu kapatacaktır.

Kontrol olası tüm etkinlikler için API: http://dojotoolkit.org/api/