jQuery & Sharepoint

If using jQuery with SharePoint 2010, ALWAYS put jQuery into ëno conflict modeí via jQuery.noConflict(). This is necessary because SharePointís internal JavaScript uses the $ symbol as a variable name in a couple of places, and this causes clashes since itís the alias used by jQuery

The deck has information on my ë3 core techniquesí for jQuery/AJAX apps with SharePoint, and also tips and tricks like how to get Intellisense for jQuery and the SP2010 Client Object Model, tools for debugging AJAX apps etc. The code samples cover a fairly wide range of things:

jQuery
– Showing/hiding elements
– Setting the HTML of an element
– Cascading dropdowns
– AJAX requests
– Client Object Model
– Fetching simple data
– Implementing a ìtype-ahead filteringî sample against the documents in a document library
– Creating data e.g. a new list item
– Techniques for reducing the data going over the wire (by 95% in my example!)
– jQuery + HTTP handlers

Why/how
– Returning simple data
– Returning complex data as JSON

You can download my slide deck and code samples from:

http://dl.dropbox.com/u/11342240/ChrisOBrien_jQueryAJAXSP2010_SamplesAndDeck.zip

jQuery load();

Run a function when the page is fully loaded including graphics.

 $(window).load(function () {
 // run code
 });

jQuery ile iframe içeriğine ulaşmak

$('iframe').contents().find('div');

DropDown menu iframe problem

Sayfada PDF görüntüleyen iframe varsa diğer html öğeleri (dropDown menü gibi), iframe üzerinde görüntülenemiyor. Tabi bu sorun sadece IE’ de mevcut. Diğer tarayıcılarda sorun yok.

Bu sorunu aşabilmek için, görüntülenecek olan html öğe bir başka iframe üzerinde olmalıdır.

Dropdown menü için jQuery ile çözümü;

$('.menu li').each(function(){
if($('ul', this).length){
$(this).hover(
function(){
$(this).append('<iframe height="'+$('> ul', this).height()+'" width="'+$('> ul', this).width()+'" frameborder="0" style="position:absolute;left:100%;top:0px;display:block;z-index:1;"></iframe>');
$('> ul', this).css({zIndex:'1000'}).show();
},
function(){
$('> iframe ', this).remove();
$('> ul', this).hide();
}
);
}
});

Schism