He creado una extensión de localizador de tiendas personalizada con su propia cuadrícula y edito páginas en Adminhtml y todo funciona muy bien. Para el horario de apertura de las tiendas, me gustaría implementar una cuadrícula dinámica como para las opciones de atributos.
Ahora he encontrado una solución, pero espero que haya una forma mejor, o al menos más limpia. Lo que tengo hasta ahora es agregar un renderizador al campo en el formulariofieldset
class Redkiwi_Rkstorelocator_Block_Adminhtml_Rkstorelocator_Edit_Tab_General extends Mage_Adminhtml_Block_Widget_Form
{
protected function _prepareForm()
{
$form = new Varien_Data_Form();
$this->setForm($form);
$fieldset = $form->addFieldset('rkstorelocator_form', array('legend'=>Mage::helper('rkstorelocator')->__('Store information')));
[...]
$officehours_field = $fieldset->addField('office_hours', 'editor', array(
'name' => 'office_hours',
'label' => Mage::helper('rkstorelocator')->__('Office hours'),
'required' => false,
));
$officehours_block = $this->getLayout()
->createBlock('rkstorelocator/adminhtml_rkstorelocator_edit_renderer_officehours')
->setData(array(
'name' => 'office_hours',
'label' => Mage::helper('rkstorelocator')->__('Office hours'),
'required' => false,
));
$officehours_field->setRenderer($officehours_block);
[...]
}
}
Y una clase de bloque para renderizar
class Redkiwi_Rkstorelocator_Block_Adminhtml_Rkstorelocator_Edit_Renderer_Officehours
extends Mage_Adminhtml_Block_Abstract
implements Varien_Data_Form_Element_Renderer_Interface
{
public function render(Varien_Data_Form_Element_Abstract $element)
{
$required_indicator = $this->getData('required') ? '<span class="required">*</span>' : '' ;
$html = '
<table id="attribute-options-table" class="dynamic-grid rkstorelocator-officehours" cellspacing="0" cellpadding="0"><tbody>
<tr>
<th>Day indicator</th>
<th>Opening hour</th>
<th>Closing hour</th>
<th>
<button id="add_new_option_button" title="Add Option" type="button" class="scalable add"><span><span><span>Add Option</span></span></span></button>
</th>
</tr>
</tbody></table>
<script type="text/javascript">//<![CDATA[
var _form_html_row = \'<tr class="option-row rkstorelocator-officehours-dayrow" id="hour-row-{{id}}"><td><input name="'.$this->getData('name').'[value][option_{{id}}][0]" value="" class="input-text required-option" type="text"></td><td><input name="'.$this->getData('name').'[value][option_{{id}}][2]" value="" class="input-text required-option" type="text"></td><td><input name="'.$this->getData('name').'[value][option_{{id}}][2]" value="" class="input-text required-option" type="text"></td><td class="a-left" id="delete_button_container_option_{{id}}"><input type="hidden" class="delete-flag" name="'.$this->getData('name').'[delete][option_{{id}}]" value=""/><button onclick="$(\\\'hour-row-{{id}}\\\').remove();" title="Delete" type="button" class="scalable delete delete-option"><span><span><span>Delete</span></span></span></button></td></tr>\';
var _rkstorelocator_counter = 0;
$(\'add_new_option_button\').on(\'click\', \'button\', function(){
$(\'attribute-options-table\').insert(_form_html_row.replace(/\{\{id\}\}/ig, _rkstorelocator_counter));
_rkstorelocator_counter++;
});
//]]></script>
';
return $html;
}
}
Lo que me da el siguiente resultado
Ahora, esto básicamente funciona, pero obtener los valores actuales allí será bastante complicado y, en general, no estoy demasiado orgulloso del código que he escrito (como se puede imaginar).
Busqué en Google varias soluciones, pero en general todas adoptan este enfoque. ¿Alguien sabe una forma más limpia de hacer esto?
