Archivo de la etiqueta: jQuery

Muestras de XSLT y jQuery

Vengo haciendo mucho de XSLT y jQuery y pensamiento que comparto algunos fragmentos que otros pueden resultar útiles en el futuro.

Ejemplo 1: Emiten simple JavaScript / jQuery en XSLT:

<XSL:Partido de plantilla = "algo" XML:Space = "preserve">

  <!– En blanco el campo oculto de filtros amigable de consulta –>
  <tipo de secuencia de comandos = "text/javascript">
    $(documento).listo(función(){
      $("#QueryFriendlyFilters").Val("vacía");
    });
  </secuencia de comandos>

</XSL:plantilla>

Que bit emite algunos JavaScript que espera de la página finalizar la carga (debido a la $(documento).listo(…)) y, a continuación, establece el valor de un campo oculto llamado QueryFriendlyFilters el valor literal "vacía".

Ejemplo 2: Uso <XSL:Si> para comprobar la "mayor que",  "menor que", etc..

<XSL:Partido de plantilla = "algo" XML:Space = "preserve">

  <div id = "fdcAllFilters">
 
    <XSL:Si test="@Count>0">
      <span class = "fdcFilterLabel">Filtros actuales:</abarcan>
    </XSL:Si>

    <!– más cosas sucede aquí. –>

</XSL:plantilla>

El fragmento de código anterior comprueba si un atributo denominado "Contar" del elemento "algo" es mayor que cero.  El XML detrás de todo esto sería algo así como:”

<algo Count = "5" />

Ejemplo 3: Recorrer en iteración todos los elementos, intercalando llamadas jQuery.

<!– Recorrer en iteración todos los filtros y mostrar la correcta  enlaces. –>
<XSL:for each select = "UserFilter">

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

  <span class = "fdcFilterLabel"><XSL:valor de select="@FilterValue"/></abarcan>

  <tipo de secuencia de comandos = "text/javascript">

    $(documento).listo(función(){
        <XSL:texto><![CDATA[$("#QueryFriendlyFilters").Val( ($("#QueryFriendlyFilters").Val() + " ]]></XSL:texto>\"<XSL:valor de select="@FilterValue"/>\"<XSL:texto><![CDATA["));]]></XSL:texto>
    });

  </secuencia de comandos>

</XSL:para cada>

El fragmento de código anterior es el más complejo y puede haber formas más fácil de hacerlo.

El XML detrás de todo esto más o menos este aspecto:

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

Este fragmento es iterar a través de <UserFilter> nodos. 

Primero emite un ancla de etiqueta que cuando hace clic en invoca una función de JavaScript que ya está en la página, "mySubmitPage" y pasa el valor de un atributo la <UserFilter> nodo denominado "ID". 

A continuación, emite algunos jQuery que espera para que cargar la página.  Que jQuery actualiza un campo oculto denominado "QueryFriendlyFilters" agregando el valor del atributo FilterValue.  Nota todos los locos <XSL:texto> y <![CDATA[ … ]]> cosas.

Eso es todo, esperanza de ayuda!

</final>

Suscribirse a mi blog.

Sígueme en Twitter en http://www.twitter.com/pagalvin

Lists.asmx, GetListItems y carpetas

Estaba haciendo algunas investigaciones para alguien hoy alrededor del servicio web de list.asmx proporcionado como parte de SharePoint 2010 (y anteriores).  Ella fue capaz de obtener los elementos de lista en la carpeta raíz (incluidos los nombres de las subcarpetas), pero no se pudo obtener elementos en las subcarpetas.  Hice algunos mirando alrededor de la internets y es una cuestión sorprendentemente común.  Todavía, No podía obtener una buena respuesta a la pregunta simple, "si sé la carpeta, Cómo obtener los elementos de la carpeta?”  Para ser honesto, No intente duro todo lo que ya he quería figura esta uno fuera de mi propia durante un tiempo Sonreír.

Para configurar esto, He creado un sitio llamado "Blogging escenarios" y una lista personalizada denominada "Lista personalizada con las subcarpetas".  A continuación, crear carpetas con el nombre:

  • Año 2005
  • Año 2006
  • Año 2007

He añadido algunos elementos a la carpeta "Año 2006".  Esto es lo que parece:

image

Mi amigo no escribir código C# sino más bien mediante Java, por lo que la envoltura SOAP era lo que necesitaba realmente.  Para conseguir, Escribí un poco de jQuery y entonces utilizarse violinista para obtener la conversación real de HTTP.

Aquí es el jQuery pertinente (He copiado el código abajo a continuación si desea copiar y pegar):

image

