Post con tag JQuery
JQuery e la funzione parseXML
14 mar
JQuery consente il parsing di una stringa XML, utilizzando le funzioni native del browser, in modo da trasformarla in un oggetto Document e renderla manipolabile.
Tale oggetto può essere inoltre wrappato all’interno di un oggetto JQuery in modo tale da poter utilizzare i metodi della libreria per trattarlo.
Il metodo in questione è jQuery.parseXML(data), e il parametro data è la stringa XML well-formed.
Validazione di un form con JQuery
12 set
La validazione di un form può avvenire in maniera molto semplice utilizzando il plugin Validation di JQuery.
In questo articolo verrà mostrato un semplice esempio di validazione.
I campi saranno tutti richiesti e, inoltre, l’URL dovrà essere valido per poter essere accettato:
<html>
<head>
<style>
body {
text-align:center;
margin:0 auto;
}
.content {
width: 500px;
margin-left: auto;
margin-right: auto;
text-align: center;
align: center;
}
.content table {
margin-left: auto;
margin-right: auto;
align: center;
}
td {
padding: 15 20 5 50;
}
tr.submitButton td {
padding-bottom: 50px;
padding-top: 50px;
text-align: center
}
p.title {
font-family:"Adobe Caslon Pro",
"Hoefler Text",Georgia,Garamond,Times,serif;
font-size:18pt;
font-variant:small-caps;
letter-spacing:0.2em;
text-align:center;
}
div.jqError {
height: 50px;
color: red;
font-style: oblique;
font-family: serif;
font-weight: bolder;
}
img.errGif {
padding-right: 20px;
}
input.error {
border: 2px solid red;
background-color: #FFFF53;
}
</style>
</head>
<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script type="text/javascript">
// sovrascriviamo i messaggi standard
$.validator.messages.required = "";
$.validator.messages.url = "";
var formName = "#AnagForm";
$(document).ready(function()
{
$(formName).validate({
rules:
{
Name: { required: true },
Lastname: { required: true },
Site: {required: true, url: true},
Username: {required: true}
},
invalidHandler: function(e, v)
{
var errs = v.numberOfInvalids();
if(errs)
{
var str = errs>1 ?
("Ci sono " + errs + " errori") :
("C'è un errore");
$("div[class=jqError]").html(
"<img class=\"errGif\" src=\"error.gif\"/>" + str);
}
}
});
});
</script>
<body>
<form id="AnagForm" action="http://antoniotancredi.altervista.org">
<div class="content">
<p class="title">REGISTRAZIONE</p>
<div class="jqError"></div>
<table>
<tr>
<td><label for="Name">Nome: </label></td>
<td><input type="text" name="Name"/></td>
</tr>
<tr>
<td><label for="Lastname">Cognome: </label></td>
<td><input type="text" name="Lastname"/></td>
</tr>
<tr>
<td><label for="Site">Sito Web: </label></td>
<td><input type="text" name="Site"/></td>
</tr>
<tr>
<td><label for="Username">Username: </label></td>
<td><input type="text" name="Username"/></td>
</tr>
<tr class="submitButton">
<td colspan="2"><input type="submit" value="Conferma"/></td>
</tr>
</table>
</div>
</form>
</body>
</html>
Loading ...