Technology :
1. Event listener, event handler & event propogation in native JavaScript
2. Embed you blocks of JavaScript via adding a RawText item through Page personalization
Sample code
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
var XXValidation = {
xxInitialize : function(pHookObject, pHookEvent, pReplaceAttr) {
XXValidation.xxHookObject = pHookObject;
XXValidation.xxHookEvent = pHookEvent;
XXValidation.xxReplaceAttr = pReplaceAttr;
}
,
xxDelegation : function(){
$clone = $('#' + XXValidation.xxHookObject).clone(true).insertAfter('#' + XXValidation.xxHookObject);
$clone.attr("id", "CloneButton");
$clone.hide();
$('#' + XXValidation.xxHookObject).attr(XXValidation.xxReplaceAttr, "null");
},
xxValidater : function(){if(1 == 2){alert("validation success"); return true;} else {alert("validation fail"); return false;}}
,
xxSubmitForm : function(event){ $("#CloneButton")[XXValidation.xxHookEvent]();}
,
xxCancel : function(event){event.stopPropagation(); event.preventDefault();}
,
xxValidationHandler : function(event) {alert("Hook client side event through personalization !"); if(XXValidation.xxValidater()){XXValidation.xxSubmitForm(event);}
else{ XXValidation.xxCancel(event);} }
,
xxRegister : function() {
$('#' + XXValidation.xxHookObject).bind(XXValidation.xxHookEvent, XXValidation.xxValidationHandler);
}
};
XXValidation.xxInitialize("GoButton", "click", "onclick");
XXValidation.xxDelegation();
XXValidation.xxRegister();
</script>
