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

Applying borders to cell ranges

I viewed https://help.syncfusion.com/aspnet-core/spreadsheet/formatting and am referring to this section:

You can apply border for a cell or range of cells through following ways,

1) Use format method to apply border via code

This is in Core and the issue I'm having is when I follow the example way to style using "format" the styling doesn't display. I'm just trying to put a border around a range of cells. On my cshtml page lines such as this work for applying other styling: xlFormat.format({ "style": { "font-weight": "bold" } }, "A1:AA2");. However, if I try borders it doesn't apply so I'm guessing I'm misunderstanding what is meant on that formatting documentation page when it says "Use format method to apply border via code".

In code format this was my interpretation of that sentence based on there being no example of applying borders on that page for whatever reason:            

                xlFormat.format({ "style": { "border": "2px solid black" } }, "A1:AA2");

1 Reply

SI Silambarasan I Syncfusion Team July 10, 2017 09:25 AM UTC

Hi Jacob, 
Thank you for using Syncfusion products. 
We have checked the reported query, and we would like to let you know that your requirement for applying border using ‘format()’ method can be achievable by passing (top, left, bottom, right & isGridBorder) property values in ‘border’ object based on your border type. In the provided code example, you have to define like the below codes to works it instead of defining single CSS property. 
//Color should be defined as hex code value. 
//Thick box border 
xlFormat.format({ "style": { "border": { top: "2px solid #000000", left: "2px solid #000000", bottom: "2px solid #000000", right: "2px solid #000000" } } }, "A1:AA2"); 
//All border 
xlFormat.format({ "style": { "border": { top: "1px solid #000000", left: "1px solid #000000", bottom: "1px solid #000000", right: "1px solid #000000", isGridBorder: true } } }, "A1:AA2"); 
We have further improved the way of applying borders by the ‘setBorder()’ method to simplify the parameters based on type, style & color properties. The above highlighted functionality can be simplified by using setBorder() method as like below, 
//Thick box border 
this.setBorder({ type: "thickbox", color: "#000000", style: "solid" }, "A1:AA2"); 
//All border 
this.setBorder({ type: "allborder", color: "#000000", style: "solid" }, "A1:AA2"); 
So, we suggest you to use the ‘setBorder() instead of using ‘format()’ to apply borders in Spreadsheet. Please refer the below help documentation link and border & wrap text sample link. 
Please check the above information and get back to us if you need further assistance. 

Live Chat Icon For mobile
Up arrow icon