Su primera clave es incluir tanto un <queryOptions> y <QueryOptions> nodo.  La segunda clave es que el <Carpeta> el nodo es una dirección URL a la que el cliente tiene acceso.

Puede haber otras formas de obtener esto, pero esto funcionó bien para mí cuando usando jQuery.

Aquí es la envoltura SOAP para la anterior:

<soapenv:Xmlns envolvente:soapenv =’http://schemas.xmlsoap.org/SOAP/Envelope/’>                
  <soapenv:Cuerpo>
    <GetListItems xmlns =’
http://schemas.Microsoft.com/SharePoint/SOAP/’>
      <listName>Lista personalizada con las subcarpetas</listName>
      <viewFields>  
        <ViewFields>
          <FieldRef nombre =' título’ />
          <FieldRef nombre ='EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <Carpeta>
http://demoserver1/blogs Lista personalizada de listas de escenarios con Sub carpetas/año 2006</Carpeta>
        </QueryOptions>
      </queryOptions>
   
</GetListItems>
  </soapenv:Cuerpo>
</soapenv:Envolvente>

Un montón de ejemplos y debate en torno a esto me llevó a creer que todo lo que necesito <QueryOptions> y especifique un nombre de carpeta.  Para mí, Yo necesito a ambos envolverlo dentro <queryOptions> así como especificar una dirección URL completa de la <Carpeta> nodo.

Aquí está el programa de instalación de AJAX jQuery:

$(documento).listo(función() {
       var soapEnv =
           "<soapenv:Xmlns envolvente:soapenv =’http://schemas.xmlsoap.org/SOAP/Envelope/’> \
               <soapenv:Cuerpo> \
                    <GetListItems xmlns =’http://schemas.Microsoft.com/SharePoint/SOAP/’> \
                       <listName>Lista personalizada con las subcarpetas</listName> \
                       <viewFields> \
                           <ViewFields> \
                              <FieldRef nombre =' título’ /> \
                              <FieldRef nombre ='EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <Carpeta>http://demoserver1/Blogging Lista personalizada de listas de escenarios con Sub carpetas/año 2006</Carpeta> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:Cuerpo> \
           </soapenv:Envolvente>";

</final>

Suscribirse a mi blog.

Sígueme en Twitter en http://www.twitter.com/pagalvin

Sin cesar de anidamiento <div> Etiquetas y jQuery

Esto me parece un tema tan extraños, No estoy seguro vale blogs acerca de, pero que nunca ha dejado de mi antes, así que aquí vamos Sonreír

Estoy elaborando un proyecto donde estoy tirando de algunos datos de una búsqueda, embalaje en un mensaje XML y, a continuación, ese XML en última instancia es transformado en HTML mediante XSLT.  Hay un montón de jQuery involucrados, un bit que implementa algunas funciones de tabulación.  Cuando hace clic en una ficha (realmente, un <div>), jQuery invoca .hide() y .show() en diferentes divs (la carga de la página inicial descargas todo el contenido por lo que en este caso no hay ninguna devoluciones).

Un montón de horas hace, la ficha conmutación lógica comenzó a comportarse de manera irregular y no mostrará uno de mis fichas.  Yo finalmente seguimiento es el hecho de internet explorer (por lo menos) pensaba que el <div> etiquetas anidadas mucho, mucho más profundo que pretende.Mostrar la barra de herramientas de desarrollador:

-<div id = "Tab1Content">
  -<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           …………………………
                   </div>  <— mostrando finalmente cerró todo el camino aquí!

Por lo tanto, si hice un $("# Tab1Content").ocultar(), También podría ocultar Tab2 y nunca pude mostrar Tab2 si también no muestro Tab1.  Copia y pega el código visual studio y mostró todos del revestimiento del div hasta bien, al igual que se suponía que iban a estar haciendo, mirando como este:

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

Golpearon la cabeza contra la pared durante un tiempo y notó que en el código HTML actual código estaba generando un montón de vacío <div> Etiquetas, como:

<cuerpo>

  <div id = "Tab1Content">

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

  </div>

  <div id = "Tab2Content">

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

  </div>

</cuerpo>

(Lo anterior es waaaaaaaaaaaay simplificada.  Las etiquetas div vacía son totalmente válidas. Algunos de mis <div> Etiquetas estaban llenos de contenido, pero no fueron muchos más.  Llegué a la realización que mi <XSL:para cada> directivas estaban emitiendo el formulario corto cuando las etiquetas div el xsl:no para cada ' encontrar ningún dato.  Obligó a un comentario HTML en la salida, como se muestra:

image

 

Después de hice, el div se alinearon bien y mi ficha conmutación empezó a trabajar.

Como siempre, Espero que esto ayude a alguien en una pizca.

</final>

Suscribirse a mi blog.

Sígueme en Twitter en http://www.twitter.com/pagalvin

Aún más jQuery–Cambiar el tamaño de un ejemplo de imagen

Heredé un elemento web de proveedor antiguo del cliente y tiene un problema de tamaño de imagen.  Las imágenes deben ser 60×50 pero por alguna extraña razón, el proveedor original les obligó a 42×42, para que su aspecto aplastados:

 

Buena imagen

Mala imagen

Aquí es el marcado (algo simplificado):

<tabla clase = 'outlook extendida'>
  <THEAD>
    <TR>
      <TH  ancho = 100′>3 Martes</TH>
    </TR>
  </THEAD>

  <tbody>
    <clase TR = 'Previsión'>
      <anchura TD = 100′>
        <UL>
          <clase de Li = 'alto'>Alta: 72&DEG;F</Li>
          <clase de Li = 'baja'>Baja: 44&DEG;F</Li>
          <clase de Li = 'condición'>Soleado
            <img src =’
http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/Trans/cond007.png’ anchura = 42’ altura = 42’ Alt =” />
          </Li>
        </UL>
      </TD>
    </TR>

  </tbody>

</mesa>

Se tenga en cuenta que aunque el camino a la propia imagen muestra la dimensión correcta (60×50) el vendedor original lo forzó en 42×42.  ¿Por qué?  Loco.

De todos modos, Yo quería una solución rápida y fácil a este problema y me volví a jQuery.  El truco era localizar todos los adecuados <IMG> Etiquetas.  No quiero tontear con cualquier otras etiquetas img (de los cuales hay muchos).  Un poco de jQuery hizo el truco:

<la escritura de tipo = text/javascript"" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></secuencia de comandos>

<tipo de secuencia de comandos = "text/javascript">
     $(documento).listo(función () {

         $(' li.condition > IMG').cada(función (índice, artículo)
           
{
             $(artículo).CSS("anchura", "60"); 
             $(artículo).CSS("altura", "50");
            });
     }); // carga de documento
</secuencia de comandos>

La colección encuentra ese trozo de código <Li> Etiquetas cuya clase es "condición" y <IMG> a los niños.  Luego itera a través de todo eso.  Trabajó como un encanto.

Yo probablemente pudiera racionalizarlo, Pero nunca fui a la clase de tipo unix que resolvió π Para 18 precisión de dígitos con sed y awk y yo no soy ese tipo si jQuery o tipo Sonreír.

</final>

Suscribirse a mi blog.

Sígueme en Twitter en http://www.twitter.com/pagalvin

Tomar el Control de sus botones Cancelar y aceptar

Escribí en este artículo un tiempo atrás, pero parece no vincular a ella desde mi blog en el momento, así que aquí va:

image

Este artículo describe cómo forzar newform.aspx redirigir a una página cuando el usuario hace clic en Aceptar y otra página cuando hace clic en Cancelar.

</final>

Suscribirse a mi blog.

Sígueme en Twitter en http://www.twitter.com/pagalvin

Punta rápido: JQuery agregar a las páginas de publicación MOSS

Al mejorar las páginas de publising MOSS usando jQuery, Me pegó el siguiente golpe de velocidad:

Error de servidor en ' /’ Aplicación.


Error del analizador

Descripción: Se produjo un error durante el análisis de un recurso necesario para esta solicitud de servicio. Por favor, revise los siguientes detalles de error de análisis específicos y modificar adecuadamente el archivo de origen.

Mensaje de Error del analizador: Sólo se permiten los controles de contenido directamente en una página de contenido que contiene controles de contenido.

Error de código fuente:

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

Archivo de código fuente: /_catalogs/masterpage/KCC_FacultyMember.aspx    Línea: 12


Información de versión: Microsoft.NET Framework versión:2.0.50727.4927; ASP.NET versión:2.0.50727.4927

Era fácil de arreglar (h/t a mi colega, Uday Ethirajulu).  Asegúrese de que el código de jQuery vive dentro de la "PlaceHolderAdditionalPageHead" como se muestra:

<ASP:Contenido ContentPlaceholderID = "PlaceHolderAdditionalPageHead" runat = "server">

<secuencia de comandos

    tipo = "text/javascript"

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

</secuencia de comandos>

<tipo de secuencia de comandos = "text/javascript">

  $(documento).listo(función() {

   // JQuery brillante cosas va aquí.

   });

</secuencia de comandos>

</final>

Suscribirse a mi blog.

Sígueme en Twitter en http://www.twitter.com/pagalvin