How to Insert a Table into a DOCX File in JavaScript

Cloudmersive
3 min readAug 13, 2021

--

If you need to add a table to an online Word document, it can be a bit difficult to achieve programmatically. However, by utilizing the following API in JavaScript, you can automatically insert your table into the existing document. You will be able to specify the formatting when you enter the input request, such as cell shading color, fill, and pattern.

To kick things off, you can run this command to install jQuery:

bower install jquery

Now you’re ready to input the editing URL that was generated using the Begin Editing function (see earlier article from this week) and your API key into the below code to call the function:

var settings = {
"url": "https://api.cloudmersive.com/convert/edit/docx/insert-table",
"method": "POST",
"timeout": 0,
"headers": {
"Content-Type": "application/x-www-form-urlencoded",
"Apikey": "YOUR-API-KEY-HERE"
},
"data": {
"InputFileBytes": "<byte>",
"InputFileUrl": "<string>",
"TableID": "aliqua id laboris et dolore",
"Path": "nulla dolore",
"Width": "sunt id ullamco",
"WidthType": "ea commodo aliquip anim",
"TableRows": "[{\"RowIndex\":50543878,\"Path\":\"Excepteur ea sit\",\"RowCells\":[{\"CellIndex\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Path\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Paragraphs\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingColor\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingFill\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingPattern\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidthMode\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidth\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"}},{\"CellIndex\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Path\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Paragraphs\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingColor\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingFill\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingPattern\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidthMode\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidth\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"}}]},{\"RowIndex\":-83348255,\"Path\":\"officia tempor voluptate eu\",\"RowCells\":[{\"CellIndex\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Path\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Paragraphs\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingColor\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingFill\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingPattern\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidthMode\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidth\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"}},{\"CellIndex\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Path\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"Paragraphs\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingColor\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingFill\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellShadingPattern\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidthMode\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"},\"CellWidth\":{\"value\":\"<Error: Too many levels of nesting to fake this schema>\"}}]}]",
"TopBorderType": "ex",
"TopBorderSize": "-52157537",
"TopBorderSpace": "1293784",
"TopBorderColor": "ipsum Lorem",
"BottomBorderType": "cillum",
"BottomBorderSize": "-80364164",
"BottomBorderSpace": "20027988",
"BottomBorderColor": "eu dolor veniam culpa",
"LeftBorderType": "aliquip ipsum s",
"LeftBorderSize": "-45742306",
"LeftBorderSpace": "60546058",
"LeftBorderColor": "id enim voluptate nostrud in",
"RightBorderType": "voluptate Excepteur elit labore",
"RightBorderSize": "89079035",
"RightBorderSpace": "-97804385",
"RightBorderColor": "non Excepteur Lorem sunt labore",
"CellHorizontalBorderType": "nisi nostrud proident",
"CellHorizontalBorderSize": "8803442",
"CellHorizontalBorderSpace": "2988293",
"CellHorizontalBorderColor": "qui amet exercitation",
"CellVerticalBorderType": "in proident",
"CellVerticalBorderSize": "-83125930",
"CellVerticalBorderSpace": "54945439",
"CellVerticalBorderColor": "ipsum amet",
"StartBorderType": "consequat tempor non",
"StartBorderSize": "27679945",
"StartBorderSpace": "86213006",
"StartBorderColor": "consequat nostrud sit",
"EndBorderType": "magna anim Ut ut",
"EndBorderSize": "-17376836",
"EndBorderSpace": "-62097364",
"EndBorderColor": "proident",
"TableIndentationMode": "ea irure cillum nisi qui",
"TableIndentationWidth": "86057474",
"InsertPlacement": "<string>",
"InsertPath": "<string>"
}
};
$.ajax(settings).done(function (response) {
console.log(response);
});

This will simplify the editing of your document, and if you have no more changes, you can call the Finish Editing function to close out the process and download your document. To retrieve your API key, visit the Cloudmersive website and register for a free account; this provides 800 calls/month across any of our APIs.

--

--

Cloudmersive
Cloudmersive

Written by Cloudmersive

There’s an API for that. Cloudmersive is a leader in Highly Scalable Cloud APIs.

No responses yet