0

I am Working on A magento 2 custom Module i have a Form as well a Product Grid in my form so i created tabs using block but Whenever i click on save button gives me Javascript Error

TypeError: $.data(...) is undefined

Here is my form vendorName\moduleName\Block\Adminhtml\BackgroundImage\Edit\Form.php

namespace vendor name\Module name\Block\Adminhtml\BackgroundImage\Edit;


class Form extends \Magento\Backend\Block\Widget\Form\Generic
{
    /**
     * Prepare form
     *
     * @return $this
     */
    public function _prepareForm()
    {
        /** @var \Magento\Framework\Data\Form $form */
        $form = $this->_formFactory->create(
            [
                'data' => [
                    'id' => 'edit_form',
                    'action' => $this->getData('action'),
                    'method' => 'post',
                    'enctype' => 'multipart/form-data'
                ]
            ]
        );
        $form->setUseContainer(true);
        $this->setForm($form);
        return parent::_prepareForm();
    }
}

Here is my Edit page where i Defined my Button vendorName\moduleName\Block\Adminhtml\BackgroundImage\Edit.php

namespace FvendorName\moduleName\Block\Adminhtml\BackgroundImage;


class Edit extends \Magento\Backend\Block\Widget\Form\Container
{

    protected $_coreRegistry = null;


    public function __construct(
        \Magento\Backend\Block\Widget\Context $context,
        \Magento\Framework\Registry $registry,
        array $data = []
    ) {
        $this->_coreRegistry = $registry;
        parent::__construct($context, $data);
    }


    protected function _construct()
    {
        $this->_objectId = 'backgroundimage_id';
        $this->_blockGroup = 'FME_BackgroundImage';
        $this->_controller = 'adminhtml_backgroundImage';
        parent::_construct();

        if ($this->_isAllowedAction('FME_BackgroundImage::save')) {
            $this->buttonList->update('save', 'label', __('Save Image'));
            $this->buttonList->add(
                'saveandcontinue',
                [
                    'label' => __('Save and Continue Edit'),
                    'class' => 'save',
                    'data_attribute' => [
                        'mage-init' => [
                            'button' => ['event' => 'saveAndContinueEdit', 'target' => '#edit_form'],
                        ],
                    ]
                ],
                -100
            );
        } else {
            $this->buttonList->remove('save');
        }


    }

    /**
     * Retrieve text for header element depending on loaded page
     *
     * @return string
     */
    public function getHeaderText()
    {
        if ($this->_coreRegistry->registry('backgroundimage')->getId()) {
            return __(
                "Edit BackgroundImage '%1'",
                $this->escapeHtml($this->_coreRegistry->registry('backgroundimage')->getTitle())
            );
        } else {
            return __('New BackgroundImage');
        }
    }

    /**
     * Check permission for passed action
     *
     * @param string $resourceId
     * @return bool
     */
    public function _isAllowedAction($resourceId)
    {
        return $this->_authorization->isAllowed($resourceId);
    }

    /**
     * Getter of url for "Save and Continue" button
     * tab_id will be replaced by desired by JS later
     *
     * @return string
     */
    public function _getSaveAndContinueUrl()
    {
        return $this->getUrl(
            'backgroundimage/*/save',
            ['_current' => true, 'back' => 'edit', 'active_tab' => '{{tab_id}}']
        );
    }

    public function getFormActionUrl()
    {
        if ($this->hasFormActionUrl()) {
            return $this->getData('form_action_url');
        }

        return $this->getUrl('*/*/save');
    }

    /**
     * Prepare layout
     *
     * @return \Magento\Framework\View\Element\AbstractBlock
     */
    public function _prepareLayout()
    {
        $this->_formScripts[] = "
            function toggleEditor() {
                if (tinyMCE.getInstanceById('page_content') == null) {
                    tinyMCE.execCommand('mceAddControl', false, 'page_content');
                } else {
                    tinyMCE.execCommand('mceRemoveControl', false, 'page_content');
                }
            };
        ";
        return parent::_prepareLayout();
    }
}
  • do u see any error in console? – sudo55 Mar 21 at 9:19
  • I got this in console TypeError: $.data(...) is undefined – Waqar Ali Mar 21 at 9:20
  • u have extented your edit class from "\Magento\Backend\Block\Widget\Form\Container" u should extend it from this class \Magento\Backend\Block\Widget – sudo55 Mar 21 at 9:21
  • Now getting this error Notice: Undefined property: Vendor\module\Block\Adminhtml\BackgroundImage\Edit::$buttonList – Waqar Ali Mar 21 at 9:24
  • u have used $this->buttonList object which does not belongs to any other class. – sudo55 Mar 21 at 9:29
0

Check $form->setUseContainer(true); in your file if it is there either remove or set to false.

New contributor
Bhupendra Mehra is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.