From 93076ac8bf0d1f43dbe89842fe24fb2edc6c9f52 Mon Sep 17 00:00:00 2001 From: f Date: Tue, 24 Jul 2018 15:44:31 -0300 Subject: [PATCH] permitir anidar recursivamente --- app/assets/javascripts/table_field.js | 41 +++++++++++++++------- app/views/posts/template_field/_table.haml | 22 ++++++------ 2 files changed, 40 insertions(+), 23 deletions(-) diff --git a/app/assets/javascripts/table_field.js b/app/assets/javascripts/table_field.js index ed2e148..8af2bc8 100644 --- a/app/assets/javascripts/table_field.js +++ b/app/assets/javascripts/table_field.js @@ -1,11 +1,20 @@ $(document).on('turbolinks:load', function() { + var removeGroup = function(e) { + e.preventDefault(); + var group = $(this).data('group') + $(this).parents('.field-group.'+group).remove(); + } + + var addGroup = function(e) { // Permite agregar más filas a los campos nested? && array? - $('.add-group').click(function(e) { e.preventDefault(); var _this = $(this); + // Obtener el nombre del grupo para poder delimitar el campo de + // acción + var _own_group = _this.data('group') // Sube hasta la raíz del grupo - var _groups = _this.parents('.field-groups'); + var _groups = _this.parents('.field-groups.'+_own_group); // En este elemento se van a agregar los nuevos var _extra = _groups.children('.extra-groups'); // El grupo a clonar es el primero, siempre con id 0 @@ -26,30 +35,36 @@ $(document).on('turbolinks:load', function() { // un ID generado a partir del tiempo Unix. De esta forma se crea // un grupo que va a terminar en el mismo Hash de valores. var _date = (new Date).getTime(); - _group.find('[name*="[0]"]').each(function(i, input) { + // Filtramos por el grupo para ser mas especificas + _group.find('[name*="['+_own_group+'][0]"]').each(function(i, input) { var _input = $(input); var _name = _input.attr('name'); _input.attr('name', _name.replace(/\[0\]/, '['+_date+']')); - _input.val(''); + if (['checkbox','radio'].includes(_input.attr('type'))) { + _input.prop('checked', false); + } else { + _input.val(''); + } }); + // Eliminar los campos extra + _group.find('.extra-groups').children().remove(); + // Regenera el evento del botón de borrado - _group.find('.remove-group').click(function(e) { - e.preventDefault(); - $(this).parents('.field-group').remove(); - }); + _group.find('.remove-group').click(removeGroup); + // Agregar el evento a los sub-botones + _group.find('.add-group').click(addGroup); // Regenera los select2 var _select2 = _group.find('.select2'); var _select2_opts = { theme: 'bootstrap', width: '' } _select2.select2(_select2_opts); _group_orig.find('.select2').select2(_select2_opts); - }); + }; + + $('.add-group').click(addGroup); // Este evento permite remover las filas que ya existen en un post // editado - $('.remove-group').click(function(e) { - e.preventDefault(); - $(this).parents('.field-group').remove(); - }); + $('.remove-group').click(removeGroup); }); diff --git a/app/views/posts/template_field/_table.haml b/app/views/posts/template_field/_table.haml index c481664..7e00381 100644 --- a/app/views/posts/template_field/_table.haml +++ b/app/views/posts/template_field/_table.haml @@ -7,12 +7,11 @@ -# El grupo individual, tenemos que crear uno si el post es nuevo, o -# todos los que sean necesarios si estamos editando un post. - - if @post.new? - -# Creamos un array con un elemento solo para poder tener acceso a :each - - groups = [[]] - - else - -# Obtenemos todos los valores. Puede ser un Hash o un Array - - groups = @post.get_front_matter(template.key) + -# Obtenemos todos los valores. Puede ser un Hash o un Array + -# Creamos un array con un elemento solo para poder tener acceso a :each + - groups = @post.get_front_matter(template.key) + -# TODO volver a revisar cuando get_front_matter() tenga valores por defecto + - groups = [{}] unless groups - if groups.is_a? Hash - groups = [ groups ] - groups.each_with_index do |group, i| @@ -23,7 +22,7 @@ -# Luego por CSS ocultamos el primero. - if template.array? .clearfix - %button.btn.btn-warning.btn-sm.pull-right.remove-group + %button.btn.btn-warning.btn-sm.pull-right.remove-group{data: { group: template.key }} = fa_icon 'close', title: t('posts.row.del', group: template.key.humanize) = t('posts.row.del', group: template.key.humanize) -# Separar los campos en dos columnas @@ -33,10 +32,13 @@ .col-md -# Si el template es un array, quiere decir que esperamos un array de hashes. -# El valor vacío luego es reemplazado por un id temporal + + -# XXX usamos local_name para hacerlo recursivo y sumar el + -# name después, sin modificarlo recursivamente. - if template.array? - - name = [template.key, i.to_s, nf.key] + - local_name = [i.to_s, nf.key] - else - - name = [template.key, nf.key] + - local_name = [nf.key] - if @post.new? - value = nf.values - else @@ -47,7 +49,7 @@ = render 'posts/template_field/nested', template: nf, value: value, - name: name + name: [name, local_name].flatten .extra-groups - if template.array? .clearfix