Tag Archives: jQuery

Sampel XSLT dan jQuery

Saya telah melakukan banyak daripada XSLT dan jQuery dan fikir saya akan berkongsi beberapa coretan yang lain mungkin berguna pada masa akan datang.

Contoh 1: Mengeluarkan JavaScript mudah / jQuery dalam XSLT:

<Pemacu:perlawanan template = "sesuatu" xml:angkasa = "memelihara">

<!– Kosong daripada penapis mesra bidang tersembunyi pertanyaan –>
<skrip jenis = "text/javascript">
    $(dokumen).bersedia(fungsi(){
      $("#QueryFriendlyFilters").val("kosong");
    });
</skrip>

</Pemacu:template>

Yang sedikit mengeluarkan beberapa JavaScript yang menunggu halaman untuk menyelesaikan loading (kerana $(dokumen).bersedia(...)) dan kemudian menetapkan nilai medan tersembunyi dinamakan QueryFriendlyFilters kepada nilai literal "kosong".

Contoh 2: Gunakan <Pemacu:jika> untuk memeriksa "lebih besar daripada", "Kurang daripada", dan sebagainya..

<Pemacu:perlawanan template = "sesuatu" xml:angkasa = "memelihara">

<DIV id = "fdcAllFilters">

    <Pemacu:Jika test="@Count>0">
      <rentang class = "fdcFilterLabel">Penapis semasa:</span>
    </Pemacu:jika>

    <!– lebih banyak bahan yang berlaku di sini. –>

</Pemacu:template>

Coretan di atas memeriksa untuk melihat jika satu sifat yang dinamakan "Count" kepada "sesuatu" elemen adalah lebih besar daripada sifar. XML belakang ini akan menjadi sesuatu seperti:"

<sesuatu Count = "5" />

Contoh 3: Melelar melalui semua unsur-unsur, interspersing panggilan jQuery.

<!– Melelar melalui semua penapis dan memaparkan betul pautan. –>
<Pemacu:= Pilih untuk-setiap "UserFilter">

<kelas "FilterHref =" href = "javascript:mySubmitPage('RemoveUserFilter','{@ID}')">[X]</1>

<rentang class = "fdcFilterLabel"><Pemacu:nilai bagi select="@FilterValue"/></span>

<skrip jenis = "text/javascript">

    $(dokumen).bersedia(fungsi(){
        <Pemacu:teks><![CDATA[$("#QueryFriendlyFilters").val( ($("#QueryFriendlyFilters").val() + " ]]></Pemacu:teks>\"<Pemacu:nilai bagi select="@FilterValue"/>\"<Pemacu:teks><![CDATA["));]]></Pemacu:teks>
    });

</skrip>

</Pemacu:untuk setiap>

Coretan di atas adalah yang paling kompleks dan mungkin ada cara yang lebih mudah untuk melakukannya.

XML belakang ini kelihatan lebih kurang seperti ini:

<UserFilter ID = "123" FilterValue = "xyzzy" />

Coretan ini iterating melalui <UserFilter> nod.

Ia mula-mula mengeluarkan tag anchor yang apabila diklik menyembah fungsi JavaScript yang sudah di halaman, "MySubmitPage" dan pas nilai atribut pada <UserFilter> nod dinamakan "ID".

Ia kemudian mengeluarkan beberapa jQuery yang menunggu untuk laman untuk memuatkan. Yang kemaskini jQuery medan tersembunyi yang dinamakan "QueryFriendlyFilters" dengan menambah nilai sifat FilterValue itu. Perhatikan semua gila <Pemacu:teks> dan <![CDATA[ ... ]]> barangan.

Itu sahaja, berharap ia membantu!

</akhir>

Langgan ke blog saya.

Mengikuti aku di Twitter http://www.twitter.com/pagalvin

Lists.asmx, GetListItems dan folder

6 dihantar

