Json response not getting updated in Firefox

Question

I have an HTML SPAN (class: displayText) in my MVC view which has "typeId", and "idValue" attributes. The objective is to fetch DisplayText property from a database table for the passed "typeId" and "idValue".

I have number of such SPAN in my view, so I call following method in document.ready() function to get the display text and show it on view, so that users don't need to wait.

$('span.displayText').each(
function (index) {
    var url = $('#UrlGetDisplayName').val();
    $.ajax({
        type: "GET",
        url: url,
        data: ({ typeId: $(this).attr('typeId'),
            value: $(this).attr('idValue')
        }),
        success: function (result) {
            $('span.displayText')[index].innerText = result;
        }
    });
})

In above code, UrlGetDisplayName is the ID of HiddenField on my MVC view that contains the URL of following MVC controller action which is responsible to bring display value from database.

[HttpGet]
public virtual JsonResult GetDisplayTextByType(string typeId, string idValue)
{
    string displayText = "";
    /* Code to call a database method to fetch text by type, and assign it to displayText */
return Json(displayText, JsonRequestBehavior.AllowGet);
}

This works perfectly in IE and Chrome, but in Firefox it doesn't update the value in SPAN control. I can monitor in Firebug that the Controller action being called and also, it returns correct Json response, but doesn't update the span. What could be the possible reason? And how to fix it?

.innerText won't work in firefox. http://stackoverflow.com/questions/1359469/innertext-works-in-ie-but-not-in-firefox — anil, Jul 31 '13 at 05:32

score 1 · Accepted Answer · answered Jul 31 '13 at 05:25

1

Please try Text() or html() instead of innerText().

Like this,

$('span.displayText')[index].Text(result);

answered Jul 31 '13 at 05:25

Kosala Yapa

64
2
9

Cool, I realized this is the problem of innerText property which is not supported in Firefox. I found one another solution at http://stackoverflow.com/questions/1359469/innertext-works-in-ie-but-not-in-firefox. Check bobnice answer. Thanks for your help, this helped me to identify the area where the problem was, so marking it as answer. :) – Nirman Jul 31 '13 at 05:48

웃웃웃웃웃 · Answer 2 · 2013-07-31T05:39:50.053

Try specifying the dataType of ajax response.Also innerText will not work with firefox.So try to use html() or text()

 $.ajax({
        type: "GET",
        url: url, 
        dataType:'json',
        data: ({ typeId: $(this).attr('typeId'),
            value: $(this).attr('idValue')
        }),
        success: function (result) {
            var response    = JSON.stringify(result);
            response        = JSON.parse(response);
            console.log(response);//Logging the response to browser console
            $('span.displayText')[index].html(response);
        }
    });

Json response not getting updated in Firefox

2 Answers2