Rápido e fácil: Crie seu próprio jQuery Sandbox para SharePoint

Este é outro post em meu série em curso sobre como usar jQuery com o SharePoint.
Se você quer aprender mais sobre jQuery, Eu recomendo: jQuery em ação por Bibeault de urso e Yehuda Katz.

Introdução ao jQuery no SharePoint é surpreendentemente fácil (Para mim). (Tenho sérias dúvidas sobre uma abordagem de "melhores práticas" para implantar essas coisas para produção, mas isso é para outro dia). Eu só comecei a jogar com esta tecnologia e para esse fim, Eu criei um ambiente seguro de usar. Se você estiver olhando para começar a trabalhar com jQuery, Você pode encontrar esta abordagem útil.

1. Criar um Site em branco

Criar um site em branco em algum lugar no seu site e chamá-lo algo inteligente como "jQuery Sandbox".

2. Download jQuery

Você pode baixar a biblioteca javascript jQuery aqui: http://docs.jquery.com/Downloading_jQuery

Que, para salvar no seu desktop.

Tenho vindo a utilizar a versão "minified".

3. Criar uma biblioteca de documentos do SharePoint

Em seu site seguro, criar uma biblioteca de documentos.

4. Carregar a biblioteca jQuery para SharePoint

Acessar a biblioteca de doc que você acabou de criar e carregar a biblioteca jQuery.

5. Criar uma lista do SharePoint personalizado

Eu comecei com uma lista personalizada porque quero ficar rindo com formulários padrão do SharePoint. Você também pode criar uma página em uma biblioteca de páginas ou páginas de web parts e, provavelmente, um monte de outros lugares.

Adicionar algumas colunas de lista personalizada para que você tenha algo para executar jQuery contra. Meus objetivos iniciais foram:

  1. Ocultar um campo.
  2. Atribuir um valor a um campo.

Com esse objetivo em mente, Eu adicionei dois campos de texto. Ao longo do tempo, Eu vou estar jogando com links, imagens, pesquisas de, etc.

6. Modificar NewForm. aspx Web Part Page e adicionar uma Web Part do Editor de conteúdo

Isso é um pouco de preto magic-ish , em que é um novo conceito para mim. Eu aprendi sobre isso de Paul Grenier, SharePoint jQuery Superstar, em seu site de projeto do CodePlex: http://spff.codeplex.com/.

Siga estas etapas para adicionar um CEWP para a mesma página que mostra NewForm. aspx para qualquer lista personalizada:

  1. Acessar a lista personalizada e clique em novo.
  2. Acrescentar o seguinte URL: PageView = compartilhado&ToolPaneView = 2

Que irá transformar o seu formulário de entrada de dados de baunilha chato de algo parecido com isto:

image

Para isso:

image

Adicionar a web part do editor de conteúdo para a página.

7. Escrever seu primeiro jQuery código

Abrir esse CEWP na exibição de código e adicione o seguinte:

image

Aqui está o código real, se você deseja copiar/colar:

<script type ="text/javascript"
    src ="../../jQuery Library/jQuery-1.3.2.min.js">
</script>

<script type ="text/javascript">
  $(função() {

    $('#resultsID').HTML('Há' + $('a').Tamanho() + 'um tags tags nesta página.');

  });
</script>

Resultado:
<div id ='resultsID'></div>
/resultado

Observe que o primeiro <script> marca faz referência a biblioteca jQuery real. Presumivelmente, essas coisas mudam com o tempo, Então você vai querer ter certeza de uma) usar o nome certo e b) aponte para a biblioteca de documentos do SharePoint correta.

Aquecer na glória

Se você fez isso corretamente, você verá um resultado semelhante ao seguinte:

image

Resumindo

Esta não é a única maneira de começar, mas é rápido, fácil e isolada do seu ambiente do SharePoint existente.

</fim>

Subscreva ao meu blog.

Siga-me no Twitter em http://www.twitter.com/pagalvin

2 pensamentos "Rápido e fácil: Crie seu próprio jQuery Sandbox para SharePoint

  1. keylane krish

    Já reparaste que adicionar CEWP no EditForm. aspx quebraria a página e seção de informações de versão que aparece na interface do usuário? Nenhuma solução alternativa para este?

    Qualquer um ?

    Resposta

Deixar uma resposta

seu endereço de e-mail não será publicado. Campos obrigatórios são marcados *