Affichage des articles dont le libellé est Formulaire. Afficher tous les articles
Affichage des articles dont le libellé est Formulaire. Afficher tous les articles

samedi, février 06, 2010

Validation avec Position Absolute et Classic ASP ajax[ajaxUser]

Il y a un mois, je suis tombé sur ce magnifique plugin pour la validation de formulaires, mais mon projet était en Classic ASP, voici donc la traduction du PHP de ajax[ajaxUser]

Il reste néanmoins un hack pour "validateError", n'hésitez pas à poster une solution

<%
'---------------------
' validateUser.php traduit en classic asp par Philippe Kaivers
'---------------------


Response.ContentType = "application/json"
'ajouté par rapport à la version originale en Php: envoyer les données en Json au lieu d'Html
%>
<!-- #include file="toJson.asp" -->
<%
'toJson.asp peut être trouvé sur http://code.google.com/p/aspjson/

'Récupérer les data du post
Dim validateValue, validateId, validateError, arrayToJs, dataValid
validateValue   = Request.Form("validateValue")
validateId      = Request.Form("validateId")
validateError   = "ajaxUser" 'Request.Form("validateError") 'hack... il y a toujours un bug ici, l'info passe comme "ajaxUserundefined"

'Construire le tableau (array)
Set arrayToJs = jsArray()
arrayToJs(Null) = validateId
arrayToJs(Null) = validateError

'validez ici
dataValid = False
If validateValue = "gg" Then
    dataValid = True
End If

'Write json response
If dataValid = True Then
    arrayToJs(Null) = "true"
    Response.Write("{""jsonValidateReturn"":" & arrayToJs.jsString & "}")
Else
    For i = 0 to 1000000 'Ce loop est énorme et devrait être remplacé par un timer (ce loop est présent dans la version Php)
        If i = 990000 Then
            arrayToJs(Null) = "false"
            Response.Write("{""jsonValidateReturn"":" & arrayToJs.jsString & "}")
        end if
    Next
End If
%>

Le code html est le suivant

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>ajax[ajaxUser]</title>
    <style>
    body{font-family:Trebuchet MS;font-size:small;}
    #userd{margin-bottom:15px}
    label{font-weight:bold;}
    #monForm{margin:80px 0 0 80px;}
    </style>
    <link href="/css/validationEngine.jquery.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="monForm" method="post" action="form.asp?id=2">
    <label for="userd">User:</label><br />
    <input type="text" id="userd" name="userd" class="validate[required,ajax[ajaxUser]]" /><br />
    <input type="submit" />
</form>
<script src="/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="/js/jquery.validationEngine-en.js" type="text/javascript"></script>
<script src="/js/jquery.validationEngine.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#monForm").validationEngine()
    });
</script>
</body>
</html>

Valider votre formulaire avec JQuery et le plugin de Position Absolute

Le plugin de Position Absolute est selon moi le plugin le plus intéressant du moment pour la validation d'un formulaire.

Il est à noter qu'il existe encore un bug en ce qui concerne IE6 si le message d'erreur passe au dessus d'un champ "select"

Les messages d'erreur sont éditables et utilisables en plusieurs langues

capture d'écran du plugin

En savoir plus