2017-01-30 13 views
3

Я боролся с этим в течение нескольких дней ... Для расширения админа, я пытаюсь загрузить uiComponent с Ajax для отображения на вкладке. UiComponent правильно загружен, но, похоже, не полностью обрабатывается логикой нокаута на стороне клиента.magento2: загрузка uicomponent с Ajax

namespace Man4x\MondialRelay2\Block\Adminhtml\Shipping; 

class Tabs 
extends \Magento\Backend\Block\Widget\Tabs { 
protected function _construct() 
{ 
    parent::_construct(); 
    $this->setId('mondialrelay2_shipping_tabs'); 
    $this->setDestElementId('container'); 
    $this->setTitle(__('MondialRelay')); 
} 

protected function _beforeToHtml() 
{ 
    $this->addTab(
     'mass_shipping', 
     [ 
      'label' => __('Mass Shipping'), 
      'title' => __('Mass Shipping'), 
      'url' => $this->getUrl('*/*/massshipping', ['_current' => true]), 
      'class' => 'ajax' 
     ] 
    ); 

    return parent::_beforeToHtml(); 
} 
} 

Вот простой макет управления:

<?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"> 
<container name="root" label="Root"> 
    <uiComponent name="mondialrelay2_massshipping_grid"/> 
</container> 

Примечание: этот обычай UIComponent является совершенно функциональным при загрузке в стандартной (т.е. не AJAX) способ

Когда отслеживая ответ AJAX, я могу видеть, что правильный HTML-код для uiComponent загружен (включая специальный тег x-magento-init Magento). Затем он обрабатывается обратным вызовом jquery-ui:

this.xhr = $.ajax(this._ajaxSettings(anchor, event, eventData)); 

    // support: jQuery <1.8 
    // jQuery <1.8 returns false if the request is canceled in beforeSend, 
    // but as of 1.8, $.ajax() always returns a jqXHR object. 
    if (this.xhr && this.xhr.statusText !== "canceled") { 
     tab.addClass("ui-tabs-loading"); 
     panel.attr("aria-busy", "true"); 

     this.xhr 
      .success(function(response) { 
       // support: jQuery <1.8 
       // http://bugs.jquery.com/ticket/11778 
       setTimeout(function() { 
        panel.html(response); 
        that._trigger("load", event, eventData); 
       }, 1); 
      }) 

... для загружаемого HTML-кода, который необходимо вставить в тег контейнера. Затем в js-модулях jungle обрабатывается множество обратных вызовов и перехватчиков. Событие «contentUpdated» наконец-то срабатывает, в результате чего:

/** 
* Init components inside of dynamically updated elements 
*/ 
$('body').on('contentUpdated', function() { 
    if (mage) { 
     mage.apply(); 
    } 
}); 

return $.mage; 
})); 

мага/применить/main.js и маг/применить/scripts.js затем правильно называется (как разыскали в консоли браузера), но .. . Ничего не произошло. Мой загруженный

<script type="x-magento-init"> 

исчез, но моя компонентная логика JS не обрабатывается вообще.

Любое просвещение будет высоко оценено.

PS: после более глубокого расследования кажется, что компоненты JS-файлов uiComponent загружены, но не их шаблоны!

+0

PS: еще два дня без какой-либо фиксации ... Magento2 FRONTEND логик расслоения плотных чистая ад: 30 уровней стек вызовов, бесконечные обещания и закрытия. – Man4x

+0

Собираюсь совершить самоубийство или поговорить с садоводством ... – Man4x

+0

Ну ... Через неделю я сдаюсь. : (((( После изучения вызова ajax сопутствующих продуктов на странице продукта, я думаю, мне нужно будет включить компонент AJAX-загруженный в форму, чтобы метод onRender компонента/form/insert.js был вызвано, но отладка логики клиента Magento2 - чистая чума! Если кто-то может помочь мне с таким простым случаем, я бы очень признателен ... – Man4x

ответ

0

Я столкнулся с той же проблемой, что и в аналогичном случае. Похоже, что привязки не применяются, как должны, или, по крайней мере, не тогда, когда они должны, в этом сценарии. Чтобы это исправить, не изменяя шаблон я прибег к некоторому дополнительному 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"> 
<container name="root" label="Root" htmlTag="div" htmlId="mondialrelay2"> 
    <uiComponent name="mondialrelay2_massshipping_grid"/> 
    <block class="Magento\Framework\View\Element\Text" name="ajax_ui_component_fix"> 
     <action method="setText"> 
      <argument name="text" xsi:type="string"><![CDATA[<script> 
       require(['jquery'], function ($) { 
        $('#mondialrelay2').applyBindings(); 
       }); 
      </script>]]></argument> 
     </action> 
    </block> 
</container>