archivi categoria: jQuery e SharePoint

Superare il fastidioso problema con gli URL relativi in lancio rapido di SharePoint

Volevo aggiungere un link per la navigazione veloce lancio l'altro giorno e mi ha detto che SharePoint:

image

Versione testo puro di che è:

Verificare che l'URL è valido e inizia con un carattere valido (cancelletto (#) o barra (/)) o un protocollo valido supportato (per esempio, ' http://’, ' https://’, ' file://’, ' ftp://’, ' mailto:’, ' notizie:’).

"Blech e pox!"Ho detto.

Una soluzione alternativa a questo è utilizzare JavaScript per trovare un link noto nel lancio rapido ed eseguire l'override del relativo comportamento.

Per testare questa, aggiungere un nuovo link al tuo sito di prova questa convenzione:

image

Ho usato jQuery. Per risolverlo, ottenere alcuni JavaScript e jQuery nella pagina utilizzando la vostra tecnica preferita e con una riga di codice come questo:

 

$(documento).pronto( funzione () {

    $("un:contiene('Test sostituzione URL')").fare clic su(funzione () { avviso("comportamento modificato Clicca!"); ritorno falso;});

});

E tuo zio Bob.

Il selettore di jQuery trova ogni <un> Tag che ha "Sostituzione del Test URL" nel suo nome. È possibile trovare-melodia che a seconda del tuo link e simili.

La Clicca(funzione() esegue l'override di qualsiasi SharePoint avrebbe fatto quando l'utente fa clic su. Assicurarsi che "return false", altrimenti sarà fare la tua roba e poi provare a href cosa troppo, che non è quasi certamente il vostro obiettivo.

Questo è stato fatto e prova in un ambiente di SharePoint online, ma dovrebbe funzionare bene in 2010 e all'inizio troppo.

</fine>

undefinedIscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Semplice e veloce: Risolvere "parametro URL non valido” problema con UpdateListItems in lists

Quando si lavora con UpdateListItems via lists, è facile da generare l'errore:

Parametro URL non valido.

L'URL fornito contiene un comando o un valore non valido. Si prega di controllare nuovamente l'URL.

È possibile ottenere questo errore quando si dimentica di includere ID nell'elenco dei campi per l'aggiornamento.  Questo, come un sacco di questi SP servizi web, è un po' controintuitivo, poiché è necessario includere l'ID nell'attributo ID della <Metodo> elemento.  E tu non sei aggiornato ID e probabilmente mai desidera in primo luogo.

Questa busta SOAP opere:

<soapenv:Busta xmlns:soapenv =' http://schemas.xmlsoap.org/soap/envelope/'>
  <soapenv:Corpo>                      
    <UpdateListItems xmlns =' http://schemas.Microsoft.com/SharePoint/SOAP/'>                     
      <listName>{C712E2EA-54E1-47AD-9D99-1848C7773E2F}</listName>                     
        <aggiornamenti>                     
         <Lotto OnError ="Continuare">
          <Metodo ID =1"" Cmd ="Aggiornamento">
            <Nome campo ="CooperativeLock">bloccato!</Campo>
            <Nome campo ="ID">1</Campo>
          </Metodo>
        </Lotto>                     
        </aggiornamenti>                
      </UpdateListItems>             
  </soapenv:Corpo>         
</soapenv:Busta>

Se striscia fuori il riferimento del campo ID, si otterrà il fastidioso messaggio "Parametro URL non valido".

</fine>

undefinedIscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

 

Povero uomo di memorizzazione nella cache in JavaScript

[TL;Versione DR: utilizzare i cookie per memorizzare i risultati delle chiamate asincrone; rendere immediatamente i risultati delle precedenti chiamate asincrone e poi convalidarli dopo il caricamento della pagina.]

Sto lavorando sul sito intranet SharePoint per un cliente che caratterizza, tra le altre cose, una navigazione secondaria stilizzato cui opzioni di menu sono gestiti tramite un elenco personalizzato di vecchio regolare.  L'idea è che il cliente ottiene controllare il menu del "loro" sito senza influenzare o colpiti dalla navigazione globale messa da esso.

(c'è qualcosa di incredibilmente sovversiva sull'aggiunta di un CEWP che punta a un file HTML che carica alcuni CSS e JS per modificare sostanzialmente quasi tutto ciò che riguarda il comportamento di un sito... ma che è per un altro post)

Il codice per questo abbastanza semplice:

Qui il punto dolente è che ogni volta che qualcuno colpisce una delle pagine del sito, browser web dell'utente è protesa per ottenere elementi dall'elenco.  Una volta dev è completa e test ha dimostrato le cose per essere stabile e completa, Questa chiamata è inutile più di 99% del tempo poiché il menu cambia raramente.  Ha anche un effetto strano di UI che è comune in questo mondo nuovo iper-ajaxy siti web – il rendering della pagina e solo allora esegue il rendering dal menu.  È nervosa e fastidioso a mio parere.  E nervosa. Così, memorizzazione nella cache. 

Ho modificato la logica di questa convenzione:

  • Cercare un cookie nel browser che contiene il menu come ultima leggerla
    • Se trovato, rendere immediatamente.  Non aspettare che la pagina completare il caricamento.  (È necessario assicurarsi che il codice HTML è strategicamente collocato qui, ma non è difficile da fare).
  • Attendere la pagina di finire il caricamento e fare un async chiamare per caricare le voci di menu da un elenco utilizzando il resto o lists o qualunque
  • Confrontare quello che ho ottenuto con il cookie
    • Se corrisponde a, FERMATA
    • In caso contrario, usando jQuery, popolare dinamicamente un mazzo se <li>di in un <UL>
  • Utilizzare i CSS per fare la formattazione
  • Profitto!

Alcuni di voi stanno andando a dire, "Ehi! non non c'è nessun reale cache succedendo qui dato che stai leggendo il menu comunque ogni singola volta.”  E hai ragione-non sto dando il server qualsiasi tipo di pausa.  Ma perché la chiamata è async e accade dopo che la pagina iniziale di payload HTML rende pienamente, ci si "sente" più reattivo all'utente.  Il menu rende abbastanza tanto come disegna la pagina.  Se il menu succede al cambiamento, l'utente è soggetto a un ri-disegnare nervosa del menu, ma solo che una volta.

Ci sono alcuni modi per rendere più efficace questa memorizzazione nella cache e il server possono aiutare allo stesso tempo:

  • Mettere in una regola che il "cookie cache" è valida per un minimo di 24 ore o qualche altro lasso di tempo. Finchè non non c'è alcun cookie scaduti, utilizzare snapshot menu del cookie e mai colpito il server.

Beh... questo è tutto quello che mi vengono in mente ora :). 

