Insert/Update/Delete rows in the current sheet for multiple tabs

[pablosolar]

Hello Paul,

The truth is that I am very interested in the functionality of multiple tabs in the same spreadsheet.

Is this functionality free ?? If not, how much does it cost? I have not found the prices for any site on the web.

Now I can insert a row in my 1-tab spreadsheet this way:

var mySpreadsheet = jexcel(document.getElementById('spreadsheet1'), {
			data: data1,
			csvFileName: 'filename',
		        csvHeaders:true,
			colHeaders: ['a', 'b'],
			columns: [{ type:'text', width:100 },
				  { type:'text', width:270 }],
			ondeleterow: functionOnDeleteRow
		});

mySpreadsheet.insertRow();

Even I can update some column value (for example, total money) if I delete/insert rows().

How would it be if I have two tabs?? How would be the way to add a row or update it for the current sheet? Could you give an example?

Thank you in advance!!

Thank you very much!

[GBonnaire]

Hi,

Each tab has an instance separate

var mySpreadsheet_Tab1 = jexcel(document.getElementById('spreadsheet1'), { /*... options ...*/});
var mySpreadsheet_Tab2 = jexcel(document.getElementById('spreadsheet1'), { /*... options ...*/});
var mySpreadsheet_Tab3 = jexcel(document.getElementById('spreadsheet1'), { /*... options ...*/});

with each instance (var) you can edit, insert or remove rows.

If you allow user create tab, you can take instance of this new tab. or use :
jexcel.current

[pablosolar]

Hello @Guillaume-Bo

Thank you for your reply. I will test it later!!

Just two more questions...

Tabs feature is free or paid?
How can I set the name of each tab? Is it possible??

Thank you in advance and kind regards!

[GBonnaire]

This feature is available on version CE (free) : https://bossanova.uk/jexcel/v4/examples/tabs

But on jexcel Pro (paid), you have more function simplify access etc. : https://jexcel.net/v7/examples/worksheets

@paulhodel will surely be able to say more on this feature.

[pablosolar]

Hello again @Guillaume-Bo,

I tried what you said but with no success:

var mySpreadsheet = jexcel(document.getElementById('spreadsheet1'), {
			data: data1,
			csvFileName: filename1,
		        csvHeaders:true,
			colHeaders: headers1,
			columns: [{ type:'text', width:100 },
				  { type:'text', width:270 },
				  { type:'text', width:350 },
				  { type:'text', width:150 },
				  { type:'text', width:150 },
				  { type:'text', width:200 },
				  { type:'text', width:100 },
				  { type:'numeric', width:100 },
			],
			ondeleterow: f1
		});
var mySpreadsheet2 = jexcel(document.getElementById('spreadsheet1'), {
			data: data1,
			csvFileName: filename1,
		        csvHeaders:true,
			colHeaders: headers1,
			columns: [{ type:'text', width:100 },
				  { type:'text', width:270 },
				  { type:'text', width:350 },
				  { type:'text', width:150 },
				  { type:'text', width:150 },
				  { type:'text', width:200 },
				  { type:'text', width:100 },
				  { type:'numeric', width:100 },
			],
			ondeleterow: f1
		});

I have created two instances as you told me, but two tables appear, one below the other, not one with the two tabs ...

I'm using:

<link rel = "stylesheet" href = "https://bossanova.uk/jexcel/v4/jexcel.css" type = "text / css" />
<link rel = "stylesheet" href = "https://bossanova.uk/jsuites/v3/jsuites.css" type = "text / css" />
<script src = "https://bossanova.uk/jexcel/v4/jexcel.js"> </script>
<script src = "https://bossanova.uk/jsuites/v3/jsuites.js"> </script>

What am I doing wrong? Thanks and best regards!

[GBonnaire]

Hi,

Sorry i give you a method for jExcel Pro.

