Search code examples
elasticsearchnestmathjax

Enable MathJax in elasticearch result with Ajax call

I use mathJax in blog post and everything works fine when the post is viewed. But in Elasticsearch search result with ajax I get x = {-b \pm \sqrt{b^2-4ac} \over 2a} instead of

enter image description here

I reload MathJax after Elasticsearch ajax call is fired, Like this:

 $.ajax({
      url: "https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML",
      dataType: "script",
 });

But unforunetly it doesn't work.

How can I fix this problem?

UPDATE:

function ajaxSeach(term) {
    $.ajax({
        url: '/Search/AjaxSearch?term=' + term,
        error: function () {
        },
        async: false,
        dataType: 'json',
        success: function (data) {    
            var newElement = "";
            for (var i = 0; i < data.result.length; i++) {
                newElement += '<div>';
                newElement += '<a href="/Posts/Post/' + data.result.[i].id + '/' + '>' + data.result[i].title + '</a>';
                newElement += "</div></hr>";
            }
            $.ajax({
                url: "https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML",
                dataType: "script",
            });
            $('#ajaxSearchContainer').html(newElement);                
        },
        type: 'GET'
    });
}
Solution

  • Loading MathJax.js multiple times will have no effect (it detects itself running).

    You need to tell MathJax to typeset the newly arrived content. From the MathJax documentation:

    To queue the typeset action, use the command

    MathJax.Hub.Queue(["Typeset",MathJax.Hub]);

    Add this to success and you should see MathJax render the new content.