SORU
20 Mayıs 2009, ÇARŞAMBA


Nasıl "onay" Jquery UI iletişim iletişim?

Ben JQuery UI İletişim javascript:alert() çirkin kutusunu değiştirmek için kullanmayı deneyin. Benim senaryoda, öğelerin bir listesini ve bunların her biri tek tek gelecek, "" her biri için. düğmesini silmek istiyorum var psuedo html Kur şöyle bir şey olacak

<ul>
    <li>ITEM <a href="url/to/remove"> <span>$itemId</span>
    <li>ITEM <a href="url/to/remove"><span>$itemId</span>
    <li>ITEM <a href="url/to/remove"><span>$itemId</span>
</ul>

<div id="confirmDialog">Are you sure?</div>

İçinde UY parçası, belge hazır, ben ilk kurulum div için bir kalıcı iletişim ile gerekli düğme ve o "bir" ateş için onay vermeden önce kaldırmak gibi

$("ul li a").click(function() {
  // Show the dialog    
  return false; // to prevent the browser actually following the links!
}

TAMAM, burada sorun yok. ınit süre boyunca, iletişim (kalem) ateşle olacak hiçbir fikrim yok, ve madde numarası da olacak (!). Kullanıcı nasıl hala seçim EVET, Bunu kaldırmak için bağlantıyı takip eğer sırayla Kur, onay düğmelerinin davranışını miyim?

CEVAP
9 HAZİRAN 2009, Salı


Ben de aynı sorunu çözmek için vardı. Anahtarı almak bu iş oldu dialog olmalı kısmen başlatılmış click olay işleyicisi için bağlantıyı kullanmak istediğiniz onay işlevselliği ile kullanmak istiyorsanız bunun için birden fazla bağlantı). Bu bağlantı için hedef URL onay düğmesi için olay işleyicisi içine enjekte edilmesi gerekir çünkü. Onay davranış olması gerektiğini belirtmek için bir CSS sınıfı kullandım.

İşte benim çözüm, bir örnek için uygun soyutlanmış uzakta.

<div id="dialog" title="Confirmation Required">
  Are you sure about this?
</div>

<script type="text/javascript">
  $(document).ready(function() {
    $("#dialog").dialog({
      autoOpen: false,
      modal: true
    });
  });

  $(".confirmLink").click(function(e) {
    e.preventDefault();
    var targetUrl = $(this).attr("href");

    $("#dialog").dialog({
      buttons : {
        "Confirm" : function() {
          window.location.href = targetUrl;
        },
        "Cancel" : function() {
          $(this).dialog("close");
        }
      }
    });

    $("#dialog").dialog("open");
  });
</script>

<a class="confirmLink" href="http://someLinkWhichRequiresConfirmation.com">Click here</a>
<a class="confirmLink" href="http://anotherSensitiveLink">Or, you could click here</a>

Bu eğer CSS sınıfı (confirmLink, benim örnekte) ile bağlantıları oluşturmak sizin için bir iş olacağına inanıyorum.

İşte bu kod ile jsfiddle.

İlgi tam bilgi veririm not ayırdığım birkaç dakika bu özel sorun ve sağlanan benzer bir cevap this question, olan oldu da olmadan kabul edilen bir cevap.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • DJAndrewRyan

    DJAndrewRyan

    22 Ocak 2007
  • Lancome USA

    Lancome USA

    30 HAZİRAN 2009
  • LIVESTRONG.COM

    LIVESTRONG.C

    5 EKİM 2005