Mostrando entradas con la etiqueta jquery mobile. Mostrar todas las entradas
Mostrando entradas con la etiqueta jquery mobile. Mostrar todas las entradas

miércoles, 23 de enero de 2013

Problemas con jquery 1.9 en visual studio 2012

Síntomas:

Actualizas la versión de jQuery a 1.9.0 con el administrador de paquetes.
Tus aplicaciones dejan de funcionar incluso aunque actualices el resto de paquetes con dependencias de jQuery.
En mi caso dejo de funcionar el entorno jquery.mobile

Solución:

Vuelve a la versión 1.8.3 de jQuery utilizando la consola de Powershell de VS2012
Dado que hay diversos paquetes que dependen de jQuery te será comodo un powershell script.
Yo me cree este:
Uninstall-Package jquery.mobile
Uninstall-Package jQuery.UI.Combined
Uninstall-Package Microsoft.jQuery.Unobtrusive.Ajax
uninstall-package Microsoft.jQuery.Unobtrusive.Validation
Uninstall-Package jQuery.Validation 

Uninstall-Package jquery
install-Package jquery -Version 1.8.3

install-Package jquery.mobile
install-Package jQuery.UI.Combined
install-Package jQuery.Validation 
install-package Microsoft.jQuery.Unobtrusive.Validation
install-Package Microsoft.jQuery.Unobtrusive.Ajax

Dependiendo de los paquetes que tengas instalados pueden salir errores, solo tienes que ir añadiendo los paquetes al script. Las dependencias también te pueden crear problemas, todo es cambiar el orden.

Comentario:

Con el tiempo se resolverá pero es interesante conocer como revertir Nuget.

domingo, 20 de enero de 2013

jquery.mvc.net y vb.net

Enunciado

En un proyecto web mvc instalas desde nuget jquery.mvc.net y nada funciona

Solución

Cambia todas las  plantillas, controladores, startapp a vb.net. Estan en c#

Comentario

Si quieres el código posteame un comentario y lo publicaré.  (Voy corto de tiempo)

viernes, 6 de julio de 2012

Autocompletar un cuadro de texto en jQuery Mobile

Enunciado:

Tenemos la clásica búsqueda con un cuadro de texto al que normalmente desplegaríamos un lista de sugerencias a medida que escriben. En una aplicación de escritorio ASP.NET usariamos el componente autocomplete de AJAX.NET o de jQuery UI. Pero ¿En una aplicación móvil?

Solución:

Usar jQuery y el componente jQM Autocomplete de Andy Matthews.
Si haces clic en el vínculo llegaras a una demo y te enamoraras como lo hice yo.

Desarrollo de la solución

Necesitaras un servicio JSON que te entregue las sugerencias de palabras. Si desarrollas en ASP.NET puedes consultar mi post Desarrollo de un servicio json sobre ASP.NET para consumo desde Jquery
En mi caso además estaba buscando nombres de empresa en una base de datos por lo que dispongo del identificador único de registro.
Por eso devuelvo un array de objetos con dos propiedades de texto "label" y "value" .
Esta es la respuesta JSON:

