Javascript en MBC-Forms

 Arriba  Anterior  Siguiente

Recuerde que no es necesaria la inserción de las etiquetas <SCRIPT...></SCRIPT> para el código javascript del formulario

 

hmtoggle_plus1Función de validación de campos que se construye al activar un campo como obligatorio

 

function ValidaForm(EW_this) {

   if (EW_this.texto1 && !EW_hasValue(EW_this.texto1, "TEXT" )) {

   if (!EW_onError(EW_this, EW_this.texto1, "TEXT", "Campo necesario/obligatorio sin rellenar"))

      return false;

      }

   if (EW_this.dt1 && !EW_hasValue(EW_this.dt1, "TEXT" )) {

   if (!EW_onError(EW_this, EW_this.dt1, "TEXT", "Campo necesario/obligatorio sin rellenar"))

      return false;

      }

   if (EW_this.desple1 && !EW_hasValue(EW_this.desple1, "SELECT" )) {

   if (!EW_onError(EW_this, EW_this.desple1, "SELECT", "Campo necesario/obligatorio sin rellenar"))

      return false;

      }

   if (EW_this.desple2 && !EW_hasValue(EW_this.desple2, "SELECT" )) {

   if (!EW_onError(EW_this, EW_this.desple2, "SELECT", "Campo necesario/obligatorio sin rellenar"))

      return false;

      }

   return true;

}

 

 

hmtoggle_plus1Comprobación de un campo si dispone valor

 

function EW_hasValue(obj, obj_type) {

   if (obj_type == "TEXT" || obj_type == "PASSWORD" || obj_type == "TEXTAREA" || obj_type == "FILE")   {

   if (obj.value.length == 0) 

      return false;   

   else 

      return true;

   }   else if (obj_type == "SELECT") {

      if (obj.type != "select-multiple" && obj.selectedIndex == 0)

      return false;

      else if (obj.type == "select-multiple" && obj.selectedIndex == -1)

         return false;

      else

      return true;

   }   else if (obj_type == "RADIO" || obj_type == "CHECKBOX")   {

   if (obj[0]) {

      for (i=0; i < obj.length; i++) {

         if (obj[i].checked)

            return true;

         }

   } else {

      return (obj.checked);

      }

   return false;   

   }

}

 

 

hmtoggle_plus1Gestión de errores de validación de campo

 

function EW_onError(form_object, input_object, object_type, error_message) {

   alert(error_message);   

   if (object_type == "RADIO" || object_type == "CHECKBOX") {

   if (input_object[0])

      input_object[0].focus();

   else

      input_object.focus();

   }   else if (!EW_isHiddenTextArea(input_object, object_type)) { 

      input_object.focus();  

   }  

   if (object_type == "TEXT" || object_type == "PASSWORD" || object_type == "TEXTAREA" || object_type == "FILE") {

   if (!EW_isHiddenTextArea(input_object, object_type))

      input_object.select();

   }

   return false;   

}

 

 

hmtoggle_plus1Funciones básicas de gestión del Editor HTML

 

// DHTML editor

function ew_DHTMLEditor(name, f) {

this.name = name;

this.create = (f) ? f : function() { this.active = true; };

this.editor = null;

this.active = false;

}

// Create DHTML editor

function ew_CreateEditor(name) {

if (typeof ew_DHTMLEditors == 'undefined')

return;

for (var i = 0; i < ew_DHTMLEditors.length; i++) {

var ed = ew_DHTMLEditors[i];

var cr = !ed.active;

if (name) cr = cr && ed.name == name;

if (cr) {

if (typeof ed.create == 'function')

ed.create();

if (name)

break;

}

}

}

</script>

<script type="text/javascript" src="bdforms/fckeditor/fckeditor.js"></script>

<script type="text/javascript">

<!--

_width_multiplier = 16;

_height_multiplier = 60;

var ew_DHTMLEditors = [];

// update value from editor to textarea

function ew_UpdateTextArea() {

if (typeof ew_DHTMLEditors != 'undefined' && typeof FCKeditorAPI != 'undefined') {   

var inst;   

for (inst in FCKeditorAPI.__Instances)

FCKeditorAPI.__Instances[inst].UpdateLinkedField();

}

}

// update value from textarea to editor

function ew_UpdateDHTMLEditor(name) {

if (typeof ew_DHTMLEditors != 'undefined' && typeof FCKeditorAPI != 'undefined') {

var inst = FCKeditorAPI.GetInstance(name);   

if (inst)

inst.SetHTML(inst.LinkedField.value)

}

}

// focus editor

function ew_FocusDHTMLEditor(name) {

if (typeof ew_DHTMLEditors != 'undefined' && typeof FCKeditorAPI != 'undefined') {

var inst = FCKeditorAPI.GetInstance(name);   

if (inst && inst.EditorWindow) {

inst.EditorWindow.focus();

}

}

}

 

 