Se qualcuno ha qualche idea intelligente qui mi piacerebbe conoscerli.

E infine – questa tecnica può essere utilizzata per altre cose.  Pagina su questo client ha un certo numero di cose basate su dati sulle varie pagine, molti di loro modifica relativamente raramente (come una volta a settimana o una volta al mese).  Se destinazione specifiche aree di funzionalità, si può dare un'interfaccia utente più reattiva tirando il contenuto dall'archivio locale cookie e rendendo immediatamente.  Ci si sente più velocemente all'utente anche se non si sta salvando il server qualsiasi cicli.  Si può salvare i cicli server decidendo su alcune condizioni e trigger per invalidare questa cache cookie locale.  Che è tutto situazionale e artsy roba e veramente la più divertente :). 

</fine>

undefinedIscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Campioni di XSLT e jQuery

Ho fatto un sacco di XSLT e jQuery e ho pensato di che condividere alcuni frammenti che altri possono trovare utili in futuro.

Esempio 1: Emettono semplice JavaScript / jQuery in XSLT:

<xsl:partita modello = "qualcosa" XML:Space = "preserve">

  <!– Vuoto il campo nascosto filtri amichevole di query –>
  <tipo di script = "text/javascript">
    $(documento).pronto(funzione(){
      $("#QueryFriendlyFilters").Val("vuoto");
    });
  </script di>

</xsl:modello>

Quel ' emette alcuni JavaScript che attende la pagina alla fine del caricamento (causa della $(documento).pronto(…)) e quindi imposta il valore di un campo nascosto denominato QueryFriendlyFilters per il valore letterale "Svuota".

Esempio 2: Uso <xsl:Se> per controllare "maggiore di",  "meno di", ecc.

<xsl:partita modello = "qualcosa" XML:Space = "preserve">

  <div id = "fdcAllFilters">
 
    <xsl:Se test="@Count>0">
      <span class = "fdcFilterLabel">Filtri correnti:</arco>
    </xsl:Se>

    <!– più roba succede qui. –>

</xsl:modello>

Questo frammento di codice consente di verificare se un attributo denominato "Contare" dell'elemento "qualcosa" è maggiore di zero.  il XML dietro questo sarebbe qualcosa come:”

<qualcosa Count = "5" />

