We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

valueAccessor can not render html

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.Pageej.grids.Sortej.grids.Filter,ej.grids.Resize);
var grid1 = new ej.grids.Grid({
    dataSource: customerData,
    Offline: true
    columns: [
                { field: 'cid'headerText: '會員編號'textAlign: 'center'width: 200type: 'string' },
                { field: 'name'width: 80headerText: '姓名'type: 'string' },
               
                { field: 'gender'headerText: '性別'textAlign: 'left'width: 100format: 'string' },
                { field: 'email'headerText: '電子郵件'textAlign: 'left'width: 120format: 'string' },
                { field: 'age'headerText: '聯絡地址'textAlign: 'left'width: 100format: 'string' },
                { field: 'tags'headerText: '標籤'textAlign: 'left'width: 160format: 'string',valueAccessor: tagsFormatter},
                { field: 'guid'headerText: '跨域識別碼'textAlign: 'left'width: 120format: '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(fielddatacolumn){
    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

3 Replies

TS Thiyagu Subramani Syncfusion Team January 17, 2020 05:17 AM

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. 


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>' 




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

Regards, 
  
Thiyagu S. 



AD adrian January 18, 2020 07:27 PM

Thanks ,you help me a lot .


BS Balaji Sekar Syncfusion Team January 20, 2020 02:34 AM

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. 


Loader.
Live Chat Icon For mobile
Up arrow icon