[{"label":"INCOAZUL","value":"353"},{"label":"AZULIBER","value":"18"},{"label":"AZULEJERA ALCORENSE","value":"62"},{"label":"MAYOLICA AZULEJOS, S.L.","value":"60"},{"label":"AZULEJOS ALCOR","value":"61",{"label":"AZULINDUS & MARTI, S.A.","value":"13"},{"label":"NOMAZUL, S.A.","value":"85"}}] Este un ejemplo código de página:

    Que completaríamos con esté código JavaScript
           $(document).ready( function (e) {
             $("#busqueda").autocomplete({
                 method: 'GET',
                 target: $('#sugerencias'),
                 source: "/MAC.svc/NomIdEmpresa",
                 link: 'ficha?id=',
                 minLength: 3
             });
         });
     
    
    Por supuesto en los encabezados debes incluir las referencias a las librerias y estilos jQuery, jQuery Mobile y jQM autocomplete.
    Observarás que en la parte java especifico un enlace ficha?id= que se completará al final con el campo value que me devuelve el JSON. Asi cuando clicken en INFOAZUL navegaremos hacia ficha?id=353.
    Sin embargo, esta no es la solución optima, lo mejor sería cambiar a una página móvil ya cargada y actualizarla con los datos leidos con un llamada a un servicio JSON datosEmpresa(idEmpresa). 
    Es mi próximo objetivo, así que....continuará en próximas entregas

    Desarrollo de un servicio json sobre ASP.NET para consumo desde Jquery

    Enunciado:

    Necesitamos un servicio web que responda en formato JSON para poderlo leer desde Jquery.

    En este ejemplo partiremos del resultado otro servicio web WCF "directorio", pero podríamos estar devolviendo los resultados de una consulta linq o cualquier otra fuente serializable

    Solución

    Añadir un Servicio WCF con AJAX habilitado.
    IMPORTANTE: En el Web.config sección system.servicemodel ELIMINAR o comentar las referencias a este servicio  . En mi caso que el servicio se llamaba MAC eliminé las líneas: el behavior  enablewebScript
    
    
    
          
            
                 
                
          
          
        
        
        
          
            
          
        
    

    Luego editamos el archivo de etiquetado (.svc) añadiendo el atributo Factory apundando a la clase System.ServiceModel.Activation.WebServiceHostFactory.
    <%@ ServiceHost Language="VB" Debug="true" Service="myAplication.MAC" CodeBehind="MAC.svc.vb" Factory="System.ServiceModel.Activation.WebServiceHostFactory" %>
    
    En el archivo de código MAC.svc.vb definiremos los metodos con el atributo WebInvoke especificando el método (GET o POST) y el formato de la respuesta (JSON).
    Imports System.ServiceModel
    Imports System.ServiceModel.Activation
    Imports System.ServiceModel.Web
    
    
    
    Public Class MAC
    
        
        
        Public Function NomIdEmpresa(term As String) As directorio.EmpresaIdentificada()
            'ahora llamo a la clase proxy de mi servicio WCF.
            Dim servicio = New directorio.IdirectorioClient
            Dim resultado As directorio.EmpresaIdentificada() = servicio.SugerenciasNombreIdEmpresa(term, 20) 
            servicio.Close()
            Return resultado
        End Function
    End Class
    

    martes, 3 de julio de 2012

    Emulador para depurar web apps para iphone

    Situación

    Desarrollas una aplicación para móviles, la pruebas en varios teléfonos Android con varios navegadores (Dolphin, Navigator y Firefox). También en una tableta Android, y en el emulador del SDK Android.
    Por supuesto en todos los exploradores de escritorio habituales.
    Bueno pues cuando está en el aire, alguien te dice que falla en iPhone.
    ¿Te compras un iPhone o un Mac? :-(

    Solución

    Usas el emulador on-line http://www.testiphone.com/  

    Comentario

    ¡Gracias Joe!,  me sentía como Newton cuando descubrió la ley de la gravedad.

    viernes, 27 de enero de 2012

    No funciona jquery.mobile.pagination

    Sintomas:
    Los vinculos laterales en  el plugin de Filament Group para paginación en jquery-mobile no pasan página. En cambio si funciona arrastrandon el dedo por la página actual.

    Causa:
    Es un defecto del plugin relacionado con la url. En la página advierten que puede ocurrir con algunos navegadores, pero he observado  que el problema puede aparecer o desaparecer con variaciones en la URL.
    Por ejemplo en un momento creí lo siguiente, pero luego el problema reapareció. Sigo trabajando
    En los href especificaba la dirección completa incluyendo el número de puerto en el Host.
    Ejemplo href="http://www.blogger.com:80/nexpost.html"
    Basto con eliminar el :80 para que todo funcionara.

    Comentarios:
    Perdí un día por esta tontería.
    El problema es que en mi desarrollo Encuentra tu cerámica la clase que contiene los metodos que extraen la información de las urls, almacena esta información y genera todas las urls del sitio ha terminado por ser bastante complejo, en algún sitio se me coló un request.url.originalString en lugar de un request.url.absoluteUrl.
    En fin.
    No estoy seguro de que el problema esté en especificar el puerto únicamente o en especificar el puerto cuando se ha accedido sin especificar el puerto originalmente (urls distintas).