← Back to team overview

dhis2-devs team mailing list archive

[Branch ~dhis2-devs-core/dhis2/trunk] Rev 2998: started separation of validation and html

 

------------------------------------------------------------
revno: 2998
committer: Morten Olav Hansen <mortenoh@xxxxxxxxx>
branch nick: dhis2
timestamp: Thu 2011-03-10 17:31:56 +0100
message:
  started separation of validation and html
modified:
  dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/commons.js
  dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/useraccount/updateUserAccountForm.vm
  dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-user/src/main/webapp/dhis-web-maintenance-user/addUserForm.vm


--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk

Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/commons.js'
--- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/commons.js	2011-02-28 02:42:12 +0000
+++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/commons.js	2011-03-10 16:31:56 +0000
@@ -982,9 +982,45 @@
 /**
  * Create validator for fileds in form  * 
  */
- 
+
+/* this should replace validation() at some point, but theres just to much code
+ * depending on the old version for now.
+ * 
+ * See http://bassistance.de/jquery-plugins/jquery-plugin-validation/ for more 
+ * information about jquery.validate.
+ * 
+ * @param formId form to validate
+ * @param submitHandler the submitHandler to use
+ * @param kwargs A dictionary of optional arguments, currently supported are:
+ * 			beforeValidateHandler
+ * 			rules
+ */
+function validation2(formId, submitHandler, kwargs)
+{
+	var beforeValidateHandler = kwargs["beforeValidateHandler"];
+	var rules = kwargs["rules"];
+
+	var validator = jQuery("#" + formId ).validate({
+		meta:"validate"
+		,errorElement:"span"
+		,beforeValidateHandler:beforeValidateHandler
+		,submitHandler: submitHandler
+		,rules: rules
+	});
+
+	var nameField = jQuery('#' + formId + ' :input')[0];
+
+	if ( nameField )
+	{
+		nameField.focus();
+	}
+
+	return validator;	
+}
+
 function validation( formId, submitHandler, beforeValidateHandler )
 {
+	console.log("validation");
 	var nameField = jQuery('#' + formId + ' :input')[0];
 
 	var validator = jQuery("#" + formId ).validate({

=== modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/useraccount/updateUserAccountForm.vm'
--- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/useraccount/updateUserAccountForm.vm	2011-03-09 20:12:20 +0000
+++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/useraccount/updateUserAccountForm.vm	2011-03-10 16:31:56 +0000
@@ -1,9 +1,28 @@
 <script>
-
 	jQuery(document).ready(	function(){
-		validation( 'updateUserinforForm', updateUser );				
+		var rules = {
+			oldPassword: {required: true},
+			rawPassword: {required:false, password:true, minlength:8, notequalto:'#username'},
+			retypePassword: {required:true, equalTo:'#rawPassword'},
+			surname: {required:true, minlength:2},
+			firstName: {required:true, minlength:2},
+			email: {email:true},
+			phoneNumber: {}
+		}
+
+		validation2('updateUserinforForm', updateUser,
+			{
+				'rules': rules
+			}
+		);
+		
+		jQuery("#rawPassword").attr("maxlength", "35");
+		jQuery("#retypePassword").attr("maxlength", jQuery("#rawPassword").attr("maxlength"));
+		jQuery("#surname").attr("maxlength", "160");
+		jQuery("#firstName").attr("maxlength", "160");
+		jQuery("#email").attr("maxlength", "160");
+		jQuery("#phoneNumber").attr("maxlength", "80");
 	});
-
 </script>
 
 <h3>$i18n.getString( "update_user" )</h3>
@@ -20,31 +39,31 @@
 	</tr>
 	<tr>
 		<td><label for="username">$i18n.getString( "user_name" )</label></td>
-		<td><input type="text" id="username" name="username" value="$encoder.htmlEncode( $userCredentials.username )" style="width:20em" disabled="disabled" class="{validate:{required:true,firstletteralphabet:true,minlength:2,maxlength:50,alphanumeric:true}}"/></td>
+		<td><input type="text" id="username" name="username" value="$encoder.htmlEncode( $userCredentials.username )" style="width:20em" disabled="disabled"></td>
 	</tr>
 	<tr>
 		<td><label for="rawPassword">$i18n.getString( "old_password" ) <em title="$i18n.getString( "required" )" class="required">*</em></label></td>
-		<td><input type="password" id="oldPassword" name="oldPassword" style="width:20em" style="width:20em" class="{validate:{required:true}}"/></td>
+		<td><input type="password" id="oldPassword" name="oldPassword" style="width:20em" style="width:20em"/></td>
 	</tr>
 	<tr>
 		<td><label for="rawPassword">$i18n.getString( "new_password" )</label></td>
-		<td><input type="password" id="rawPassword" name="rawPassword" style="width:20em" style="width:20em" maxlength="35" class="{validate:{required:false,password:true,minlength:8,notequalto:'#username'}}"/></td>
+		<td><input type="password" id="rawPassword" name="rawPassword" style="width:20em" style="width:20em"></td>
 	</tr>
 	<tr>
 		<td><label for="retypePassword">$i18n.getString( "retype_new_password" )</label></td>
-		<td><input type="password" id="retypePassword" name="retypePassword" style="width:20em" maxlength="35" class="{validate:{required:true,equalTo:'#rawPassword'}}"/></td>
+		<td><input type="password" id="retypePassword" name="retypePassword" style="width:20em"></td>
 	</tr>
 	<tr>
 		<td><label for="surname">$i18n.getString( "surname" ) <em title="$i18n.getString( "required" )" class="required">*</em></label></td>
-		<td><input type="text" id="surname" name="surname" value="$encoder.htmlEncode( $userCredentials.user.surname )" style="width:20em" class="{validate:{required:true}}"/></td>
+		<td><input type="text" id="surname" name="surname" value="$encoder.htmlEncode( $userCredentials.user.surname )" style="width:20em"></td>
 	</tr>
 	<tr>
 		<td><label for="firstName">$i18n.getString( "first_name" ) <em title="$i18n.getString( "required" )" class="required">*</em></label></td>
-		<td><input type="text" id="firstName" name="firstName" value="$encoder.htmlEncode( $userCredentials.user.firstName )" style="width:20em" class="{validate:{required:true}}"/></td>
+		<td><input type="text" id="firstName" name="firstName" value="$encoder.htmlEncode( $userCredentials.user.firstName )" style="width:20em"></td>
 	</tr>
 	<tr>
 		<td><label for="email">$i18n.getString( "email" )</label></td>
-		<td><input type="text" id="email" name="email" value="$!encoder.htmlEncode( $userCredentials.user.email )" style="width:20em" class="{validate:{email:true}}"/></td>
+		<td><input type="text" id="email" name="email" value="$!encoder.htmlEncode( $userCredentials.user.email )" style="width:20em"/></td>
 	</tr>
     <tr>
         <td><label for="phoneNumber">$i18n.getString( "phone_number" )</label></td>
@@ -62,7 +81,6 @@
 <span id="message"></span>
 
 <script type="text/javascript">
-
 	var oldPassword = byId( 'oldPassword' );
 	oldPassword.select();
 	oldPassword.focus();
@@ -72,7 +90,7 @@
 		var request = new Request();
 		request.setResponseTypeXML( 'xmlObject' );
 		request.setCallbackSuccess(updateUserReceived);
-		
+
 		var params = "id=" + byId('id').value;
 			params += "&oldPassword=" + byId('oldPassword').value;
 			params += "&rawPassword=" + byId('rawPassword').value;
@@ -83,7 +101,6 @@
 			params += "&phoneNumber=" + byId('phoneNumber').value;
 		request.sendAsPost( params );
 		request.send( 'updateUserAccount.action');
-		
 	}
 	
 	function updateUserReceived(xmlObject){

=== modified file 'dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-user/src/main/webapp/dhis-web-maintenance-user/addUserForm.vm'
--- dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-user/src/main/webapp/dhis-web-maintenance-user/addUserForm.vm	2011-03-09 20:12:20 +0000
+++ dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-user/src/main/webapp/dhis-web-maintenance-user/addUserForm.vm	2011-03-10 16:31:56 +0000
@@ -1,13 +1,37 @@
 <script>
 	jQuery(document).ready(	function(){
-		validation( 'addUserForm', function( form ){ form.submit() }, function(){
-			listValidator( 'roleValidator','selectedList');
-		} );
+		var rules = {
+			username: {required:true, firstletteralphabet:true, minlength:2, alphanumeric:true},
+			rawPassword: {required:false, password:true, minlength:8, notequalto:'#username'},
+			retypePassword: {required:true, equalTo:'#rawPassword'},
+			surname: {required:true, minlength:2},
+			firstName: {required:true, minlength:2},
+			email: {email:true},
+			phoneNumber: {}
+		};
+
+		validation2('addUserForm', function( form ){ form.submit() },
+			{
+				'beforeValidateHandler': function() {
+					listValidator( 'roleValidator','selectedList');
+				},
+				'rules' : rules 
+			}
+		);
+
+		jQuery("#username").attr("maxlength", "50");
+		jQuery("#rawPassword").attr("maxlength", "35");
+		jQuery("#retypePassword").attr("maxlength", "35");
+		jQuery("#surname").attr("maxlength", "160");
+		jQuery("#firstName").attr("maxlength", "160");
+		jQuery("#email").attr("maxlength", "160");
+		jQuery("#phoneNumber").attr("maxlength", "80");
+
+		/* remote validation */
 		checkValueIsExist( "username", "validateUser.action");	
-	});		
+	});
 </script>
 
-
 <h3>$i18n.getString( "create_new_user" )</h3>
 <form id="addUserForm" action="addUser.action" method="post" >
 
@@ -17,31 +41,31 @@
 	</tr>
 	<tr>
 		<td><label for="username">$i18n.getString( "username" ) <em title="$i18n.getString( 'required' )" class="required">*</em></label></td>
-		<td colspan="3"><input type="text" id="username" name="username" style="width:20em" maxlength="50" autocomplete="off" class="{validate:{required:true,firstletteralphabet:true,minlength:2,alphanumeric:true}}"/></td>			
+		<td colspan="3"><input type="text" id="username" name="username" style="width:20em" autocomplete="off"></td>
 	</tr>
 	<tr>
 		<td><label for="rawPassword">$i18n.getString( "password" ) <em title="$i18n.getString( 'required' )" class="required">*</em></label></td>
-		<td colspan="3"><input type="password" id="rawPassword" name="rawPassword" style="width:20em" maxlength="35" autocomplete="off" class="{validate:{required:true,password:true,minlength:8,notequalto:'#username'}}"/></td>			
+		<td colspan="3"><input type="password" id="rawPassword" name="rawPassword" style="width:20em" autocomplete="off"></td>			
 	</tr>
 	<tr>
 		<td><label for="retypePassword">$i18n.getString( "retype_password" ) <em title="$i18n.getString( 'required' )" class="required">*</em></label></td>
-		<td colspan="3"><input type="password" id="retypePassword" name="retypePassword" style="width:20em" maxlength="35" autocomplete="off" class="{validate:{required:true,equalTo:'#rawPassword'}}"/></td>		
+		<td colspan="3"><input type="password" id="retypePassword" name="retypePassword" style="width:20em" autocomplete="off"></td>		
 	</tr>
 	<tr>
 		<td><label for="surname">$i18n.getString( "surname" ) <em title="$i18n.getString( 'required' )" class="required">*</em></label></td>
-		<td colspan="3"><input type="text" id="surname" name="surname" style="width:20em" maxlength="160" class="{validate:{required:true,minlength:2}}"/></td>				
+		<td colspan="3"><input type="text" id="surname" name="surname" style="width:20em"></td>
 	</tr>
 	<tr>
 		<td><label for="firstName">$i18n.getString( "firstName" ) <em title="$i18n.getString( 'required' )" class="required">*</em></label></td>
-		<td colspan="3"><input type="text" id="firstName" name="firstName" style="width:20em" maxlength="160" class="{validate:{required:true,minlength:2}}"></td>		
+		<td colspan="3"><input type="text" id="firstName" name="firstName" style="width:20em"></td>		
 	</tr>
 	<tr>
 		<td><label for="email">$i18n.getString( "email" )</label></td>
-		<td colspan="3"><input type="text" id="email" name="email" style="width:20em" maxlength="160" class="{validate:{email:true}}"/></td>			
+		<td colspan="3"><input type="text" id="email" name="email" style="width:20em"></td>			
 	</tr>
     <tr>
         <td><label for="phoneNumber">$i18n.getString( "phone_number" )</label></td>
-        <td colspan="3"><input type="text" id="phoneNumber" name="phoneNumber" style="width:20em" maxlength="80"/></td>             
+        <td colspan="3"><input type="text" id="phoneNumber" name="phoneNumber" style="width:20em"></td>             
     </tr>	
 	<tr>
 		<td colspan="4" height="10"></td>