Etiket Arşivleri: jQuery

xslt ve jQuery örnekleri

Ben, XSLT ve jQuery ve diğerleri gelecekte yararlı olabilir birkaç pasaj paylaşmak düşündüm bir sürü yapıyor.

Örnek 1: Basit JavaScript yayarlar / XSLT'de jQuery:

<XSL:şablon eşleme "bir şeyler =" XML:Uzay = "korumak">

  <!– Sorgu dostu filtreler gizli alanı boş –>
  <komut dosyası türü "metin/javascript" =>
    $(Belge).hazır(işlevi(){
      $("#QueryFriendlyFilters").Val("boş");
    });
  </komut dosyası>

</XSL:Şablon>

Bu sayfa yükleme bitirmesini bekler bazı JavaScript yayar (Çünkü $(Belge).hazır(…)) ve sonra gizli alan değerini QueryFriendlyFilters hazır bilgi değeri "boş" adlandırılmış kümeleri.

Örnek 2: Kullanımı <XSL:Eğer> "daha büyük" kontrol etmek için,  "daha az", vb.

<XSL:şablon eşleme "bir şeyler =" XML:Uzay = "korumak">

  <div id = "fdcAllFilters">
 
    <XSL:Eğer test="@Count>0">
      <span class = "fdcFilterLabel">Geçerli filtreleri:</yayılma>
    </XSL:Eğer>

    <!– Burada daha fazla şeyler olur. –>

</XSL:Şablon>

Yukarıdaki pasajı "Count"bir şey"unsuru" adlı bir öznitelik sıfırdan büyük olup olmadığını görmek için denetler.  Bunun arkasında XML gibi bir şey olurdu.:”

<bir şey saymak "5" = />

Örnek 3: Tüm öğeleri boyunca yineleme yapmak, jQuery aramalar Interspersing.

<!– Tüm filtreler aracılığıyla yinelemek ve doğru görüntüleme  Linkler. –>
<XSL:için her select = "UserFilter">

  <bir sınıf "FilterHref =" href = "javascript:mySubmitPage('RemoveUserFilter','{@ID}’)">[X]</bir>

  <span class = "fdcFilterLabel"><XSL:değer-in select="@FilterValue"/></yayılma>

  <komut dosyası türü "metin/javascript" =>

    $(Belge).hazır(işlevi(){
        <XSL:metin><![CDATA[$("#QueryFriendlyFilters").Val( ($("#QueryFriendlyFilters").Val() + " ]]></XSL:metin>\"<XSL:değer-in select="@FilterValue"/>\"<XSL:metin><![CDATA["));]]></XSL:metin>
    });

  </komut dosyası>

</XSL:for-each>

Yukarıdaki pasajı en karmaşık ve orada-ebilmek var olmak daha kolay yolları.

Bunun arkasında XML kabaca şöyle görünür:

<UserFilter kimliği "123" FilterValue = "xyzzy" = />

Bu pasajı Nesnesi'nde <UserFilter> düğümler. 

İlk çapa yayar ki tag tıklatıldığında sayfasında bir JavaScript işlevi çağırır, "mySubmitPage" ve bir öznitelik değeri <UserFilter> düğüm "Kimlik" adında. 

Sonra da sayfanın yüklenmesini bekler bazı jQuery yayar.  Bu jQuery FilterValue özniteliğinin değeri ekleyerek "QueryFriendlyFilters" isimli bir gizli alanını güncelleştirir.  Not tüm deli <XSL:metin> ve <![CDATA[ … ]]> malzeme.

İşte bu, umut etmek bu yardım etmek!

</sonunda>

Benim blog abone.

Heyecan beni izleyin http://www.twitter.com/pagalvin

Lists.asmx, GetListItems ve klasörler

