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

miércoles, 8 de octubre de 2014

TEXTO TODO EN MAYUSCULA LADO DEL CLIENTE CS JQUERY

MI SOLUCION: OJO QUE MEJOR NO HAY QUE GENERALIZAR MUCHO EN EL INPUT  DE TIPO TEXT YA QUE POR EJEMPLO EL LOGIN NECESITA DIFERENCIAR MAYUSCULAS Y  MINUSCULAS MEJOR SERIA CON UNA CLASE  por ejemplo una clase .uppercase

CSS
<style type="text/css">
input[type=text] {
    text-transform:uppercase;
}
</style>

JQUERY
<script type="text/javascript">
    $(function () {
        $("input[type=text]").keyup(function () {
            $(this).val($(this).val().toUpperCase());
        });

        $("#Button1").click(function () {
            alert($("#Text1").val());
        }
        );
       
    });
</script>

//PRUEBA
<body>
    <input id="Text1" type="text" />
    <input id="Button1" type="button" value="button" />
</body>

REFERENCIAS
http://stackoverflow.com/questions/9587542/how-to-control-or-change-all-the-text-to-upper-case
http://devhints.wordpress.com/2006/11/01/css-make-it-all-uppercaselowercase/

jquery ready

http://learn.jquery.com/using-jquery-core/document-ready/

jueves, 25 de septiembre de 2014

jueves, 11 de septiembre de 2014

miércoles, 10 de septiembre de 2014

Jquery mejores practicas - asp sesiones

http://www.baluart.net/articulo/14-utiles-trucos-notas-y-mejores-practicas-de-jquery
http://estamosprogramando.blogspot.com/2008/06/manejar-estados-en-un-webservice.html

martes, 9 de septiembre de 2014

objeto window en java script

JavaScript Window - The Browser Object Model


The Browser Object Model (BOM) allows JavaScript to "talk to" the browser.

The Browser Object Model (BOM)

There are no official standards for the Browser Object Model (BOM).
Since modern browsers have implemented (almost) the same methods and properties for JavaScript interactivity, it is often referred to, as methods and properties of the BOM.

The Window Object

The window object is supported by all browsers. It represent the browser's window.
All global JavaScript objects, functions, and variables automatically become members of the window object.
Global variables are properties of the window object.
Global functions are methods of the window object.
Even the document object (of the HTML DOM) is a property of the window object:
window.document.getElementById("header");
is the same as:
document.getElementById("header");



Window Size

Three different properties can be used to determine the size of the browser window (the browser viewport, NOT including toolbars and scrollbars).
For Internet Explorer, Chrome, Firefox, Opera, and Safari:
  • window.innerHeight - the inner height of the browser window
  • window.innerWidth - the inner width of the browser window
For Internet Explorer 8, 7, 6, 5:
  • document.documentElement.clientHeight
  • document.documentElement.clientWidth
  • or
  • document.body.clientHeight
  • document.body.clientWidth
A practical JavaScript solution (covering all browsers):

Example

var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

Try it Yourself »
The example displays the browser window's height and width: (NOT including toolbars/scrollbars)

Other Window Methods

Some other methods:

  • window.open() - open a new window
  • window.close() - close the current window
  • window.moveTo() -move the current window
  • window.resizeTo() -resize the current window

domingo, 7 de septiembre de 2014

A1 parametros AJAX contentType dataType, stringify


contentType is the type of data you're sending, so application/json; charset=utf-8 is a common one, as is application/x-www-form-urlencoded; charset=UTF-8, which is the default.
dataType is what you're expecting back from the server: jsonhtmltext, etc. jQuery will use this to figure out how to populate the success function's parameter.
If you're posting something like:
{"name":"John Doe"}
and expecting back:
{"success":true}
Then you should have:
var data = {"name":"John Doe"}
$.ajax({
    datatype : "json",
    contentType: "application/json; charset=utf-8",
    data : JSON.stringify(data),
    success : function(result) {
        alert(result.success); // result is an object which is created from the returned JSON
    },
});
If you're expecting the following:
<div>SUCCESS!!!</div>
Then you should do:
var data = {"name":"John Doe"}
$.ajax({
    datatype : "html",
    contentType: "application/json; charset=utf-8",
    data : JSON.stringify(data),
    success : function(result) {
        jQuery("#someContainer").html(result); // result is the HTML text
    },
});
One more - if you want to post:
name=John&age=34
Then don't stringify the data, and do:
var data = {"name":"John", "age": 34}
$.ajax({
    datatype : "html",
    contentType: "application/x-www-form-urlencoded; charset=UTF-8", // this is the default value, so it's optional
    data : data,
    success : function(result) {
        jQuery("#someContainer").html(result); // result is the HTML text
    },
});
share|edit

