kevinchappell / formBuilder

A jQuery plugin for drag and drop form creation
https://formbuilder.online
MIT License
2.64k stars 1.4k forks source link

Bug: I can not create custom controls. #467

Closed PabloManuel78 closed 7 years ago

PabloManuel78 commented 7 years ago

http://formbuilder.readthedocs.io/en/latest/formBuilder/options/fields/ This is the error that appears on the console.

Error: Error while registering custom field: [object Object]. Unable to find a related defined template.
    at Function.A.error (form-builder.min.js:6)
    at Function.e.register (form-builder.min.js:6)
    at new A (form-builder.min.js:6)
    at HTMLDivElement.<anonymous> (form-builder.min.js:6)
    at Function.each (jquery-2.2.2.min.js:2)
    at n.fn.init.each (jquery-2.2.2.min.js:2)
    at form-builder.min.js:6
    at <anonymous>

These are my own fields.

                                 fields: [
                                             {
                                                 label: 'Salto de línea',
                                                 attrs: {type: 'salto_linea'}
                                             },
                                             {
                                                 label: 'Captcha',
                                                 attrs: {type: 'captcha'}
                                             }                                             
                                          ],
eder-toledo commented 7 years ago

Hi Pablo.

This is my example code in production:

options = {
    defaultFields: formData,
    dataType: 'json',
    controlPosition: 'left',
inputSets: [
      {
          label: 'Agrupación de preguntas',
          fields: [
            {
                label: 'Agrupación de preguntas',
                type: 'begin_group',
                className: 'hide'
            },
            {
                label: 'Fin de agrupación',
                type: 'end_group',
                className: 'hide'
            }
          ]
      }
]
}

This code found correctly

PabloManuel78 commented 7 years ago

Spanish Gracias por tu respuesta, ando muy agobiado con esto, el lunes funcionaba todo y el martes ya no. Lo pongo como tú dices y ahora al menos sí carga, pero me lanza el error siguiente:

English Thanks for your answer, I'm very overwhelmed with this, Monday worked everything and Tuesday no longer. I put it as you say and now at least it does, but it throws me the following error:

