Magento2, need help with ajax return data processing from controller which is string of html tags

Question

considering below in controller:

     /**
     *
     * @return string
     */
    public function execute()
    {
        $resultJson = $this->resultJsonFactory->create();
        $layout = $this->_view->getLayout();
        $block = $layout->createBlock('Magento\Sales\Block\Adminhtml\Order\Create\Totals')->renderTotals('footer');
        $this->log->debug($block);
        return $resultJson->setData($block);
    }

I get below in logger:

[2017-10-01 10:06:45] main.DEBUG: <tr class="row-totals">
    <td style="" class="admin__total-mark" colspan="1">
        <strong>Grand Total</strong>
    </td>
    <td style="" class="admin__total-amount">
        <strong><span class="price">NOK37.20</span></strong>
    </td>
</tr>

below is my ajax call in view and I need to get the total amount 37.20, but got stuck :

$.ajax({
                        showLoader: true,
                        url: ajaxurl,
                        dataType: "html",
                        data: {
                          form_key: $('input[name=form_key').val()
                      },
                      type: "POST"
                    }).done(function (result) {
                     // how to  process result
                    });

Appreciate any hint to access the price form result.

Answer 1

Change your controller like

/**
     *
     * @return string
     */
    public function execute()
    {
        $layout = $this->_view->getLayout();
        $block = $layout->createBlock('Magento\Sales\Block\Adminhtml\Order\Create\Totals')->renderTotals('footer');
        $this->log->debug($block);

        $responseObj = new \Magento\Framework\DataObject();
        $response['price'] = $block;
        $responseObj->setData($response);

        $this->getResponse()->setHeader('Content-type', 'application/json');
        $this->getResponse()->representJson($responseObj->toJson());
    }

And JS will be

$.ajax({
    showLoader: true,
    url: ajaxurl,
    dataType: "html",
    data: {
        form_key: $('input[name=form_key').val()
    },
    type: "POST"
}).done(function (result) {
    result = $.parseJSON(result);

    var priceHtml = result.price;
    console.log(priceHtml);

    var priceText = $(priceHtml).find('.price').html();
    console.log(priceText.substring(3));
});

Make sure flash js cache.