From the jQuery documentation - http://api.jquery.com/jQuery.ajax/
contentType When sending data to the server, use this content type.
dataType The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response
"text": A plain text string.
REFERENCIA:
http://stackoverflow.com/questions/18701282/what-is-content-type-and-datatype-in-an-ajax-request 

Parametros de llamada AJAX jquery bien explicado

http://stackoverflow.com/questions/17828250/datatype-vs-contenttype-in-jquery-ajax
4 down vote accepted
dataType:
The type of data that you're expecting back from the server.
contentType:
When sending data to the server, use this content type. Default is "application/x-www-form-urlencoded; charset=UTF-8", which is fine for most cases. If you explicitly pass in a content-type to $.ajax(), then it is always sent to the server (even if no data is sent). The W3C XMLHttpRequest specification dictates that the charset is always UTF-8; specifying another charset will not force the browser to change the encoding.
----
contentType is used to determine how the payload has to be sent to the server as request parameters or as request body.

dataType is used to tell jQuery what is the return type of the request - to determine how to process the response text before it is sent the the handler methods

http://stackoverflow.com/questions/17828250/datatype-vs-contenttype-in-jquery-ajax
*****************
From the documentation:
contentType (default: 'application/x-www-form-urlencoded; charset=UTF-8')
Type: String
When sending data to the server, use this content type. Default is "application/x-www-form-urlencoded; charset=UTF-8", which is fine for most cases. If you explicitly pass in a content-type to $.ajax(), then it'll always be sent to the server (even if no data is sent). If no charset is specified, data will be transmitted to the server using the server's default charset; you must decode this appropriately on the server side.
and:

dataType (default: Intelligent Guess (xml, json, script, or html))
Type: String
The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string).
http://stackoverflow.com/questions/14322984/differences-between-contenttype-and-datatype-in-jquery-ajax-function
*****************

1.1 Propiedades de los llamados Ajax.

La función Ajax de JQuery recibe un JSON el cuál posee varias propiedades que enumeraremos a continuación.
  • type: Tipo de llamada que se ejecutara por defecto es GET.
  • url: Ruta a la cual se le ejecutara la llamada.
  • data: Datos que se enviaran al servidor, se envía un string con formato de JSON.
  • contentType: Tipo de datos que van a ser enviara al servidor.
  • dataType: Tipo de dato que se espera recibir desde el servidor . Jquery lo interpreta con los MIME types que el soporta. Los valores válidos para esta propiedad son los siguientes: (xml,html,script,json,jsop,text)
  • success:  Función ejecutada cuando la llamada Ajax fue satisfactoria.
  • error: Función a ser ejecutada si la llamada Ajax no fue satisfactoria.
  • async: Propiedad que define si la llamada Ajax es asíncrona o no, por defecto esta propiedad es verdadera.
Estas definiciones serán utilizadas posteriormente y es importante conocer su significado.
- See more at: http://7sabores.com/blog/consumir-un-webservice-net-jquery#sthash.vEl1KKTC.dpuf

