Applying borders to cell ranges

[Jacob Knight]

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");

[Silambarasan I]

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. 

 

Border online sample: http://mvc.syncfusion.com/demos/web/spreadsheet/borderwraptext 

SetBorder API: https://help.syncfusion.com/api/js/ejspreadsheet#methods:setborder 

 

Please check the above information and get back to us if you need further assistance. 

 

Regards, 

Silambarasan