valueAccessor can not render html

adrian

Asked On January 16, 2020 08:55 AM UTC

Hi :

In the previous version(EJ2.min.js) ,the column property "valueAccessor " can render string to html , but in the newest version, it didn't work, how can i solve this problem ?

ej.grids.Grid.Inject(ej.grids.Page, ej.grids.Sort, ej.grids.Filter,ej.grids.Resize);
var grid1 = new ej.grids.Grid({
    dataSource: customerData,
    Offline: true, 
    columns: [
                { field: 'cid', headerText: '會員編號', textAlign: 'center', width: 200, type: 'string' },
                { field: 'name', width: 80, headerText: '姓名', type: 'string' },
               
                { field: 'gender', headerText: '性別', textAlign: 'left', width: 100, format: 'string' },
                { field: 'email', headerText: '電子郵件', textAlign: 'left', width: 120, format: 'string' },
                { field: 'age', headerText: '聯絡地址', textAlign: 'left', width: 100, format: 'string' },
                { field: 'tags', headerText: '標籤', textAlign: 'left', width: 160, format: 'string',valueAccessor: tagsFormatter},
                { field: 'guid', headerText: '跨域識別碼', textAlign: 'left', width: 120, format: 'string'},
                
    ],
    rowHeight: 20,
    //enableVirtualization: true,
    //enableColumnVirtualization: true,
    height: 750,
    allowPaging: true,
    pageSettings: { pageSize: 8 },
    allowSorting: true,
    allowTextWrap:true,
    textWrapSettings:{wrapMode:'Content'},
    //queryCellInfo: customiseCell
});
function tagsFormatter(field, data, column){
    var tmp_Str = data.tags;
    var tmp_Str2='';
    var rtn_Str='';
    var arr = tmp_Str.split(",");  
    for(var i=0;i<arr.length;i++){
        tmp_Str2='<span class="tagStyles tag-info  m-r-5 m-t-5">'+arr[i]+'</span>';
        
        rtn_Str=tmp_Str2+rtn_Str;
    }
    
    return rtn_Str;
}

Attachment: Desktop_ea46a4df.zip

Reply | Reply with quote

Thiyagu Subramani [Syncfusion]

Replied On January 17, 2020 10:17 AM UTC

Hi Adrian,

Greetings from Syncfusion forum.

We have validated your requirement at our end. Previously, Html tags are converted from string to html . But now value will be updated what type of text will be entered in the grid because there is no form of conversion performed in grid.

Please refer the below release notes for more information.

Link : https://ej2.syncfusion.com/documentation/release-notes/17.3.26/#grid

If you need html conversion in specific column you can achieve by setting disableHtmlEncode as false in column level. Please refer to the below code and sample link.

var grid = new ej.grids.Grid({

columns: [

{ field: 'OrderID', headerText: 'Order ID', width: 120, textAlign: 'Right' },

{ field: 'CustomerName', headerText: 'Customer Name', width: 150, disableHtmlEncode:false,

valueAccessor: valueAccess },

. . . . .

]

});

grid.appendTo('#Grid');

function valueAccess(field, data, column) {

return '<span>CustomerName</span>'

}

Sample link: https://stackblitz.com/edit/ptyea9-thc1xo?file=index.js

Help documentation link : https://ej2.syncfusion.com/angular/documentation/api/grid/column/?_ga=2.169710308.41787345.1579221629-93686665.1576498953#disablehtmlencode

Please get back to us, if you need any further assistance.

Regards,

Thiyagu S.

Reply | Reply with quote

adrian

Replied On January 19, 2020 12:27 AM UTC

Thanks ,you help me a lot .

Reply | Reply with quote

Balaji Sekar [Syncfusion]

Replied On January 20, 2020 07:34 AM UTC

Hi Adrian,

We glad that your issue has been fixed.

Please get back to us if you require further other assistance from us.

Regards,

Balaji Sekar.

Reply | Reply with quote

Thread ID:	Created:	Updated:	Platform:	Replies:
150690	Jan 16,2020 08:55 AM UTC	Jan 20,2020 07:34 AM UTC	JavaScript - EJ 2	3

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US