Esempio 3: Scorrere tutti gli elementi, inframmezzando chiamate jQuery.

<!– Scorrere tutti i filtri e visualizzare la corretta  link. –>
<xsl:for each selezionare = "Benutzerfilter">

  <una classe = "FilterHref" href = "javascript:mySubmitPage('RemoveUserFilter','{@ ID}’)">[X]</un>

  <span class = "fdcFilterLabel"><xsl:valore di select="@FilterValue"/></arco>

  <tipo di script = "text/javascript">

    $(documento).pronto(funzione(){
        <xsl:Testo><![CDATA[$("#QueryFriendlyFilters").Val( ($("#QueryFriendlyFilters").Val() + " ]]></xsl:Testo>\"<xsl:valore di select="@FilterValue"/>\"<xsl:Testo><![CDATA["));]]></xsl:Testo>
    });

  </script di>

</xsl:for each>

Questo frammento di codice è il più complesso e ci possono essere più facili modi per farlo.

il XML dietro questo assomiglia all'incirca a questo:

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

Scorrimento di questo frammento <UserFilter> nodi. 

In primo luogo emette un ancoraggio etichetta che quando si fa clic richiama una funzione JavaScript che è già nella pagina, "mySubmitPage" e passa il valore di un attributo <UserFilter> nodo denominato "ID". 

Emette poi qualche jQuery che attende la pagina caricare.  Quel jQuery aggiorna un campo nascosto di nome "QueryFriendlyFilters", aggiungendo il valore dell'attributo FilterValue.  Nota tutti il pazzo <xsl:Testo> e <![CDATA[ … ]]> roba.

Questo è tutto, speranza che aiuta!

</fine>

Iscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Lists.asmx, GetListItems e le cartelle

Stavo facendo qualche ricerca per qualcuno oggi intorno al servizio di web list.asmx fornito come parte di SharePoint 2010 (e precedenti).  Lei era in grado di ottenere gli elementi dell'elenco alla cartella principale (anche i nomi delle sotto-cartelle), ma non poteva ottenere elementi in sotto-cartelle.  Ho fatto alcuni guardando in giro su internets ed è una domanda sorprendentemente comune.  Ancora, Non ho potuto ottenere una buona risposta alla domanda semplice, "se conosco la cartella, come ottenere gli elementi nella cartella?”  Ad essere onesti, Non provato duramente tutto ciò che dal momento che ho voluto capire questo una fuori il mio per un po ' sorriso, sorridere.

Per configurare questo, Ho creato un sito denominato "Blogging scenari" e un elenco personalizzato denominato "Elenco personalizzato con Sub cartelle".  Ho poi creato cartelle denominate:

  • Anno 2005
  • Anno 2006
  • Anno 2007

Ho aggiunto alcuni articoli nella cartella "Anno 2006".  Questo è quello che sembra:

image

Il mio amico non è scrittura di codice c#, ma piuttosto utilizzando Java, così la SOAP envelope era cosa aveva bisogno.  Per ottenere che, Ho scritto un po ' di jQuery e quindi utilizzato violinista per ottenere la conversazione reale HTTP.

Ecco le pertinenti jQuery (Ho copiato il codice giù sotto se volete copiare/incollare):

image

Essi prima chiave consiste nell'includere sia un <queryOptions> e <QueryOptions> nodo.  La seconda chiave è che il <Cartella> il nodo è un URL a cui il cliente ha accesso.

Ci possono essere altri modi per arrivare a questo, ma questo ha funzionato bene per me quando si utilizza jQuery.

Ecco la SOAP envelope sopra:

<soapenv:Busta xmlns:soapenv =’http://schemas.xmlsoap.org/soap/envelope/’>                
  <soapenv:Corpo>
    <GetListItems xmlns =’
http://schemas.Microsoft.com/SharePoint/SOAP/’>
      <listName>Elenco personalizzato con sottocartelle</listName>
      <viewFields>  
        <ViewFields>
          <FieldRef Name =' titolo’ />
          <FieldRef Name ='EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <Cartella>
http://demoserver1/Blogging Elenco di scenari/liste/Custom con Sub cartelle/anno 2006</Cartella>
        </QueryOptions>
      </queryOptions>
   
</GetListItems>
  </soapenv:Corpo>
</soapenv:Busta>

Un sacco di esempi e la discussione intorno a questo mi ha portato a credere che tutto quello che serve è stato <QueryOptions> e specificare un nome di cartella.  Per me, Io ho bisogno di entrambi avvolgerla all'interno <queryOptions> così come specificare un URL completo per il <Cartella> nodo.