Birinin etrafında bugün SharePoint bir parçası olarak sağlanan list.asmx web hizmeti için bir araştırma yaptığını 2010 (ve önceki sürümleri).  O was güçlü-e doğru kök klasörde liste öğelerini almak için (alt klasörleri adları da dahil olmak üzere), öğeleri alt klasörlere alamadım ama.  Bazı Internets üzerinde etrafa yaptı ve şaşırtıcı ortak bir soru.  Henüz, Basit bir soru için iyi bir cevap alamadım., "Ben klasörü biliyorsanız, klasördeki öğelerin nasıl alabilirim?”  Dürüst olmak gerekirse, Ben kendi dışarı bu bir şekil bir süre istedim çünkü bu zor deneyin vermedi Gülümseme.

Bunu ayarlamak için, "Bloglama senaryoları" adlı bir site ve "Özel liste ile alt klasörler" adlı özel bir liste oluşturdum.  Sonra adlı klasör oluşturdu:

  • Yıl 2005
  • Yıl 2006
  • Yıl 2007

Ben birkaç öğe "2006 yılı" klasöre eklendi.  Ne gibi görünüyor olmasıdır.:

image

Arkadaşım değil ama C# kodu yazmak yerine Java yazılımını kullanma, Yani o gerçekten gerekli soap zarfının oldu.  Almak için, JQuery biraz yazdı ve fiddler kullanılmış gerçek http oturumu almak.

İşte ilgili jQuery (Kopyala/Yapıştır istiyorsanız kodu aşağı aşağıda kopyaladığım):

image

Onlar ilk anahtarıdır hem de içerecek şekilde bir <queryOptions> ve <QueryOptions> düğüm.  Bu ikinci anahtarıdır <Klasör> düğüm istemci erişimi olan bir url..

Bu almak için başka yollar olabilir, ama bu amele su kuyusu için beni ne zaman jQuery kullanarak.

İşte yukarıdaki için soap Zarfı:

<soapenv:Zarf xmlns:soapenv =’http://schemas.xmlsoap.org/SOAP/envelope/’>                
  <soapenv:Vücut>
    <GetListItems xmlns =’
http://schemas.microsoft.com/SharePoint/SOAP/’>
      <listName>Alt klasörler içeren özel bir liste</listName>
      <viewFields>  
        <ViewFields>
          <FIELDREF Name =' başlığı’ />
          <FIELDREF Name ='EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <Klasör>
http://demoserver1/blog Senaryo/listeleri/özel liste ile alt klasörler/yıl 2006</Klasör>
        </QueryOptions>
      </queryOptions>
   
</GetListItems>
  </soapenv:Vücut>
</soapenv:Zarf>

Örnekler ve bu tartışma çok bana tüm ihtiyacım olduğuna inanmak yol açtı <QueryOptions> ve bir klasör adı belirtin.  Benim için, [NULL]'Sarmak hem de içine <queryOptions> hem de tam bir url belirtin <Klasör> düğüm.

İşte jQuery ajax kurulumu:

$(Belge).hazır(işlevi() {
       var soapEnv =
           "<soapenv:Zarf xmlns:soapenv =’http://schemas.xmlsoap.org/SOAP/envelope/’> \
               <soapenv:Vücut> \
                    <GetListItems xmlns =’http://schemas.microsoft.com/SharePoint/SOAP/’> \
                       <listName>Alt klasörler içeren özel bir liste</listName> \
                       <viewFields> \
                           <ViewFields> \
                              <FIELDREF Name =' başlığı’ /> \
                              <FIELDREF Name ='EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <Klasör>http://demoserver1/Blogging Senaryo/listeleri/özel liste ile alt klasörler/yıl 2006</Klasör> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:Vücut> \
           </soapenv:Zarf>";

</sonunda>

Benim blog abone.

Heyecan beni izleyin http://www.twitter.com/pagalvin

Sonsuz yerleştirme <div> Etiketler ve jQuery

Bu tür bir tuhaf konu gibi görünüyor, Bloglama hakkında gerçekten değer emin değilim, Ama bu beni daha önce hiç durdurmadı, Yani burada biz gitmek Gülümseme

Bir ara bazı verileri nerede çekiyorum bir proje üzerinde çalışma dışarı, ve sonra bu XML bir XML iletisi ambalaj sonuçta XSLT ile HTML içine aktarılır.  JQuery bir sürü, bir çeşit bazı sekmeler işlevselliğini uygular.  Bir sekmeyi tıklattığınızda (Gerçekten, bir <div>), jQuery yerleştirilmiş çağırır() ve göster() çeşitli divs (Yani hiç postbacks bu durumda ilk sayfa yükleme tüm içerik indirme).

Birkaç saat önce, mantık geçiş sekmesini hatalı davranmaya başladı ve sekmelerimden biri göstermek değil.  Ben sonuçta o Internet Explorer'ın aslında izlenen (en az) düşündüm ki <div> çok iç içe Etiketler, amacı daha çok daha derin.Geliştirici araç çubuğu gösterir:

-<div id = "Tab1Content">
  -<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           …………………………
                   </div>  <-son olarak gösterilen buraya yuvarlandıysa kapatıldı!

Yani, Ben yaptım bir $("#Tab1Content").gizle(), Sekme2'de saklanırdım ve asla ben de Sekme1 gelmedi Sekme2 gösterebilirim.  Visual studio ve tüm div's astar kadar güzel gösterdi kodu kopyaladım ve, Sadece onlar yapmak gerektiği gibi, Bu şekilde:

-<div id = "Tab1Content">
  +<div>
  +<div>
-<div id = "Tab2Content">
  +<div>
  +<div>

Bir süre için kafamı duvarlara yendi ve gerçek HTML'de boş bir sürü kod üreten fark <div> Etiketler, gibi:

<vücut>

  <div id = "Tab1Content">

    <div ID "row1" = />
    <div ID "row2" = />

  </div>

  <div id = "Tab2Content">

    <div ID "row1" = />
    <div ID "row2" = />

  </div>

</vücut>

(Yukarıdaki oversimplified waaaaaaaaaaaay olduğunu.  Boş div Etiketler tamamen geçerli. Bazıları benim <div> Etiketler tam içerik, Ancak çok daha fazla.  Gerçekleşme geldi bu benim <XSL:for-each> yönergelerinin kısa formlu yayan div Etiketler zaman xsl:Her için değil ' herhangi bir veri bulmak.  Bir HTML açıklama çıkış zorla, görüldüğü gibi:

image

 

O benden sonra, div's güzel dizilmiş ve etiket anahtarlama çalışmaya başladı..

Her zaman olduğu gibi, Bunu kimse bir tutam yardımcı olur..

</sonunda>

Benim blog abone.

Heyecan beni izleyin http://www.twitter.com/pagalvin

Henüz daha jQuery–Resim örneği yeniden boyutlandırma

Bir istemcinin eski satıcıdan bir web bölümü miras ve görüntü boyutu sorun vardır.  Görüntüleri-meli var olmak 60×50 Ama bazı tuhaf nedenle, özgün satıcısı onları 42 zorla×42, ezilmiş görünüyorlar:

 

İyi görüntü

Kötü görüntü

İşte biçimlendirme (biraz Basitleştirilmiş):

<Masa sınıf 'genişletilmiş-outlook' =>
  <thead>
    <tr>
      <inci  Genişlik ='100′>3 Salı</inci>
    </tr>
  </thead>

  <TBODY>
    <tr sınıf 'tahmin' =>
      <TD genişliği ' 100 =′>
        <ul>
          <li sınıf 'yüksek' =>Yüksek: 72&değ;F</Li>
          <li sınıf 'düşük' =>Düşük: 44&değ;F</Li>
          <li sınıf 'durumu' =>Güneşli
            <img src =’
http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/En/Trans/cond007.png’ Genişlik ='42’ Yükseklik ' 42 =’ alt =” />
          </Li>
        </ul>
      </TD>
    </tr>

  </TBODY>

</Tablo>

Olsa bile bu dikkat edeceğiz görüntünün kendisini yolu uygun boyut gösterir (60×50) özgün satıcısı 42 yılında zorla×42.  Neden?  Deli.

Yine de, Bu hızlı ve kolay bir çözüm istedi ve jQuery için döndü.  Hile tüm uygun bulmak için yapıldı. <IMG> Etiketler.  Diğer img etiketleri ile muck istemedim. (var olan birçok).  JQuery bu bit did belgili tanımlık hüner:

<komut dosyası türü = text/javascript"" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></komut dosyası>

<komut dosyası türü "metin/javascript" =>
     $(Belge).hazır(işlevi () {

         $(' li.condition > img').Her(işlevi (Dizin, Madde)
           
{
             $(Madde).CSS("genişliği", "60"); 
             $(Madde).CSS("Yükseklik", "50");
            });
     }); // belge üzerindeki yük
</komut dosyası>

Bu boyutta bir kod koleksiyon bulur <Li> Etiketler sınıftır "durum" ve <IMG> çocuklar.  O zaman bütün bunlar sırayla dolaşır.  Amele beğenmek a çekicilik.

Muhtemelen bu düzene, Ama hiç bir π çözülmüş bir UNIX adam Hedef 18 basamaklı duyarlık kullanarak SED ve awk ve jQuery ya adam ben bu kadar değilim Gülümseme.

</sonunda>

Benim blog abone.

Heyecan beni izleyin http://www.twitter.com/pagalvin

Tamam ve İptal düğmelerini denetimini al

Ben yazdı Bu makale bir süre önce, ama ben ona zaman--dan benim blog bağlantı değil gibi görünüyor, Bu yüzden buraya:

image

Bu makalede, nasıl o iptal tıkladığında kullanıcı Tamam ve farklı bir sayfaya tıkladıktan sonra bir sayfaya yeniden yönlendirmek için newform.aspx zorlamak için.

</sonunda>

Benim blog abone.

Heyecan beni izleyin http://www.twitter.com/pagalvin

Çabuk uç: JQuery MOSS yayımlama sayfalarına ekleme

Ne zaman MOSS yayın sayfaları jQuery kullanarak geliştirme, Aşağıdaki hız tümseği vurmak:

Sunucu hatası ' /’ Uygulama.


Ayrıştırıcı hatası

Açıklama: Bu isteğe hizmet vermek için gereken kaynak çözümlenmesi sırasında bir hata oluştu. Lütfen aşağıdaki özel ayrıştırma hatası ayrıntılarını gözden geçirin ve kaynak dosyanızı uygun biçimde değiştirin.

Ayrıştırıcı hatası iletisi: İçerik denetimleri, içerik denetimleri içeren bir içerik sayfasında doğrudan yalnızca izin verilir.

Kaynak hatası:

 
Line 10: 
Line 11: 
Line 12: <script 
Line 13:     type="text/javascript" 
Line 14:     src="/jQuery/jquery-1.4.min.js"> 

Kaynak dosya: /_catalogs/masterpage/KCC_FacultyMember.aspx    Satır: 12


Sürüm bilgisi: Microsoft.net Framework sürüm:2.0.50727.4927; ASP.net Version:2.0.50727.4927

Tamir etmesi kolay (h/t benim meslektaşım, Uday Ethirajulu).  JQuery kod gösterildiği gibi "PlaceHolderAdditionalPageHead" içinde yaşayan emin olun:

<ASP:İçerik ContentPlaceHolderID = "PlaceHolderAdditionalPageHead" runat = "server">

<komut dosyası

    türü metin/javascript"="

    src="/jQuery/jQuery-1.4.min.js">

</komut dosyası>

<komut dosyası türü "metin/javascript" =>

  $(Belge).hazır(işlevi() {

   // Muhteşem jQuery in buraya gelecek.

   });

</komut dosyası>

</sonunda>

Benim blog abone.

Heyecan beni izleyin http://www.twitter.com/pagalvin