Aspose.Cells GridJs for .NET - Set Control Widht and Height

I am having trouble with the GridJS control for .NET. I can’t find information on how to set the width and height of the x_spreadsheet control so that it fits, for example, the container in which it is located. I want to place it in a div that has, for example, 50% of the width and 50% of the height of the page. How can I make it properly fit and resize with the browser window? Currently, the x_spreadsheet control adjusts to 100% of the width and height of the window. This changes dynamically upon resizing the browser window. The other option I found is to set a fixed width and height, such as 500 x 500 px.

xs = x_spreadsheet(id, options)
    // the parameters are:
    id:the html node id ,for example :'#gridjs-demo' for the html  <div id="gridjs-demo"></div>
    options:the load options,
     // the parameters for options:
	    updateMode:  currently we only support 'server'
	    updateUrl:  set the server side  url for update action based on json
		view: set the view size for the sheet,for example `{width: () => 1000, height: ()=> 500}`
	    mode: read means readonly spread sheet/edit means we can edit the spread sheet
            allowSelectTextInTextBoxInReadMode: whether allow select text in TextBox control when in read mode,the default value is false
	    showToolbar:   means whether to show toolbar
	    showFileName:  whether to show the filename 
	    local:         support multiple language for menus ,the locale can be:
	                        en, cn, es, pt, de, ru, nl, 
	                   for  English,Chinese,Spanish,Portuguese,German,Russian,Dutch
			        ar, fr,id,it,ja
                           for  Arabic,French,Indonesian,Italian,Japanese
                           for  Korean,Thai,Turkey,Vietnamese,Traditional Chinese                  
	    showContextmenu:   means whether to show contextmenu on right click on a cell
            loadingGif:  the loading gif url when loading the image/shape .it is optional,the default value is:content/img/updating.gif
	for example the below code init a x_spreadsheet object.
	xs = x_spreadsheet('#gridjs-demo', {
			mode: 'edit',
			showToolbar: true,
                        local: 'en',
			showContextmenu: true


We will evaluate on how to set the width and height of the GridJS control for .NET in the container accordingly. We have opened the following new ticket(s) in our internal issue tracking system and will deliver their fixes or sample code according to the terms mentioned in Free Support Policies.

Issue ID(s): CELLSGRIDJS-1157

Once we have an update on it, we will let you know here.

Please try the code provided below as an example:

//get width of page
 let   pwidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
//get height of page
 let   pheight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
 const option = {
     updateMode: 'server',
     updateUrl: '/GridJs2/UpdateCell',
     showToolbar: true,
     view: { width: () => pwidth / 2, height: () => pheight/2 },
      local: 'en',
 loadWithOption(jsondata, option);

You can always find the latest sample project at
Aspose.Cells-for-.NET/Examples_GridJs at master · aspose-cells/Aspose.Cells-for-.NET · GitHub
We also provide the dockerfile for your reference.