Button with onClick handler raises exception

Development Plugins
1

If I do create a button in dialog with onClick handler specified, it raises an exception "object cannot be cloned" inside setButtons. No idea how the handler must look like! A simple handler with ()=>console.info("Test"); suffices to throw. Can anyone help?

2

any code you can share?

3 
	this.handle = await joplin.views.dialogs.create(this.id);
		
	const func = function() { console.info('Clicked!')};
	const start = { id: 'start', title: 'Start', onClick: () => console.info('Clicked!'); };
	const cancel = { id: 'cancel', title: 'Cancel' };
	await joplin.views.dialogs.setButtons(this.handle, [start, cancel]);

I tried different variants, but nothing worked.

4

It doesn't look like onClick support has ever been implemented. Couldn't you just read the id of the clicked button as is done in the demo?

5

If I invoke the dialog without handler, it will start. After pressing a button the dialog returns and the dialog result indicates the id of the button.
In the meantime I tested a click handler in its simpelst form: console.info('Test'). And this version did not crash. But after clicking the button, after printing the info, the dialog was closed which I would not expect.
But perhaps the invokation of the statement was immediately during setButtons. I'm not very familiar with Javascript.

I believe I understood what you meant with: read the id. But this disturbes my plan: I would like to display the dialog during the import action and display status information. I don't know how this could be done without an initiating button handler.

6

These buttons will always close the dialog as this is how a modal dialog works.

If you need something to happen within the dialog as a result of clicking a button, you need to put that button within the webview, and handle the click yourself. The demo shows how to display a form within the dialog.

7

I familiarized myself with the idea of implementing functionality in javascript injected into the webview. I got such a script basically to work. But there is one more challenge: I must have access to the joplin API. Is there a way to access the Joplin API as object model from webview? Then I can access my own code via command invokation.

Any help is really appreciated!

8

When you create the dialog you have access the api so you can pass the necessary info to the view at that time. For anything more complex, it's best describe specifically what you want to do.

9

Let me explain how I can imagine the Qnap Notes importer:

  • After seleting the archive a dialog pops up
  • It displays a message what the importer will do
  • After pressing an initiating button the import will begin
  • The import issues progress messages which will be displayed in the dialog
  • After being finished the user can close the dialog and the process is finished

I do not know if this scenario is really possible, but that's how I would like to implement it.