datagrid: font size

[korenanzo]

Hi all,

I'd like to set the font style of a datagrid programmaticlaly, and let the datagrid to set its measures up according to it.

in textboxes I can do it with something like

$(textbox).css('font-size', size)

but what about datagrid?

thanks,

RIc

[stworthy]

This is the extended method to change the styles for the datagrid.

Code:

$.extend($.fn.datagrid.methods, {
  setStyles: function(jq, style){
    return jq.each(function(){
      var cc = $(this).closest('div.datagrid-view');
      var id = cc.attr('id');
      if (!id){
        id = '_easyui_datagrid_view'+($.fn.window.defaults.zIndex++);
        cc.attr('id', id);
      }
      var selector = '.datagrid-cell,.datagrid-cell-group,.datagrid-header-rownumber,.datagrid-cell-rownumber,.datagrid-header .datagrid-cell span';
      selector = $.map(selector.split(','), function(se){
        return '#'+id+' '+se;
      }).join(',');
      var ss = ['<style type="text/css" dgstyle="true">'];
      ss.push(selector+'{');
      for(var key in style){
        var value = style[key];
        key = key.replace(/([A-Z])/,"-$1").toLowerCase();
        ss.push(key+':'+value+';');
      }
      ss.push('}');
      ss.push('</style>');
      $(ss.join('\n')).appendTo(cc);
      cc.children('style[dgstyle]:not(:last)').remove();
    })
  }
})

Usage example:

Code:

$('#dg').datagrid('setStyles', {
  fontSize: '12px'
});

[korenanzo]

thanks stworthy

this code anyway does not afect   the size of the rows:

if I set the fontsize smaller, the row height remains the same;

I have noticed that in easyui.css there is

.datagrid-row {
  height: 25px;
}

How to change it accordingly with the new font size?



thanks,

RIc

[stworthy]

Please look at this example http://code.reloado.com/asifoq4/2/edit#preview. The font size and row height can be modified at runtime.

[korenanzo]

thanks!