http://7sabores.com/blog/consumir-un-webservice-net-jquery
*******************
contentType Se usa cuando se mandan datos a los servidores a modo de encabezado. String: "application/x-www-form-urlencoded" funciona perfectamente
data Se usa para especificar datos a mandar. Estos tienen la siguiente forma: foo=bar&foo2=bar2;. Si los datos a enviar son un vector(array) jQuery los convierte a varios valores con un mismo nombre (si foo["alt1","alt2"], foo="alt1"&foo="alt2";) Array / String con la forma antes mencionada. (un objeto que yo sepa tambien)
dataType Indica el tipo de datos que se van a llamar (YO: que se resiben del servidor). Si no se especifica jQuery automaticamente encontrará el tipo basado en el header del archivo llamado (pero toma mas tiempo en cargar, asi que especificalo u_u)
  • "xml": Devuelve un documento XML.
  • "html": Devuelve HTML con texto plano, y respeta las etiquetas.
  • "script": Evalua el JavaScript y devuelve texto plano.
  • "json": Evalua la respuesta JSON y devuelve un objeto Javascript 
http://www.cristalab.com/tutoriales/ajax-en-jquery-c226l/
*******************
jQuery
Nuestro último cliente será jQuery y lo cierto es que el más sencillo de todos.
La ventaja de jQuery frente a ASP.NET AJAX es que puede consumir servicios que no estén en la solución actual y además tampoco es necesario ningún cambio en el servicio web, es decir, no es necesario descomentar la línea que sí tuvimos que descomentar para trabajar con ASP.NET AJAX.
Además, para proyectos de ASP.NET MVC sólo tenemos disponible está opción
$(document).ready(function () {
    var options = {
        type: "POST",
        url: "/WebService1.asmx/Saludar",
        data: "{ 'nombre': 'Sergio' }",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data, textStatus, jqXHR) { //do something...
        },
        error: function (jqXHR, textStatus, errorThrown) { //do something...
        }
    }
    $.ajax(options);
});

Lo más relevante del este código es:
  • Se utiliza JSON para la llamada según indica el parámetro contentType.
  • Se pasan los datos en la propiedad data, de nuevo como un objeto JSON pero en una cadena.
  • El nombre del parámetro es case-sensitive, así que nombre funcionará pero Nombre fallará.
  • Se espera que la respuesta sea en formato JSON según indica el parámetro dataType.
Si quisiéramos llamar al método SaludarPersona que recibe un objeto del tipo Persona, habría que escribir lo siguiente en la propiedad data:
data: "{ 'persona' : { 'Nombre' : 'Sergio' , 'Apellidos' : 'León' } }",

http://panicoenlaxbox.blogspot.com/2011_12_01_archive.html
**************************

sábado, 6 de septiembre de 2014

el atributo data en JQUERY HTML5

http://api.jquery.com/data/
http://stackoverflow.com/questions/7261619/jquery-data-vs-attr

interesante

If you are passing data to a DOM element from the server, you should set the data on the element:
<a id="foo" data-foo="bar" href="#">foo!</a>
The data can then be accessed using .data() in jQuery:
console.log( $('#foo').data('foo') );
//outputs "bar"
However when you store data on a DOM node in jQuery using data, the variables are stored in on the nodeobject. This is to accommodate complex objects and references as storing the data on the node element as an attribute will only accommodate string values.
Continuing my example from above:
$('#foo').data('foo', 'baz');

console.log( $('#foo').attr('data-foo') );
//outputs "bar" as the attribute was never changed

console.log( $('#foo').data('foo') );
//outputs "baz" as the value has been updated on the object


http://stackoverflow.com/questions/12405874/kendo-ui-grid-display-grid-on-a-link-click

como pasar parametros el atributo data en ajax

http://stackoverflow.com/questions/15576548/jquery-how-to-pass-parameters-in-get-requests
http://stackoverflow.com/questions/3066070/using-jquery-to-make-a-post-how-to-properly-supply-data-parameter
Como enviar en formato value1=value1 &value2=value2...
http://stackoverflow.com/questions/9328743/sending-multiple-data-parameters-with-jquery-ajax

how to sent json parameters mediante el metodo get con ajax jquery
http://stackoverflow.com/questions/10948233/jquery-send-json-object-using-get-method
http://stackoverflow.com/questions/10948233/jquery-send-json-object-using-get-method