Saya telah melakukan beberapa kajian untuk orang hari ini di sekitar perkhidmatan web list.asmx disediakan sebagai sebahagian daripada SharePoint 2010 (dan lebih awal). Dia mampu untuk mendapatkan barangan pada senarai folder akar (termasuk nama-nama sub-folder), tetapi tidak boleh mendapatkan item dalam sub-folder. Saya ada melihat di sekeliling di internets dan ia adalah satu soalan yang menghairankan biasa. Namun, Saya tidak boleh mendapatkan jawapan yang baik untuk soalan mudah, "Jika saya tahu folder, bagaimana saya boleh mendapatkan barangan di dalam folder?" Secara jujur, Saya tidak cuba semua yang sukar kerana saya mahu untuk memikirkan satu ini keluar pada saya sendiri untuk seketika Smile .

Untuk menetapkan ini sehingga, Saya telah mencipta laman web yang bernama "Senario Blogging" dan senarai adat dinamakan "Senarai Custom dengan Sub Folder". Saya kemudian mencipta folder bernama:

Tahun 2005
Tahun 2006
Tahun 2007

Saya menambah beberapa item ke folder "Tahun 2006". Ini adalah apa yang kelihatan seperti:

Kawan saya tidak menulis kod C # tetapi sebaliknya menggunakan Java, supaya sampul surat SOAP adalah apa yang dia benar-benar diperlukan. Untuk mendapatkan, Saya menulis sedikit jQuery dan kemudian digunakan pemain biola untuk mendapatkan HTTP perbualan sebenar.

Berikut adalah jQuery yang berkaitan (Saya disalin kod ke bawah jika anda mahu menyalin / menampal):

Mereka kunci pertama adalah untuk memasukkan kedua-dua <queryOptions> dan <QueryOptions> nod. Kunci kedua adalah bahawa <Folder> nod adalah URL yang pelanggan mempunyai akses.

Mungkin ada cara lain untuk mendapatkan ini, tetapi ini berjalan dengan baik bagi saya apabila menggunakan jQuery.

Berikut adalah sampul surat SOAP untuk di atas:

<soapenv:Xmlns sampul surat:soapenv =’http://schemas.xmlsoap.org / sabun / sampul surat /’>
<soapenv:Badan>
    <GetListItems xmlns =’http://schemas.microsoft.com / SharePoint / sabun /’>
      <listName>Senarai adat dengan Sub Folder</listName>
      <viewFields>
        <ViewFields>
          <FieldRef Nama = 'Tajuk’ />
          <FieldRef Nama = 'EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <Folder>http://demoserver1/Blogging Senario / senarai / Senarai Custom dengan Sub Folder / Tahun 2006</Folder>
        </QueryOptions>
      </queryOptions>
    </GetListItems>
</soapenv:Badan>
</soapenv:Sampul surat>

Banyak contoh-contoh dan perbincangan sekitar ini membawa saya untuk mempercayai bahawa semua saya perlukan adalah <QueryOptions> dan berikan satu nama folder. Bagi saya, Saya perlu kedua-dua balut ia di dalam <queryOptions> serta menentukan URL yang berkelayakan sepenuhnya untuk <Folder> nod.

Berikut adalah persediaan AJAX jQuery:

$(dokumen).bersedia(fungsi() {
       var soapEnv =
           "<soapenv:Xmlns sampul surat:soapenv =’http://schemas.xmlsoap.org / sabun / sampul surat /’> \
               <soapenv:Badan> \
                    <GetListItems xmlns =’http://schemas.microsoft.com / SharePoint / sabun /’> \
                       <listName>Senarai adat dengan Sub Folder</listName> \
                       <viewFields> \
                           <ViewFields> \
                              <FieldRef Nama = 'Tajuk’ /> \
                              <FieldRef Nama = 'EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <Folder>http://demoserver1/Blogging Senario / senarai / Senarai Custom dengan Sub Folder / Tahun 2006</Folder> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:Badan> \
           </soapenv:Sampul surat>";

</akhir>

Langgan ke blog saya.

Mengikuti aku di Twitter http://www.twitter.com/pagalvin

Henti-henti Penyarangan <div> Tag dan jQuery

Tinggalkan pesanan

Ini seolah-olah seperti apa-apa topik oddball, Saya tidak pasti ia adalah blog benar-benar bernilai kira-kira, tetapi itu tidak pernah berhenti saya sebelum, jadi di sini kita pergi Smile

Saya bekerja di sebuah projek di mana saya menarik beberapa data dari carian, pembungkusan ia ke dalam mesej XML dan kemudian bahawa XML akhirnya berubah menjadi HTML melalui XSLT. Ada banyak jQuery terlibat, satu bit yang melaksanakan beberapa fungsi tabbing. Apabila anda klik pada tab (benar-benar, 1 <div>), jQuery menyembah. menyembunyikan() dan. menunjukkan() mengenai pelbagai divs (beban halaman awal memuat turun semua kandungan supaya tidak ada postbacks dalam kes ini).

Sekumpulan jam yang lalu, logik beralih tab mula berkelakuan tidak menentu dan ia tidak akan menunjukkan salah satu tab saya. Saya akhirnya dikesan ia turun kepada fakta bahawa internet explorer (sekurang-kurangnya) berpendapat bahawa <div> tags bersarang jauh, jauh lebih mendalam daripada toolbar pemaju intended.The akan menunjukkan:

-<id div = "Tab1Content">
-<div>
    -<div>
      -<id div = "Tab2Content">
        -<div>
           ..............................
                   </div> <-Akhirnya menunjukkan ia telah ditutup sepanjang jalan ke sini!

Jadi, jika saya melakukan $("# Tab1Content").menyembunyikan(), Saya juga akan menyembunyikan Tab2 dan saya tidak dapat menunjukkan Tab2 jika saya tidak juga menunjukkan Tab1. Saya disalin dan ditampal kod ke dalam studio visual dan ia menunjukkan semua lapisan div terpulang baik, sama seperti mereka sepatutnya melakukan, kelihatan seperti ini:

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

Aku pukul kepala saya ke dinding untuk beberapa ketika dan melihat bahawa dalam HTML kod sebenar telah menjana banyak kosong <div> tags, seperti:

<badan>

<id div = "Tab1Content">

    <div id = "ROW1" />
    <div id = "ROW2" />

</div>

<id div = "Tab2Content">

    <div id = "ROW1" />
    <div id = "ROW2" />

</div>

</badan>

(Di atas adalah waaaaaaaaaaaay terlalu dipermudahkan. Tag div kosong adalah betul-betul sah. Sebahagian daripada saya <div> tags penuh dengan kandungan, tetapi banyak lagi tidak. Saya datang untuk menyedari bahawa saya <Pemacu:untuk setiap> arahan telah mengeluarkan tag div pendek bentuk apabila Pemacu:untuk setiap tidak 'mencari apa-apa data. Aku memaksa satu komen HTML ke dalam output, seperti yang ditunjukkan:

Selepas saya lakukan, semua div itu yang berbaris dengan baik dan menukar tab saya mula bekerja.

Seperti biasa, Saya harap ini membantu seseorang dalam secubit.

</akhir>

Langgan ke blog saya.

Mengikuti aku di Twitter http://www.twitter.com/pagalvin

JQuery lagi lebih–Saiz semula Contoh Imej

Tinggalkan pesanan

Saya mewarisi sebahagian dari web vendor berusia pelanggan dan ia mempunyai masalah saiz imej. Imej harus 60×50 tetapi atas sebab tertentu ganjil, vendor asal memaksa mereka ke dalam 42×42, supaya mereka melihat dihapuskan:

Imej Baik	Bad Image

Berikut adalah markup (agak dipermudahkan):

<jadual class = 'dilanjutkan pandangan'>
<thead>
    <tr>
      <ke width = '100′>3 Selasa</ke>
    </tr>
</thead>

<tbody>
    <tr class = 'ramalan'>
      <td width = '100′>
        <st>
          <li class = 'tinggi'>Tinggi: 72&anda;F</li>
          <li class = 'rendah'>Rendah: 44&anda;F</li>
          <li class = 'keadaan'>Sunny
            <img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/trans/cond007.png’ width = '42’ height = '42’ alt =” />
          </li>
        </st>
      </td>
    </tr>

</tbody>

</jadual>

Anda akan ambil perhatian bahawa walaupun laluan kepada imej itu sendiri menunjukkan dimensi yang betul (60×50) vendor asal memaksanya di 42×42. Mengapa? Gila.

Bagaimanapun, Saya mahu satu penyelesaian yang cepat dan mudah untuk isu ini dan saya beralih kepada jQuery. Silap mata adalah untuk mencari semua yang sesuai <img> tag. Saya tidak mahu bergelandangan dengan mana-mana tag img lain (di mana terdapat banyak). Ini sedikit jQuery tidak menipu:

<skrip jenis = text/javascript"" src ="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></skrip>

<skrip jenis = "text/javascript">
     $(dokumen).bersedia(fungsi () {

         $(' li.condition > img ').setiap(fungsi (indeks, item)
            {
             $(item).css("lebar", "60");
             $(item).css("ketinggian", "50");
            });
     }); // beban dokumen
</skrip>

Itulah sedikit kod mendapati koleksi <li> tag yang kelas adalah "keadaan" dan <img> kanak-kanak. Ia kemudian iterates melalui semua itu. Bekerja seperti azimat.

Saya mungkin boleh menyelaraskan ia, tetapi saya tidak pernah menjadi jenis unix lelaki yang diselesaikan π kepada 18 digit ketepatan menggunakan sed dan awk dan saya bukan jenis yang jika lelaki jQuery sama ada Smile .

</akhir>

Langgan ke blog saya.

Mengikuti aku di Twitter http://www.twitter.com/pagalvin

Ambil Kawalan OK dan butang Batal

3 dihantar

Saya menulis artikel ini belakang manakala, tetapi kelihatan seperti saya tidak link ke dari blog saya pada masa yang, jadi di sini pergi:

Artikel ini menerangkan bagaimana untuk memaksa newform.aspx melencong ke satu halaman apabila pengguna klik OK dan halaman yang berbeza apabila dia klik membatalkan.

</akhir>

Langgan ke blog saya.

Mengikuti aku di Twitter http://www.twitter.com/pagalvin

Tip Pantas: Menambah jQuery untuk MOSS Penerbitan Pages

1 Balas

Apabila meningkatkan laman Dengan menerbitkan MOSS menggunakan jQuery, Saya melanda benjolan kelajuan berikut:

Ralat pelayan di ' /’ Permohonan.

Ralat penghurai

Penerangan: Ralat berlaku semasa menghuraikan daripada sumber yang diperlukan untuk perkhidmatan permintaan ini. Sila menyemak butiran berikut ralat hurai tertentu dan mengubah suai fail sumber anda dengan sewajarnya.

Ralat penghurai Mesej: Sahaja kawalan Kandungan dibenarkan langsung dalam halaman kandungan yang mengandungi kawalan Kandungan.

Ralat Source:

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

Fail Sumber: /_catalogs / masterpage / KCC_FacultyMember.aspx Talian: 12

Maklumat Versi: Rangka Kerja Microsoft. Versi BERSIH:2.0.50727.4927; ASP.NET Version:2.0.50727.4927

Ia cukup mudah untuk menetapkan (h / t untuk rakan sekerja saya, Uday Ethirajulu). Pastikan bahawa kod jQuery tinggal di dalam "PlaceHolderAdditionalPageHead" seperti yang ditunjukkan:

<ASP:Kandungan ContentPlaceholderID = "PlaceHolderAdditionalPageHead" runat = "pelayan">

<skrip

    jenis = text/javascript""

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

</skrip>

<skrip jenis = "text/javascript">

$(dokumen).bersedia(fungsi() {

   // Barangan jQuery Brilliant pergi sini.

   });

</skrip>

</akhir>

Langgan ke blog saya.

Mengikuti aku di Twitter http://www.twitter.com/pagalvin