Qui è l'installazione di AJAX jQuery:

$(documento).pronto(funzione() {
       var soapEnv =
           "<soapenv:Busta xmlns:soapenv =’http://schemas.xmlsoap.org/soap/envelope/’> \
               <soapenv:Corpo> \
                    <GetListItems xmlns =’http://schemas.Microsoft.com/SharePoint/SOAP/’> \
                       <listName>Elenco personalizzato con sottocartelle</listName> \
                       <viewFields> \
                           <ViewFields> \
                              <FieldRef Name =' titolo’ /> \
                              <FieldRef Name ='EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <Cartella>http://demoserver1/Blogging Elenco di scenari/liste/Custom con Sub cartelle/anno 2006</Cartella> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:Corpo> \
           </soapenv:Busta>";

</fine>

Iscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Lists.asmx, GetList e "valore non può essere null”

Ho scoperto oggi che la GetList() Metodo in lists.asmx servizio Web deve essere chiamato con molta attenzione, o è incline a generare un misterioso "Valore non può essere null" eccezione (e che sta assumendo che si può andare oltre il messaggio di errore generico anche peggio, "Eccezione di tipo ' SoapServerException’ è stato gettato.")  In particolare, Ho trovato che è non può fornire qualsiasi tipo di prefisso del metodo GetList.  Il seguente frammento di jQuery illustra il punto:

image

Se lo fai, il servizio web risponde con "Valore non può essere null" come per questo violinista-fornito di trascrizione HTTP:

<?XML version = "1.0" Encoding = "utf-8"?>
  <sapone:Busta
     xmlns:sapone ="
http://schemas.xmlsoap.org/soap/envelope/"    
     xmlns:xsi = "
http://www.w3.org/2001/XMLSchema-instance
     xmlns:XSD ="
http://www.w3.org/2001/XMLSchema">

  <sapone:Corpo>
    <sapone:Colpa>
      <FaultCode>sapone:Server</FaultCode>
      <FaultString>
        Eccezione di tipo ' SoapServerException’ è stato gettato.
      </FaultString>
      <dettaglio>
        <ErrorString xmlns ="
http://schemas.Microsoft.com/SharePoint/SOAP/">
Valore non può essere null.
        </ErrorString>
      </dettaglio>
    </sapone:Colpa>
  </sapone:Corpo>
</sapone:Busta>

Naturalmente, è probabilmente non sarebbe aggiungere tale prefisso "s0" sul proprio, ma alcuni strumenti sono inclini a farlo (come eclissi).

Questo è ancora più confuso / frustrante perché altri metodi tollerano i prefissi.  Per esempio, il GetListCollection Metodo non mente se esso è stato preceduto da, anche con i prefissi di sciocchezze come "xyzzy":

image

Questo "valore non può essere null" sembra piuttosto comune con lists.asmx quindi speriamo questo aiuterà qualcuno fuori in futuro.

</fine>

Iscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Nidificazione all'infinito <div> Tag e jQuery

Questo mi sembra un soggetto così stravaganti, Non sono sicuro che vale davvero la pena bloggare su, ma che non ha mai smesso prima di me, quindi qui si va sorriso, sorridere

Sto lavorando su un progetto dove sto tirando alcuni dati da una ricerca, imballaggio in un messaggio XML e poi il codice XML viene trasformato in definitiva in HTML tramite XSLT.  C'è un sacco di jQuery coinvolte, un bit di che implementa alcune funzionalità di tabulazione.  Quando fa clic su una scheda (davvero, un <div>), jQuery richiama .hide() e .show() su vari DIV (il caricamento della pagina iniziale Download tutto il contenuto, quindi non ci sono in questo caso postback).

Un mucchio di ore fa, la scheda logica di commutazione ha iniziato a comportarsi in modo strano e non mostra una delle mie schede.  Io alla fine esso monitorati al fatto che internet explorer (almeno) pensava che la <div> tag nidificati lontano, molto più profondo da desiderata.Avrebbe mostrato la developer toolbar:

-<div id = "Tab1Content">
  -<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           …………………………
                   </div>  <— Infine mostrandolo è stata chiusa fino in fondo!

Così, Se ho fatto un $("# Tab1Content").Nascondi(), Sarebbe anche nascondere Tab2 e mai potuto mostrare Tab2 anche se non ha mostro Tab1.  Ho copiato e incollato il codice in visual studio e ha mostrato a tutti di rivestimento del div fino piacevolmente, proprio come avrebbero dovuto fare, guardando come questo:

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

Ho battuto la testa contro il muro per un po' e ho notato che nel codice HTML effettivo codice era generando un sacco di vuoto <div> Tag, come:

<corpo>

  <div id = "Tab1Content">

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

  </div>

  <div id = "Tab2Content">

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

  </div>

</corpo>

(Quanto sopra è waaaaaaaaaaaay semplificato.  I tag div vuota sono totalmente validi. Alcuni dei miei <div> Tag erano piene di contenuti, ma molti altri non hanno.  Sono venuto alla realizzazione che mio <xsl:for each> le direttive sono state che emettono la forma abbreviata div tag quando xsl:for each non ' trovare tutti i dati.  Sono costretto a un commento HTML nell'output, come illustrato:

image

 

Dopo che ho fatto che, il div in fila piacevolmente ed il mio switching tab iniziò a lavorare.

Come sempre, Spero che questo aiuta a qualcuno in un pizzico.

</fine>

Iscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Ancora più jQuery–Ridimensionare un esempio di immagine

Ho ereditato una web part da vecchio fornitore di un client ed ha un problema di dimensioni immagine.  Le immagini dovrebbero essere 60×50 ma per qualche strano motivo, il fornitore originale li ha costretti in 42×42, modo da apparire schiacciati:

 

Buona immagine

Cattiva immagine

Ecco il codice (un po' semplificato):

<table class = 'esteso-outlook'>
  <thead>
    <TR>
      <TH  Width = 100′>3 Martedì</TH>
    </TR>
  </thead>

  <tbody>
    <Classe TR = 'previsioni'>
      <larghezza TD = 100′>
        <UL>
          <Classe li = 'high'>Alta: 72&deg;F</li>
          <Classe li = 'bassa'>Basso: 44&deg;F</li>
          <Classe li = 'condizione'>Sunny
            <img src =’
http://deskwx.WeatherBug.com/images/forecast/icons/Localized/60×50/en/trans/cond007.png’ larghezza = 42’ altezza = 42’ Alt =” />
          </li>
        </UL>
      </TD>
    </TR>

  </tbody>

</tabella>

Avrete notato che anche se il percorso dell'immagine di sé Mostra la dimensione corretta (60×50) il fornitore originale costretto in 42×42.  Perché?  Crazy.

In ogni caso, Volevo una soluzione rapida e semplice a questo problema e mi rivolsi a jQuery.  Il trucco è stato quello di individuare tutte le appropriate <img> Tag.  Non volevo fare muck con qualsiasi altro tag img (di cui ci sono molti).  Questo po ' di jQuery ha fatto il trucco:

<script type = "text/javascript" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></script di>

<tipo di script = "text/javascript">
     $(documento).pronto(funzione () {

         $(' li.condition > img').ogni(funzione (indice, elemento)
           
{
             $(elemento).CSS("larghezza", "60"); 
             $(elemento).CSS("altezza", "50");
            });
     }); // al caricamento del documento
</script di>

Quel po ' di codice trova la collezione <li> Tag cui classe è "condizione" e <img> bambini.  Esso quindi scorre tutto ciò.  Ha lavorato come un fascino.

Probabilmente potrei a razionalizzare e, ma non sono mai stato un tipo di ragazzo di unix che risolto π A 18 precisione di cifre usando sed e awk e io non sono quel tipo se jQuery ragazzo sia sorriso, sorridere.

</fine>

Iscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Implementare un sistema di notifica pop-up globale

Ho scritto un articolo per www.SharePoint.briefing.com intitolato"Implementare un sistema di notifica pop-up globale.”  Questa funzione è stata implementata per un community college di comunicare chiusure di scuola a causa della neve e così via. 

Utilizza un elenco personalizzato, out of the box di SharePoint web services e alcune jQuery per fare il lavoro.

Ecco un teaser:

image

Leggi tutto qui: http://www.sharepointbriefing.com/features/article.php/3918471/Implement-a-Global-Pop-up-Notification-System.htm

</fine>

Iscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin

Prendere il controllo del vostro OK e Annulla i pulsanti

Ho scritto in questo articolo un po ' indietro, ma sembra che non ha link ad esso dal mio blog al momento, così qui va:

image

In questo articolo viene descritto come forzare NewForm. aspx per reindirizzare a una pagina quando l'utente fa clic su OK e un'altra pagina quando si fa clic su Annulla.

</fine>

Iscriviti al mio blog.

Seguimi su Twitter a http://www.twitter.com/pagalvin