I'm learning to create an UI components form, but stuck on neverending spinner. Help me to create this form, step by step, please. enter image description here I have a module in adminhtml which shows a table from database. This table contains columns id, age, name, comment. I need to build an edit form which shows after click on a row in the table. File myadminroute_index_edit.xml was created in Overdose\AdminPanel\view\adminhtml\layout\myadminroute_index_edit.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="Magento\Backend\Block\Template" template="Overdose_AdminPanel::future-form.phtml"/>
<uiComponent name="overdose_friends_form"/>
</referenceContainer>
</body>
</page>
UI component overdose_friends_form.xml is located in *\Overdose\AdminPanel\view\base\ui_component*
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">overdose_friends_form.overdose_friends_form_data_source</item>
<item name="deps" xsi:type="string">overdose_friends_form.overdose_friends_form_data_source</item>
</item>
<item name="label" xsi:type="string" translate="true">Editing in the Form</item>
<item name="layout" xsi:type="array">
<item name="type" xsi:type="string">tabs</item>
</item>
<item name="config" xsi:type="array">
<item name="dataScope" xsi:type="string">data</item>
</item>
<item name="buttons" xsi:type="array">
<item name="primary" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Save Button</item>
<item name="class" xsi:type="string">primary</item>
<item name="url" xsi:type="string">myadminroute/index/save</item>
</item>
<item name="primary" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Back Button</item>
<item name="class" xsi:type="string">primary</item>
<item name="url" xsi:type="string">myadminroute/index/index</item>
</item>
</item>
<item name="template" xsi:type="string">templates/form/collapsible</item>
</argument>
<dataSource name="overdose_friends_form_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<argument name="class" xsi:type="string">Overdose\AdminPanel\Controller\Adminhtml\Model\Dataprovider</argument>
<argument name="name" xsi:type="string">overdose_friends_form_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
</argument>
<argument name="data" xsi:type="array">
<item name="js_config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
</item>
</argument>
</dataSource>
<fieldset name="sample_fieldset">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Sample Fieldset</item>
</item>
</argument>
<!-- This field represents form id -->
<field name="id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">sampleform</item>
</item>
</argument>
</field>
</fieldset>
</form>
Dataprovider.php is located in *\Overdose\AdminPanel\Controller\Adminhtml\Model*
<?php
namespace Overdose\AdminPanel\Controller\Adminhtml\Model;
use \Overdose\LessonOne\Model\ResourceModel\Collection\FriendsFactory;
class DataProvider extends \Magento\Ui\DataProvider\AbstractDataProvider
{
public function __construct(
$name,
$primaryFieldName,
$requestFieldName,
\Overdose\LessonOne\Model\ResourceModel\Collection\FriendsFactory $friendsFactory,
array $meta = [],
array $data = []
) {
$this->collection = $friendsFactory->create();
parent::__construct($name, $primaryFieldName, $requestFieldName, $meta, $data);
}
/**
* Get data
*
* @return array
*/
public function getData()
{
return [];
}
}
The controller consists of AbstractController.php in *\Overdose\AdminPanel\Controller\Adminhtml\Index*
<?php
namespace Overdose\AdminPanel\Controller\Adminhtml\Index;
use Magento\Backend\App\Action;
use Magento\Framework\App\Config\ScopeConfigInterface;
abstract class AbstractController extends \Magento\Backend\App\Action
{
const DEFAULT_ACTION_PATH = 'myadminroute/index/';
protected $friendsFactory;
protected $friendsResourceModel;
public function __construct(
Action\Context $context,
// TODO: Add your repository or model/resourceModel classes here
\Overdose\LessonOne\Model\FriendsFactory $friendsFactory,
\Overdose\LessonOne\Model\ResourceModel\Friends $friendsResourceModel
) {
parent::__construct($context);
// TODO: Assign them to the protected variable, so that child classes can access it
$this->friendsFactory = $friendsFactory;
$this->friendsResourceModel = $friendsResourceModel;
}
}
and Edit.php in *\Overdose\AdminPanel\Controller\Adminhtml\Index*
<?php
namespace Overdose\AdminPanel\Controller\Adminhtml\Index;
use Magento\Framework\App\Action\HttpGetActionInterface;
use Magento\Backend\App\Action;
use Magento\Framework\Controller\ResultFactory;
class Edit extends AbstractController
{
public function execute()
{
$adminPage = $this->resultFactory->create('page');
$adminPage->getConfig()->getTitle()->prepend(__('Friend form'));
$entityId = $this->getRequest()->getParam('id');
//echo ($entityId);
return $adminPage;
}
}
-
Please check: mageplaza.com/devdocs/creat-a-ui-form-in-magento-2.html and this webkul.com/blog/create-ui-form-magento2-part-1ZealousWeb– ZealousWeb2021年02月22日 10:40:05 +00:00Commented Feb 22, 2021 at 10:40
1 Answer 1
When you develop any frontend side things keep open your browser console.
If you see endless spinner on admin pages, basically it means something not working. So try to open browser console and catch the info's.
Explore related questions
See similar questions with these tags.
default