Facing issue while trying to retrieve image in grid cell.

[Ajay]

Hi,

I am trying to retrieve image in PQ Grid.
From the code, I am getting byte array.
so i converted back to base64string and tried to display,but the image is not displaying properly.
Here is my Code,

Please let me know If I am missing anything.

searchNhidGrid = $('#searchNhidGrid');
        var columnModel = [
                           { title: " Application name", dataIndx: "Name", width: 150, align: "left" },
                           { title: " Application description", dataIndx: "Description", width: 150, align: "left" },
                           {
                               title: "Application icon/logo", dataIndx: "Image", width: 150, align: "left",
                               render: function (ui) {
                                   var rowData = ui.rowData,
                                       dataIndx = ui.dataIndx,
                                       cellData = rowData[dataIndx];
                                   if (typeof cellData === "undefined")
                                       return "<span ></span>";
                                   else {
                                       var imageDisplay = cellData;
                                       var base64 = base64js.fromByteArray(imageDisplay); //converting bytearray to base64 string

                                       return '<img src="data:image/jpeg;base64,"' + base64 + '></img>';
                                       
                                   }
                               }
                           },
                           { title: "Application Status", dataIndx: "Status", width: 150, align: "left" },
                           { title: "Partner GUID", dataIndx: "PartnerGuid", width: 150, align: "left" }
        ];
        searchNhidGrid.pqGrid({
            width: NMCApp.getSearchGridWidth(),
           height: NMCApp.getSearchGridHeight(),
            editable: false,
            showTop: false,
            showBottom: false,
            hoverMode: 'row',
            selectionModel: { type: 'row', mode: 'single' },
            numberCell: false,
            roundCorners: false,
            wrap: false,
            colModel: columnModel,
            dataModel: { data: [] }
        });

[paramvir]

It looks like improper closing of quotes of src attribute in your img tag

Code: [Select]

return '<img src="data:image/jpeg;base64,"' + base64 + '></img>';

should be

Code: [Select]

return '<img src="data:image/jpeg;base64,' + base64 + '" />';


[Ajay]

Thanks for the help.