open google doc in browser from web app

[Arne Ballegeer]

Hello everyone
Can someone point me in the right direction.
I have made a web app (standalone) where a google document is created by filling in text fields. Everything works.
Now I want that after filling in the fields, the google document opens in a new tab. I can do this from a spreadsheet, but with my web app I'm lost...
I can certainly share my code if needed.
In the editor I divided the files (html, js)

thks!

Arne

[Ben Ronkin]

If I understand you correctly, the client-side JS uses google.script.run to send the data to the server, where the document is created. If so, then the server can get the URL to the document, send it back to the client, and the JS will open it with window.open(). 

Ben

[Arne Ballegeer]

Hi Ben
That is indeed the case., Now, I am still in the beginning of my Javascript journey.
In my Javascript file I added a new addEventListener() to the button to create Document. See code below.
This doesn't work, seems logical to me since the document hasn't been created yet. Do I have to put some kind of time gap here?
Or am I probably not doing it right?
Thanks in advance for tips!
Below is part of the code

javascript.html

<script>

const el = document.getElementById("btn");

el.addEventListener("click", doStuff);

el.addEventListener("click", openInNewTab);

function doStuff() {

const patientInfo = {};

patientInfo.familieNaam = document.getElementById("familienaam").value;

patientInfo.voorNaam = document.getElementById("voornaam").value;

patientInfo.geboorteDatum = document.getElementById("geboortedatum").value;

patientInfo.adres = document.getElementById("adres").value;

patientInfo.telefoonNummer = document.getElementById("telefoonnummer").value;

patientInfo.dossierNummer = document.getElementById("dossiernummer").value;

patientInfo.nummerZorgtraject = document.getElementById("nummerzorgtraject").value;

patientInfo.huisarts = document.getElementById("huisarts").value;

patientInfo.verwijzer = document.getElementById("verwijzer").value;

google.script.run.maakBlauwdruk(patientInfo);

document.getElementById("familienaam").value = "";

document.getElementById("voornaam").value = "";

document.getElementById("geboortedatum").value = "";

document.getElementById("adres").value = "";

document.getElementById("telefoonnummer").value = "";

document.getElementById("dossiernummer").value = "";

document.getElementById("nummerzorgtraject").value = "";

document.getElementById("huisarts").value = "";

document.getElementById("verwijzer").value = "";

}

function openInNewTab(url) {

window.open(url, '_blank').focus();

}

</script>

Code to generate document

function maakKopieBlauwdruk(patientInfo) {

// get the sjabloon for Blauwdrukken

const sjabloonBlauwdruk = DriveApp.getFileById('id van sjabloon, vervangen');

//create a new name for the Blauwdruk

const nieuweBlauwdrukNaam = patientInfo.familieNaam.charAt(0).toUpperCase() + patientInfo.familieNaam.slice(1) + ' ' + patientInfo.voorNaam.charAt(0).toUpperCase() + patientInfo.voorNaam.slice(1);

console.log(nieuweBlauwdrukNaam);

//make a copy from sjabloon Blauwdruk

const nieuweKopieSjabloon = sjabloonBlauwdruk.makeCopy(nieuweBlauwdrukNaam);

//verkrijg de naam van de nieuwe blauwdruk voor de eerste letter

const documentNaam = nieuweKopieSjabloon.getName();

//verkrijg de eerste letter van de blauwdruk om te vergelijken met de alfabetische mappen

const eersteLetterBlauwdruk = documentNaam[0];

//get the ID of the new sjabloon copy

const nieuweKopieSjabloonID = nieuweKopieSjabloon.getId();

//open the new doc blauwdruk

const nieuweBlauwdruk = DocumentApp.openById(nieuweKopieSjabloonID);

//get URL from the document

const url = nieuweBlauwdruk.getUrl();

//get the body

const body = nieuweBlauwdruk.getBody();

//replace text

body.replaceText('{{DATUM}}', Utilities.formatDate(new Date(), "GMT+1", "dd-MM-yyyy"));

body.replaceText('{{NAAM}}', getName());

body.replaceText('{{FAMILIENAAM}}', patientInfo.familieNaam.charAt(0).toUpperCase() + patientInfo.familieNaam.slice(1));

body.replaceText('{{VOORNAAM}}', patientInfo.voorNaam.charAt(0).toUpperCase() + patientInfo.voorNaam.slice(1));

body.replaceText('{{GEBOORTEDATUM}}', patientInfo.geboorteDatum);

body.replaceText('{{ADRES}}', patientInfo.adres);

body.replaceText('{{TELEFOONNUMMER}}', patientInfo.telefoonNummer);

body.replaceText('{{DOSSIERNUMMER}}', patientInfo.dossierNummer);

body.replaceText('{{NUMMER_ZORGTRAJECT}}', patientInfo.nummerZorgtraject);

body.replaceText('{{HUISARTS}}', patientInfo.huisarts);

body.replaceText('{{VERWIJZER}}', patientInfo.verwijzer);

//save

nieuweBlauwdruk.saveAndClose();

// hoofdfolder blauwdrukken

const hoofdFolder = DriveApp.getFolderById('1llmgf_juP9hUGq33yuOqkYhPv116mgzL');

const subFolders = hoofdFolder.getFolders();

while (subFolders.hasNext()) {

const subFolder1 = subFolders.next();

while (subFolders.hasNext()) {

const subFolder2 = subFolders.next();

//verkrijg de naam van de folder

const naam = subFolder2.getName();

//bestanden ophalen

const bestanden = subFolder2.getFiles();

while (bestanden.hasNext()) {

const bestand = bestanden.next();

//eerste letter van de folder om te vergelijken met eerste letter blauwdruk

const eersteLetterFolder = naam[0];

//verkrijg de ID van de folder om nieuwe blauwdruk in de juiste folder te plaatsen

const folderID = subFolder2.getId();

//vergelijken van de eerste letter om in de juist folder te stoppen

if (eersteLetterFolder.toLowerCase() === eersteLetterBlauwdruk.toLowerCase()) {

const file = DriveApp.getFileById(nieuweKopieSjabloonID);

const folder = DriveApp.getFolderById(folderID);

file.moveTo(folder);

break;

}

}

}

}

//document openen in browser

return {

url: url,

documentNaam: documentNaam

}

}