hmtoggle_plus1Activación y creación del DHTML-Editor en el formulario

 

ew_CreateEditor();

 

 

hmtoggle_plus1Activación de DHTML-Editor en campo TextArea

 

var editor = New ew_DHTMLEditor("txtac1");

editor.create = Function() {

var sBasePath = 'bdforms/fckeditor/';

var oFCKeditor = New FCKeditor('txtac1', 40*_width_multiplier, 5*_height_multiplier);

oFCKeditor.BasePath = sBasePath;

oFCKeditor.ReplaceTextarea();

this.active = True;

}

 

ew_DHTMLEditors[ew_DHTMLEditors.length] = editor;

 

 

hmtoggle_plus1Código para disponer de el Calendario Javascript

 

<link rel="stylesheet" Type="text/css" media="all" href="bdforms/calendar/calendar-win2k-1.css" title="win2k-1"><script Type="text/javascript" src="bdforms/calendar/calendar.js"></script>

<script Type="text/javascript" src="bdforms/calendar/lang/calendar-es.js"></script>

<script Type="text/javascript" src="bdforms/calendar/calendar-setup.js"></script>

 

 

hmtoggle_plus1Código para activar en el campo el botón del calendario

 

Calendar.setup(

{

inputField : "dt1", // ID of the Input field

ifFormat : "%d/%m/%Y", // the Date format

button : "cx_dt1" // ID of the button

}

);

 

 

hmtoggle_plus1Validación de claves con tamaño, verificación y caracteres

function validatePwd() {

var invalid = " "; // Invalid character is a space

var minLength = 6; // Minimum length

var pw1 = document.myForm.password.value;

var pw2 = document.myForm.password2.value;

// check for a value in both fields.

if (pw1 == '' || pw2 == '') {

alert('Please enter your password twice.');

return false;

}

// check for minimum length

if (document.myForm.password.value.length < minLength) {

alert('Your password must be at least ' + minLength + ' characters long. Try again.');

return false;

}

// check for spaces

if (document.myForm.password.value.indexOf(invalid) > -1) {

alert("Sorry, spaces are not allowed.");

return false;

}

else {

if (pw1 != pw2) {

alert ("You did not enter the same new password twice. Please re-enter your password.");

return false;

}

else {

alert('Nice job.');

return true;

      }

   }

}

 

hmtoggle_plus1Validar si el campo es e-mail

En el campo insertamos en Ajax acciones: onblur="ValidarMail(this)"

 

En el formulario agregamos este javascript:

function echeck(str) {

      var at="@"

      var dot="."

      var lat=str.indexOf(at)

      var lstr=str.length

      var ldot=str.indexOf(dot)

      if (str.indexOf(at)==-1){

         alert("E-mail No Valido")

         return false

      }

      if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){

         alert("E-mail No Valido")

         return false

      }

      if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){

          alert("E-mail No Valido")

          return false

      }

       if (str.indexOf(at,(lat+1))!=-1){

          alert("E-mail No Valido")

          return false

       }

       if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){

          alert("E-mail No Valido")

          return false

       }

       if (str.indexOf(dot,(lat+2))==-1){

          alert("E-mail No Valido")

          return false

       }

       if (str.indexOf(" ")!=-1){

          alert("E-mail No Valido")

          return false

       }

        return true               

   }

function ValidarMail(varmail){

   var emailID=varmail 

//document.reservas.txtEmail

   if ((emailID.value==null)||(emailID.value=="")){

      alert("Por favor entre un email valido")

      emailID.focus()

      return false

   }

   if (echeck(emailID.value)==false){

      emailID.value=""

      emailID.focus()

      return false

   }

   return true

 }

 

hmtoggle_plus1Desactivar la tecla ENTER de un campo

En el campo donde deseamos que no opere la tecla ENTER (chr=13) incorporamos este literal en Acciones

 

onkeypress="javascript:if(event.keyCode==13){return false;}"

 

Podemos reutilizar la misma función para asignar un tabulado (TAB chr=8) para cambiar al siguiente campo como alternativa al ENTER

 

onkeypress="javascript:if(event.keyCode==13){return (Escribir aqui la secuencia que se envia);}"

 

hmtoggle_plus1Acciones sobre un campo SELECT

En ocasiones disponemos de campos SELECT que deben refrescar la pantalla con los datos de la selección

 

Incorporamos en el formulario un código que usaremos como función

 

function CargarUrlBxtm(param) {

document.location = 'index.asp?bxtm=' + param;

}

function CargarUrlBxsr(param) {

document.location = 'index.asp?bxsr=' + param;

}

 

En el campo insertamos la función con el evento OnChange

 

onchange="CargarUrlBxtm(this.value)"

 

hmtoggle_plus1Función para eliminar ENTER reutilizable

Insertamos en el formulario este código que luego vamos a incorporar como función en el evento del campo que necesitemos

 

function blockEnter()

{

if (event.keyCode==13)

return false;

}