RESUELTO EL PROBLEMA DE JSON COMO PARAMETRO GET
http://techbrij.com/pass-parameters-aspdotnet-webapi-jquery
-----------
http://stackoverflow.com/questions/18697034/how-to-pass-parameters-in-ajax-post 
Try using GET method,
$.ajax({
        url: 'url',
        type: 'GET',
        data: { field1: "hello", field2 : "hello2"} ,
        contentType: 'application/json; charset=utf-8',
        success: function (response) {
            your success code
        },
        error: function () {
            your error code
        }
    }); 
You cannot see parametrs in url with POST method

-----
http://stackoverflow.com/questions/249692/jquery-wont-parse-my-json-from-ajax-query
According to the json.org specification, your return is invalid. The names are always quoted, so you should be returning
{ "title": "One", "key": "1" }
and
[ { "title": "One", "key": "1" }, { "title": "Two", "key": "2" } ]
This may not be the problem with your setup, since you say one of them works now, but it should be fixed for correctness in case you need to switch to another JSON parser in the future.
-----------

http://api.jquery.com/jQuery.ajax/
  • data
    Type: PlainObject or String or Array
    Data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. See processData option to prevent this automatic processing. Object must be Key/Value pairs. If value is an Array, jQuery serializes multiple values with same key based on the value of the traditional setting (described below).
    $.ajax({
    type: "POST",
    url: "some.php",
    data: { name: "John", location: "Boston" }
    })
    .done(function( msg ) {
    alert( "Data Saved: " + msg );
    });
    **************v2b
    VER el parametro data:
    $.ajax({ async:true, type: "POST", dataType: "html", contentType: "application/x-www-form-urlencoded", url:"ajaxcompleto2.php", data:"anio="+v, beforeSend:inicioEnvio, success:llegada, timeout:4000, error:problemas }); 
    ---
     
    
    
    otro en http://blog.zeion.net/2012/09/14/ejemplo-practico-de-ajax-json-con-jquery/
    pero con post ojo 
    var data = "tarea=1&cedula=" + cedula.id; 
    **************

jueves, 28 de agosto de 2014

funcion closets en jquery

http://www.linuxhispano.net/2011/05/06/8-metodos-de-jquery-que-deberias-conocer/
http://api.jquery.com/closest/#expr
https://www.youtube.com/watch?v=plBxdz0B1Po

domingo, 17 de agosto de 2014

el jQuery de Google

Google Hosted Libraries - Google Developers

https://developers.google.com/speed/libraries/devguide

Segun un video dice que una de las ventajas es que si se esta usando un plugin que ya incluye el jquery, puede que este se quede en la cache del browser y no se descargara mas.

ADEMAS SI ALGUNAS VECES TENGO Y OTRAS NO TENGO INTERNET AQUI ESTA LA SOLUCIÓN

No obstante, con un proyecto web en el que uso esta técnica me pasó una cosa curiosa el otro día. Durante un viaje en tren aproveché para programar un rato y al no tener acceso a Internet el jQuery de Google, claro, no cargaba y por consiguiente no podía trabajar.
La solución fue obvia: Temporalmente cambié esa línea, dejando de apuntar al servidor de Google para apuntar a un jQuery local.
Y viendo que esto podía sucederme de nuevo en el futuro, opté por algo también obvio, que es mantener ambas líneas en el código de la página y comentar la que sobra según la situación. Nada del otro mundo.
Pero luego me empeñé en perfeccionar un poco la cosa y salió esto:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">if(typeof jQuery==='undefined'){document.write(unescape("<scri"+"pt src='js/jquery-1.3.2.min.js' type='text/javascript'></scri"+"pt>"));}</script>
Utilizando este código me despreocupo totalmente del tema. ¿Que encuentra el jQuery de Google? Lo usa. ¿Que no? Pues usa el jQuery local.

jueves, 14 de agosto de 2014

callback $(function() {

http://stackoverflow.com/questions/7068916/difference-between-callback-and-document-readyfunction
http://stackoverflow.com/questions/19408082/differences-between-document-readyfunction-and-document-onready
http://stackoverflow.com/questions/7068916/difference-between-callback-and-document-readyfunction