Removing Unused Styles, JavaScript Programming Example of Removing Unused Styles in SpreadSheet

JavaScript Programming Example of Removing Unused Styles in SpreadSheet

Have a look at the coding sample of how to remove unused styles in SpreadSheet. Don't miss the chance to use free programming examples by Webix for building custom business web apps.

JS Code

function getData(){
  var data = $$("ss").serialize();
  var text = JSON.stringify({data:data.data, styles:data.styles}, null, "  ");
  $$("txt").setValue( text );
}

webix.ready(function(){

  var buttons = { 
    view:"toolbar",
    width:300, 
    rows:[
    { view:"button", value:"Serialize data", click:getData },
    { view:"button", value:"Remove unused styles", click:function(){
      $$("ss").compactStyles();
      getData();
    } },
    { view:"textarea", id:"txt" },
  ]};

  webix.ui({ 
    cols:[
      buttons,
      {
        view:"spreadsheet",
        id:"ss",
        toolbar: "full",
        data:{
          styles: [
            [ "blue", "#FFFFFF;#2244DE;" ],
            [ "red",  "#FFFFFF;#DE2244;" ]
          ],
          sizes: [
            [ 0, 2, 64 ]
          ],
          data: [
            [ 3, 2, "Webix", "blue" ],
            [ 3, 3, "SpreadSheet", "blue" ]
          ]
        },
        on:{
          onAfterLoad: getData,
          onStyleChange:getData
        }
      }
    ]
  });
});