JQgrid: Russian data is displayed as Junk/invalid symbols

Question

I have a jqgrid where I can upload data in English/ French / Russian. When I am uploading Russian characters, it is displayed as like some invalid symbols. Something like �?�?�? �? I have changed the encoding of jsp page as <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

Is there anything specific to be changed in jq configuration ? Please help. Following is my Jquery implementation

jQuery('#studentLst')
            .jqGrid(
                    {
                        url : endpoint,
                        datatype : 'json',
                        rownumbers : true,
                        height : 250,
                        colNames : [ 'StudentID', 'Name', 'Marks','Description' ],
                        colModel : [ {
                            name : 'sId',
                            index : 'sId',
                            hidden : true
                        }, {
                            name : 'name',
                            index : 'name',

                        }, {
                            name : 'marks',
                            index : 'marks',
                            width : 200

                        },{
                            name : 'description',
                            index : 'description',
                            width : 190,
                            sortable : false
                        }],
                        multiselect : false,
                        rowNum : 10,
                        rowList : [ 10, 20, 40, 60, 80, 100 ],
                        viewrecords : true,
                        autowidth : true,
                        caption : 'Student List',
                        onSelectRow : function(ids) {
                            //Load sub grids
                        },

                        gridComplete : function() {
                            //Implementation
                        },
                        loadComplete : function(response) {

                        },
                        onPaging : function(pgButton) {
                            $("#studentLst").setGridParam({
                                datatype : 'json'
                            });
                        },
                        pager : "#studentLstPg"
                    });
jQuery('#studentLst').navGrid('#studentLstPg', {
        search : false,
        addfunc : function() {
            //add student
        },
        addtitle : 'Add Student',
        editfunc : function() {
            //update student info implementation
        },
        edittitle : 'Edit Student',
        delfunc : function() {
            // Show confirmation box and delete the student

        },
        deltitle : "Delete Student"
    });
    var grid = jQuery("#studentLst");
};

Do you save the file (html/jsp page) really in `UTF-8` format? — Oleg, Jun 04 '14 at 09:07
It's clear that you load the data dynamically, you you have to post **more implementation details**. If you would do all correctly you will have no problems. So one need see more implementation details to find which error you do. Try to include some russian texts *directly* on html/jsp page and verify that you have the same problem. It could be for example that you have an issue in database or in the way how you access the database. — Oleg, Jun 04 '14 at 09:21
Do you placed russian texts *directly* on html/jsp page (like `Привет!`) outside of jqGrid? Do you see correctly the text? Do you have problems with the *data* returned from `url : endpoint`? Do you validated with respect of [Fiddler](http://www.telerik.com/download/fiddler) or Developer Tools (press F12 to start and then start trace in Network tab) that the data returned from the server are correctly? — Oleg, Jun 04 '14 at 10:05
@Poppy have you seen my answer? If you post the json file, it would be easier, Poppy's suggestion to include the text directly in the jsp page is a good idea, there you could see if it is a jsp page / json file / db problem — netadictos, Jun 04 '14 at 10:59
@netadictos I had problems in retrieving response from my API Now, the API response is returned properly while in UI it is not displayed correctly. I tried to add a student with name тестирование. API response is as expected while in UI it is again junk. I have tried to add as well as . Still the problem persists :( is there anything I am missing ? — Poppy, Jun 05 '14 at 08:40
@Poppy: please verify the json you are receiving via firebug / fiddle, and post it please. — netadictos, Jun 05 '14 at 12:15

score 0 · Accepted Answer · edited May 23 '17 at 11:57

Encoding for dynamic file

If the data are loaded from a dynamic json or xml, before returning it, you should include a header in that file, where you indicate the charset. In jsp it would be:

<%@ page language="java" contentType="application/json; charset=UTF-8"
    pageEncoding="UTF-8"%>

Look here:

Set Content-Type to application/json in jsp file

In php it would be:

header('Content-Type: text/html; charset=utf-8');

Encoding for static file

If it is a static file, verify you are saving it with the right encoding (try for example notepad++ / sublime text if you can't see the encoding of the file, this kind of app has options to save the file with different encodings).

enter image description here

JQgrid: Russian data is displayed as Junk/invalid symbols

1 Answers1