Posted on

Magento 2: How to add button in system configuration?

I’m trying to add a button in the system configuration but also wanted to save it in the core_config_data. The reason is in every store view I want to show different messages based on the store id. But the problem is when I create a button in system.xml it does not save any path in core_config_data. Here is the code which I have done so far,

System.xml

<field id=”sync_terminal” translate=”label” type=”button” sortOrder=”7″ showInDefault=”1″ showInWebsite=”1″ showInStore=”1″>
<label>Synchronize payment methods</label>
<frontend_model>VendorModuleBlockSystemConfigButton</frontend_model>
</field>

Controller file Button.php

<?php

namespace VendorModuleControllerAdminhtmlSystemConfig;

use MagentoBackendAppAction;
use MagentoBackendAppActionContext;
use MagentoFrameworkControllerResultJson;
use MagentoFrameworkControllerResultJsonFactory;
use MagentoConfigModelResourceModelConfig;
use MagentoFrameworkAppConfigScopeConfigInterface;
use MagentoStoreModelScopeInterface;
use MagentoFrameworkAppResponseHttp as ResponseHttp;

class Button extends Action
{
/**
* Get country path
*/
const COUNTRY_CODE_PATH = ‘general/country/default’;

protected $resultJsonFactory;

/**
* @var SystemConfig
*/
private $systemConfig;
/**
* @param Context $context
* @param JsonFactory $resultJsonFactory
*/
public function __construct(
Context $context,
JsonFactory $resultJsonFactory
) {
$this->resultJsonFactory = $resultJsonFactory;
parent::__construct($context);
}

/**
* @return Json
*/
public function execute()
{

$message = ‘success’;
/** @var Json $result */
$result = $this->resultJsonFactory->create();

return $result->setData([‘message’ => $message]);
}

}

Template file button.phtml

<script>
require([
‘jquery’,
‘prototype’
], function ($) {

$(‘#btn_id’).click(function () {
var params = {};
new Ajax.Request(‘<?php echo $block->getCustomUrl() ?>’, {
parameters: params,
loaderArea: false,
asynchronous: true,
onCreate: function () {
$(‘#btn_id_response_message’).text(”);
},
onSuccess: function (transport) {
var resultText = ”;
if (transport.status > 200) {
resultText = transport.statusText;
} else {
var response = JSON.parse(transport.responseText);
resultText = response.message
}
$(‘#btn_id_response_message’).text(resultText);

}
});
});
});
</script>
<?php echo $block->getButtonHtml(); ?>
<p>
<span id=”btn_id_response_message”></span>
</p>

Block file Button.php

<?php
namespace VendorModuleBlockSystemConfig;

use MagentoConfigBlockSystemConfigFormField;
use MagentoBackendBlockTemplateContext;
use MagentoFrameworkDataFormElementAbstractElement;
class Button extends Field
{
protected $_template = ‘Vendor_Module::system/config/button.phtml’;

public function __construct(
Context $context,
MagentoStoreModelStoreManagerInterface $storeManager,
array $data = []
)
{
parent::__construct($context, $data);
$this->_storeManager = $storeManager;

}

protected function _getElementHtml(AbstractElement $element)
{
return $this->_toHtml();
}

public function getCustomUrl()
{
return $this->getUrl(‘vendormodule/system_config/button’);
}

/**
* @throws LocalizedException
*
* @return string
*/
public function getButtonHtml()
{
$button = $this->getLayout()->createBlock(
‘MagentoBackendBlockWidgetButton’
)->setData(
[
‘id’ => ‘btn_id’,
‘label’ => __(‘Synchronize Terminals’),
‘class’ => $this->getCurrentStoreId()
]
);

return $button->toHtml();
}

public function getCurrentStoreId()
{
/* Get Current Store ID */
return $this->_storeManager->getStore()->getId();
}
}

Leave a Reply

Your email address will not be published. Required fields are marked *