Try this

                  var sheets = [];
                  sheets.push({
			data: data1,
			csvFileName: filename1,
		        csvHeaders:true,
			colHeaders: headers1,
			columns: [{ type:'text', width:100 },
				  { type:'text', width:270 },
				  { type:'text', width:350 },
				  { type:'text', width:150 },
				  { type:'text', width:150 },
				  { type:'text', width:200 },
				  { type:'text', width:100 },
				  { type:'numeric', width:100 },
			],
			ondeleterow: f1
		});
                sheets.push({
			data: data1,
			csvFileName: filename1,
		        csvHeaders:true,
			colHeaders: headers1,
			columns: [{ type:'text', width:100 },
				  { type:'text', width:270 },
				  { type:'text', width:350 },
				  { type:'text', width:150 },
				  { type:'text', width:150 },
				  { type:'text', width:200 },
				  { type:'text', width:100 },
				  { type:'numeric', width:100 },
			],
			ondeleterow: f1
		});
jexcel.tabs(document.getElementById('spreadsheet1'), sheets);
var mySpreadsheet1 = document.getElementById('spreadsheet1').jexcel[0];
var mySpreadsheet2 = document.getElementById('spreadsheet1').jexcel[1];

[pablosolar]

Hello @Guillaume-Bo

It worked, thank you so much!! Taking advantage, I would like to ask you one more question, if it is not a bother ...

I am trying to download the excel with the two tabs together and for this I am trying to do (based on an example from @paulhodel ):

HTML:

<form action='https://jexcel.net/api/download' method='post' id="form_data1">
<input type='hidden' id='data1' name='data1' value=''>
</form>

Js:

function downloadExcel(){
 	var spreadsheet = document.getElementById('spreadsheet1').jexcel
	var data = [];
    	for (var i = 0; i < spreadsheet.length; i++) {
        	data.push(spreadsheet[i].getConfig());
    	}

    	document.getElementById('data1').value = JSON.stringify(data);
    	$("#form_data1").submit();
}

But I downloads the file it empty. Do you have any idea what I could be doing wrong? Maybe there is another approach to download the excel?

On the other hand, is there a way to indicate the name of the file for the download?

Thank you very much for your help, its very important to me.

Kind regards and a big hug!

UPDATE:

I think this approach its only valid for JExcel pro, isn't it?? What would be the alternative solution for CE? It is the last part that I need for completing my process. (If it meets my requirements, I'll look at the Pro version later :))

[GBonnaire]

Hi,

Yes, is not for Pro, is for Pro Cloud (if I'm not mistaken)

for version CE you can download CSV of 1 sheet with this script

/**
 * Download current worksheet
 */
var download = function() {
    // Get selected tab
    var worksheet = document.getElementById('spreadsheet').children[0].querySelector('.selected').getAttribute('data-spreadsheet');
    // Download
    document.getElementById('spreadsheet').jexcel[worksheet].download();
}

with Pro

jexcel.current.download();

When plugin is activate in JExcel CE and with 1 specific plugin you can download XLS with all sheet on 1 file. Currently, i don't know plugin for JExcel Pro, maybe soon 😊

[pablosolar]

Hello again @Guillaume-Bo

Hello again,

M I got you wrong but .. there is no way to download all the tabs in 1 single file for the CE version ??

Thank you very much and kind regards!

[GBonnaire]

Hi again,

1 file in what format ? CSV or XLS ?

[pablosolar]

Hello,

Excuse the misunderstanding, I am aware that I am being a bit tiresome...

I mean 1 xlsx file for the 2 tabs for the CE version (csv only allows 1 tab). Is that possible?

Regards!!

[GBonnaire]

Don't worries,

Yes CSV is 1 sheet only 🙁

Currently no Jexcel CE can't download file in XLSX format, in version Pro, currently no too for XLSX. But in JExcel Pro, you can add a plugin for make as you want. (Soon i make this plugin : generate file XLSX with JExcel pro).

Maybe @paulhodel can help you on CE or Pro for this question.

[pablosolar]

Hello @Guillaume-Bo

Thank you very much for all your help and effort!!

I will wait for @paulhodel to see if he has any idea or help.

Thank you very much’!!

[GBonnaire]

with pleasure 😊

I think that paul will make good annoucing for you 😊

[pphod]

The following example should work for both distributions CE and PRO.
https://jsfiddle.net/paulhodel/1zf82mj6/

But, I am working on an extension to export XLS. The following example is for PRO, but that should be working in the same way for CE. I should create a few more examples soon.
https://github.com/jexcel/plugin-jexcel-to-excel-export