XF 2.2 Ajax loaded template and formrows rendering

[Scandal]

Hello all!

I have a question about ajax loaded content (template).

I use this code to get some ajax loaded content:

    var ajaxParams = {'act': 'test'};
    XF.ajax('post', "{{ link_type('admin', 'canonical:myroute', null) }}", ajaxParams, function(data, textStatus, jqXHR){
        $('#mydiv').append(data.output);
    });

The php side has this:

$this->setResponseType('json');
$html = \XF::app()->templater->renderTemplate('admin:sc_mytemplate', []);    
$output = ['output' => $html];            
echo json_encode($output);
exit;

The problem: sc_mytemplate has some formrow items like <xf:numberbox>, which are not rendered as "should".

Instead of this:

I'm getting this:


It seems that <xf:numberbox> is not rendering correctly, maybe due to javascript and ajax way I decided to load this template.

Any idea how to fix it or for a xF2 more normalized way?

 

[Jeremy P]

Just return a normal view from the PHP side. There shouldn't be a need for special handling.

var ajaxParams = {'act': 'test'};
XF.ajax(
    'post',
    "{{ link_type('admin', 'canonical:myroute', null) }}",
    ajaxParams,
    function(data)
    {
        XF.setupHtmlInsert(data.html, function($html)
        {
            $('#mydiv').append($html);
        });
    }
);

 

[Scandal]

That's great, worked
Thanks

 

[Scandal]

Just return a normal view from the PHP side. There shouldn't be a need for special handling.

var ajaxParams = {'act': 'test'};
XF.ajax(
    'post',
    "{{ link_type('admin', 'canonical:myroute', null) }}",
    ajaxParams,
    function(data)
    {
        XF.setupHtmlInsert(data.html, function($html)
        {
            $('#mydiv').append($html);
        }
    }
);

Hi again guyz!

Jeremy or anyone else: could you provide me the above example code as it should be on xF2.3 (jQuery removed, XF.setupHtmlInsert has a small change etc), so as to work the same way?

I make it work, but have some issues with the styling / formrows rendering, like my first post's request.
So maybe someone could provide an example converted code based on xF2.3? Just those lines of code.

Thanks in advance!

 

[Jeremy P]

const ajaxParams = {'act': 'test'};
XF.ajax(
    'post',
    "{{ link_type('admin', 'canonical:myroute', null) }}",
    ajaxParams,
    function(data)
    {
        XF.setupHtmlInsert(data.html, (html) =>
        {
            document.querySelector('#mydiv').append(html);
        });
    }
);