Uncaught Error: Invalid control type. (Type: begin_group, Subtype: undefined). Please ensure you have registered it, and imported it correctly.
    at Function.A.error (https://formbuilder.online/assets/js/form-builder.min.js:6:205577)
    at Function.A.getClass (https://formbuilder.online/assets/js/form-builder.min.js:6:204134)
    at A.updatePreview (https://formbuilder.online/assets/js/form-builder.min.js:6:34977)
    at uA (https://formbuilder.online/assets/js/form-builder.min.js:6:58964)
    at AA (https://formbuilder.online/assets/js/form-builder.min.js:6:50634)
    at https://formbuilder.online/assets/js/form-builder.min.js:6:48474
    at Array.forEach (native)
    at J (https://formbuilder.online/assets/js/form-builder.min.js:6:48454)
    at HTMLUListElement.update (https://formbuilder.online/assets/js/form-builder.min.js:6:48120)
    at t.(anonymous function).(anonymous function)._trigger (https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js:6:11090)

Spanish Además con tu ejemplo me sale como un grupo a parte. Cuando lo añada y pulso encima se duplica.

English Also with your example I leave as a group apart. When I add and pulse it doubles.

image

Spanish Es un gran problema. Tenía esta nueva utilidad terminada y ahora no podemos lanzarla.

English Its a big problem. I had this new utility done and now we can not release it.

PabloManuel78 commented 7 years ago

This is exactly my "options" variable:

// Esta es la preconfiguración de FB
var options = {
              // Esta función se ejecuta al pulsar en el botón salvar.
              onSave: function(formData) {

                // Obtenemos los datos creados en JSON
                var data = fb.actions.getData('json');

                // Y por ajax lo guardamos en la DB
                $.ajax({
                    cache: false,
                    type: 'POST',
                    url: '/procesosjson2.php?proceso=art_t7_salvar_campos',
                    dataType: 'json',
                    data: { campos: data, id: id_registro },
                    beforeSend: function(){
                        // mostramos reloj
                        $('#respuestaajax').html('<div class="espera"></div>');
                    },                  
                    // Mostramos un mensaje con la respuesta de PHP
                    success: function(data) {
                        $('#respuestaajax').html('');

                        if (data[0]['err'] == 0) 
                        {
                            sweetAlert("Salvados", "¡Campos guardados!", "success");
                        }
                        else
                        {
                            sweetAlert("No salvados", "¡Campos no guardados!", "error");
                        }
                    }
                });

              },
              // Idioma, partimos del inglés y lo modificamos.
              i18n: {
                preloaded: {
                  'en-US': {
                  addOption: 'Añadir opción +',
                  allFieldsRemoved: 'Todos los campos fueron eliminados.',
                  allowMultipleFiles: 'Permitir a los usuarios cargar varios archivos',
                  autocomplete: 'Autocompletado',
                  button: 'Botón',
                  cannotBeEmpty: 'Este campo no puede estar vacío',
                  checkboxGroup: 'Cajas de chequeo',
                  className: 'Nombre de clases',
                  clearAllMessage: '¿Sabes que no hay vuelta atrás verdad?',
                  clear: 'Borrar todo',
                  close: 'Cerrar',
                  content: 'Contenido',
                  copy: 'Copiar a portapapeles',
                  copyButton: '&#43;',
                  copyButtonTooltip: 'Copiar',
                  dateField: 'Campo de Fecha',
                  description: 'Texto de ayuda',
                  descriptionField: 'Descripción',
                  devMode: 'Modo desarrollo',
                  editNames: 'Editar nombres',
                  editorTitle: 'Elementos del formulario',
                  editXML: 'Editar XML',
                  enableOther: 'Habilitar &quot;Otro&quot;',
                  enableOtherMsg: 'Permitir que los usuarios ingresen una opción no listada',
                  fieldNonEditable: 'Este campo no se puede modificar.',
                  fieldRemoveWarning: '¿Estás seguro de que quieres borrarlo?',
                  fileUpload: 'Subir archivo',
                  formUpdated: 'Formulario actualizado',
                  getStarted: 'Arrastre un campo a esta área',
                  header: 'Titulo',
                  hide: 'Editar',
                  hidden: 'Campo oculto',
                  inline: 'En línea',
                  inlineDesc: 'Display {type} inline',
                  label: 'Etiqueta',
                  labelEmpty: 'La etiqueta no puede estar en blanco',
                  limitRole: 'Limitar el acceso a una o más de las siguientes funciones:',
                  mandatory: 'Obligatorio',
                  maxlength: 'Logitud máxima',
                  minOptionMessage: 'Este campo requiere un mínimo de dos opciones.',
                  multipleFiles: 'Múltiples archivos',
                  name: 'Nombre',
                  no: 'No',
                  noFieldsToClear: '¡¡Qué me estás contando!! ¡¡Si no hay nada que borrar!!',
                  number: 'Número',
                  off: 'Off',
                  on: 'On',
                  option: 'Opción',
                  options: 'Opciones',
                  optional: 'opcional',
                  optionLabelPlaceholder: 'Etiqueta',
                  optionValuePlaceholder: 'Valor',
                  optionEmpty: 'Opción valor requerida',
                  other: 'Otro',
                  paragraph: 'Párrafo',
                  placeholder: 'Texto de ejemplo',
                  'placeholder.value': 'Valor',
                  'placeholder.label': 'Etiqueta',
                  'placeholder.text': '',
                  'placeholder.textarea': '',
                  'placeholder.email': 'Escriba su email',
                  'placeholder.placeholder': '',
                  'placeholder.className': 'Separe clases con espacios',
                  'placeholder.password': 'Escriba su contraseña',
                  preview: 'Vista previa',
                  radioGroup: 'Grupo de Selección',
                  radio: 'Selección',
                  removeMessage: 'Quitar elemento',
                  removeOption: 'Quitar opción',
                  remove: '&#215;',
                  required: 'Requerido',
                  richText: 'Editor enriquecido',
                  roles: 'Acceso',
                  rows: 'Filas',
                  save: 'Guardar',
                  selectOptions: 'Opciones',
                  select: 'Selector',
                  selectColor: 'Selector de color',
                  selectionsMessage: 'Permitir selección múltiple',
                  size: 'Tamaño',
                  'size.xs': 'Muy pequeño',
                  'size.sm': 'Pequeño',
                  'size.m': 'Por defecto',
                  'size.lg': 'Grande',
                  style: 'Estilo',
                  styles: {
                    btn: {
                      'default': 'Por defecto',
                      danger: 'Peligro',
                      info: 'Información',
                      primary: 'Primario',
                      success: 'Correcto',
                      warning: 'Precaución'
                    }
                  },
                  subtype: 'Tipo',
                  text: 'Campo de texto',
                  textArea: 'Campo de párrafo',
                  toggle: 'Tipo conmutador',
                  warning: '¡Cuidadín!',
                  value: 'Valor',
                  viewJSON: '{Código JSON}',
                  viewXML: '&lt;/&gt;',
                  yes: 'Sí'
                  }
                }
              },
             fields: [
                        {
                            label: 'Salto de línea',
                            attrs: {type: 'salto_linea'}
                        },
                        {
                            label: 'Captcha',
                            attrs: {type: 'captcha'}
                        }
                     ],
             disableFields: ['autocomplete'],
             fieldRemoveWarn: true,
             controlOrder: ['text','textarea','select']
            };
PabloManuel78 commented 7 years ago

Spanish Ya lo he podido arreglar. Me obliga a incluir otra opción. Con esta configuración, de momento parece funcionar todo:

English I've already been able to fix it. It forces me to include another option. With this configuration, at the moment everything seems to work:

 fields: [
            {
                label: 'Salto de línea',
                attrs: {type: 'salto_linea'}
            },
            {
                label: 'Captcha',
                attrs: {type: 'captcha'}
            }
         ],
templates: {
            salto_linea: function(fieldData) {return {field: '<span></span>'};},
            captcha: function(fieldData) {return {field: '<span></span>'};}
            },              
eder-toledo commented 7 years ago

Sorry, in my code begin_group and end_group is a custom controls.

In the version 2.0 > have changes in the structure is different in specific cases.

My code is for < 2.0 > version.

The doc of project explain to details.

(y)

kevinchappell commented 7 years ago

resolved by #493