es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

No es posible agregar validación a la entrada en CKEDITOR.

No puedo agregar la validación a este control CKEDITOR. Tengo esto <input name="editor1" class="required" id="editor1"></input> y luego CKEDITOR.instances.editor1.updateElement(); pero no agrega la etiqueta requerida a este control. Cualquier ayuda sería genial.

Muestra de trabajo
http://jsfiddle.net/tjmcdevitt/yhze8m1j/1/

Código JavaScript

$('#add-job').validate({
    ignore: [],         
    rules: {
                editor1: {
                    required: function() 
                    {
                    CKEDITOR.instances.editor1.updateElement();
                    }
                    }
                },
                messages: {
                Job_Title: "Requerido",
                Job_Location: "Requerido",
                jobid: "Requerido",
                Job_Cat: "Requerido",
                editor1: "Requerido"
                },
                /* use below section if required to place the error*/
                errorPlacement: function(error, element) 
                {
                    if (element.attr("name") == "editor1") 
                   {
                    error.insertBefore("textarea#editor1");
                    } else {
                    error.insertBefore(element);
                    }
                }
            });
});
Tags:  , ,

Answer

  1. Avatar for davy.ai

    Para agregar validación al control CKEditor utilizando jQuery validate, se pueden seguir los siguientes pasos:

    1. Añadir el complemento jQuery validate al código.
    2. Obtener la instancia de CKEditor utilizando CKEDITOR.instances.editor1.
    3. Utilizar el método updateElement() para actualizar el elemento textarea con el último valor del editor.
    4. Agregar una regla requerida al elemento editor1 utilizando el método rules().
    5. Establecer el mensaje de error para el elemento editor1 utilizando el método messages().
    6. Utilizar el método errorPlacement() para personalizar la ubicación del mensaje de error.

    El siguiente código muestra un ejemplo de cómo agregar validación a un control CKEditor:

    // inicializar el complemento jQuery validate
    $('#add-job').validate({
      ignore: [], // permitir que se validen los campos ocultos
      rules: {
        // agregar regla requerida al elemento editor1
        editor1: {
          required: function() {
            // actualizar el elemento textarea con el último valor del CKEditor
            CKEDITOR.instances.editor1.updateElement();
            // devolver true para indicar que el campo es requerido
            return true;
          }
        }
      },
      messages: {
        // establecer el mensaje de error para el elemento editor1
        editor1: 'Por favor ingrese un texto'
      },
      // personalizar la ubicación del mensaje de error
      errorPlacement: function(error, element) {
        if (element.attr('name') == 'editor1') {
          error.insertBefore('textarea#editor1');
        } else {
          error.insertBefore(element);
        }
      }
    });
    

    Se puede encontrar un ejemplo funcional aquí: http://jsfiddle.net/tjmcdevitt/yhze8m1j/1/

Comments are closed.