/**

* Helper function to get the username who creates the Blauwdruk

*/

function getName() {

const userEmail = Session.getActiveUser().getEmail();

const userObject = AdminDirectory.Users.get(userEmail, { fields: 'name' });

const naamTherapeut = userObject.name.fullName;

return naamTherapeut;

console.log(naamTherapeut);

}

Op zaterdag 27 augustus 2022 om 02:28:07 UTC+2 schreef Ben Ronkin:

[Ben Ronkin]

You need to wait for the response from the server like this:

      google.script.run
        .withSuccessHandler(onSuccess)
        .withFailureHandler(onFailure)
        .maakBlauwdruk(patientInfo);

    function onSuccess(pageUrl) {

        // handle the document open here

    }

   function onFailure(err) {

       // handle the server error

   }

--
You received this message because you are subscribed to a topic in the Google Groups "Google Apps Script Community" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-apps-script-community/a40xGPqEkiY/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-apps-script-c...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/553b627f-b900-4b5e-8725-535f8438eff3n%40googlegroups.com.

[Arne Ballegeer]

Sorry, i'm lost....

Do you mean like this? I don't think so because it doesn't work.. ;)

To test, I replaced the URL with window.open('www.test.be'). Also does not work.

I've had it for today! Mix everything up

thks for the help

google.script.run

.withSuccessHandler(onSuccess)

.withFailureHandler(onFailure)

.maakBlauwdruk(patientInfo);

document.getElementById("familienaam").value = "";

document.getElementById("voornaam").value = "";

document.getElementById("geboortedatum").value = "";

document.getElementById("adres").value = "";

document.getElementById("telefoonnummer").value = "";

document.getElementById("dossiernummer").value = "";

document.getElementById("nummerzorgtraject").value = "";

document.getElementById("huisarts").value = "";

document.getElementById("verwijzer").value = "";

}

function onSuccess(pageUrl) {

// handle the document open here

window.open(url, '_blank');

}

function onFailure(err) {

// handle the server error

console.log('dit werk niet');

}

Op zaterdag 27 augustus 2022 om 15:57:10 UTC+2 schreef Ben Ronkin:

[Ben Ronkin]

Your onSuccess function accepts a pageUrl parameter, but your window.open is using a different variable (url). window.open should use the pageUrl parameter that stores the response from the server.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/7fa92749-a6e3-4507-8ca9-9c8b52f0a20cn%40googlegroups.com.

[Arne Ballegeer]

I've edited this.

function onSuccess(url) {

// handle the document open here

window.open(url, '_blank');

Now a new tab will open but with error message. See appendix.

Maybe because document was not created yet?

Op zaterdag 27 augustus 2022 om 16:51:37 UTC+2 schreef Ben Ronkin:

[Jonathan Butler]

Your url argument was null. You can see it in the screenshot inside the search bar.

You received this message because you are subscribed to the Google Groups "Google Apps Script Community" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-apps-script-c...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/33c9763d-1139-4159-88e9-0b4c41bcb2f3n%40googlegroups.com.

[Arne Ballegeer]

I know, but i log the url in the console, and thats correct..

Op zaterdag 27 augustus 2022 om 17:33:03 UTC+2 schreef butlerjon...@gmail.com:

[Jonathan Butler]

Try window.top.open(url,  '_blank' ). It gets the top most iFrame and Apps Script has a few of them nested inside of each other. 

To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/445f3106-0def-4508-b007-c4851d2f040cn%40googlegroups.com.

[Arne Ballegeer]

No, doesn't work. Not even an error tab opens

Op zaterdag 27 augustus 2022 om 17:38:46 UTC+2 schreef butlerjon...@gmail.com:

[Jonathan Butler]

Check the console. What does it say?

To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/8b29fd74-3ea1-4501-8849-ad5bf9457888n%40googlegroups.com.

[Arne Ballegeer]

see Attachment

Op zaterdag 27 augustus 2022 om 17:50:01 UTC+2 schreef butlerjon...@gmail.com:

[Jonathan Butler]

Sorry, I meant the javascript console.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/bc321a4c-1dbe-4b58-8223-bb75c79463f9n%40googlegroups.com.

[Arne Ballegeer]

Here we go, see attachment

Op zondag 28 augustus 2022 om 01:36:46 UTC+2 schreef butlerjon...@gmail.com:

[Jonathan Butler]

I'm not sure. I forgot there was an update to cross-origin that prevented the change of a page without user input. A lot of my Google Apps Script applications are single-page apps. So I don't actually change pages, I just simulate a page change using the history API and the DOM.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/c71359bd-a38b-4af0-8888-7c1c618e52f1n%40googlegroups.com.

[Arne Ballegeer]

OK. I get this all working perfectly from a google spreadsheet, but really wanted to make this a web app integrated into a google site (intranet), that way I could share it with 1 link. Still, thanks for the help!

Op dinsdag 30 augustus 2022 om 19:02:23 UTC+2 schreef butlerjon...@gmail.com: