Print a document since a Sidebar - google-apps-script

Example is more easy to Understand.I tried to print a google document by through a side bar.
I have retrieved a script extract on the web.
My result is a printing the contents of the sidebar and not a google document printing .... oops
Can someone help me ?
<!doctype html>
<html lang="en">
<head>
<script type="text/javascript">
function initButtonImprimer() {
var bouton = document.getElementById('button-imprimer');
bouton.onclick = function(e) {
print();
return false;
}
}
</script>
</head>
<body>
...
<div>
...
<input type="button" id="button-imprimer" value="Imprimer" />
...
</div>
...
<script type="text/javascript">
initButtonImprimer();
</script>
</body>
</html>

Related

AppScript get values from spreadsheet to html

I have a list of links that I have in my spreadsheet.
I created a button. Now I select the link and I click the download button. I want it to start download right away the document from the link.
This is what I have right now:
function RDownload() {
var RConSheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("LookUp");
var LNumber = RConSheet.getRange("C2").getValue;
var RLinkID = RConSheet.getRange("J4").getValue();
var RLink= "https://drive.google.com/uc?export=download&id="+RLinkID;
return RLink;;
};
/* download RCon */
function test(){
var form = HtmlService.createHtmlOutputFromFile('DownloadR');
SpreadsheetApp.getUi().showModalDialog(form, "Downloading");
}
I don't know how to get value from RLink and put it in the html form.
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<a href='here I want to have a value from RLink' target='_blank'>Download</a>
</body>
</html>
Description
I didn't need to change your Code.gs but I've modified your HTML to include a call to the server to get RLink using google.script.run.withSuccessHandler().
HTML
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<a id="rlink" href='here I want to have a value from RLink' target='_blank'>Download</a>
<script>
(function () {
google.script.run.withSuccessHandler( function (rlink) {
alert(rlink);
document.getElementById("rlink").href = rlink;
}).RDownload();
})();
</script>
</body>
</html>
References
https://developers.google.com/apps-script/guides/html/reference/run#withSuccessHandler(Function)

Is there a way to reference sweet alert from google apps script?

I'm linking the library with the src attribute and using a function to call it and its not working
GS:
function doGet(e) {
var params = JSON.stringify(e.parameters)
var params2 =JSON.parse(params)
cache.put("name", params2.name)
cache.put("DBID", params2.DBID)
return HtmlService.createTemplateFromFile("test").evaluate()
}
function include(f1){
return HtmlService.createHtmlOutputFromFile(f1).getContent();
}
Html:
<head>
<title>Email form test</title>
<?!= include("CSS") ?>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2#8.17.6/dist/sweetalert2.all.js"></script>
<?!= include('Javascript') ?>
<button type="button" name="Submit" onclick="javascript:t1();"id="sub1"class="btn btn-white btn-animation-1">Submit</button>
Calling library (after its been initialized above):
<script>
function t1(){
Swal.fire('Any fool can use a computer');
}
</script>
the expected result should be I click the button and "any fool can use a computer" should pop up in a sweet alert 2 box
You don't need to import and evaluate the Sweetalert library within Apps Script - you can include it in your HTML file as you would normally and return the HTML Output from file on doGet():
code.gs:
function doGet(e) {
// your code here
return HtmlService.createHtmlOutputFromFile("index");
}
and index.html:
<!DOCTYPE html>
<html>
<head>
<title>Email form test</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2#8.17.6/dist/sweetalert2.all.js"></script>
<button type="button" name="Submit" onclick="t1();"id="sub1"class="btn btn-white btn-animation-1">Submit</button>
<script>
function t1(){
Swal.fire('Any fool can use a computer');
}
</script>
</body>
</html>

Browser show blank page while using reactjs

Hi I am new in reactjs when i am running server.js file from terminal it show blank page on browser. The code of index.html file is:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<script src="https://cdnjs.cloudflare.com/ajax/babel-
core/5.8.23/browser.min.js"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js">
</script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-
dom.js"></script>
</head>
<body>
<div id="app"></div>
<script type="text/babel">
ReactDOM.render(
<h1>Hello React!</h1>,
document.getElementById('app')
);
</script>
</body>
</html>
Thanks in advance.
This is a working example.
In your code, the wrong part is the CDN link to babel-core. You may always check your console when working with JS (on Google Chrome: Ctrl + shift + J on Windows, Cmd + Opt + J on IOS).
On the other hand, I thought this was a good opportunity to also introduce components (see ).
<!DOCTYPE html>
<html lang="en">
<head>
<title>My First React Example</title>
</head>
<body>
<div id="hello"></div>
<script src="https://unpkg.com/react#15.0.0/dist/react.js"></script>
<script src="https://unpkg.com/react-dom#15.0.0/dist/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.min.js"></script>
<script type="text/babel">
var Greeting = React.createClass({
render: function() {
return (
<p>Hello World</p>
)
}
});
ReactDOM.render(
<Greeting/>,
document.getElementById('hello')
);
</script>
</body>
</html>

how to reference a file inside an app script

is it possible to reference / import a file that is inside the script.
test.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons.css">
<script src="/testsrc.html"></script>
</head>
<body onLoad="onLoad()">
<div>
<p id='result'>....</p>
</div>
</body>
</html>
testsrc.html
function onLoad(){
document.getElementById("result").innerHTML = "ran";
}
You could do:
<?!= HtmlService.createHtmlOutputFromFile('testsrc').getContent() ?>
instead of
<script src="/testsrc.html"></script>
Don't forget to wrap all your js code in testsrc.html file in <script></script>
PS: better yet in your code.gs file create an include() function like this
function include(filename) {
return HtmlService.createHtmlOutputFromFile(filename).getContent();
}
then you can call it any time you need to include any file:
<?!= include('testsrc') ?>

JSON not displaying in page

I have a html page with that is to call JSON data from a js file.
The html is below:
<html>
<head>
<meta charset="UTF-8">
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script type="text/javascript" src="modules/app.js" ></script>
</script>
<title>
</title>
</head>
<body ng-app="albumsApp">
<div data-ng-controller="albumController">
<ul data-ng-repeat="album in albums">
<li>
{{albums.title}}
</li>
</ul>
</div>
</body>
</html>
The "app.js" file that it calls is below:
**
var albumsApp = angular.module ('albumsApp',[])
albumsApp.factory('albumFactory',function() {
return {
getAlbums: function(){
alert("test");
return [{"artist": "Kid 606","title:":"Happiness"}];
},
};
});
albumsApp.controller ('albumController', function ($scope,albumFactory) {
$scope.albums = albumFactory.getAlbums();
});
**
There are nor errors in the console when I run it, just nothing appears.
The alert box "test" appears when I load the page so the function is getting called, it just doesn't display the JSON. Thank you for any replies.
change this:
{{albums.title}}
to
{{album.title}}
It is OK now, thank you very much.
HTML is
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script type="text/javascript" src="modules/app.js" ></script>
</script>
<title>
</title>
</head>
<body ng-app="albumsApp">
<div data-ng-controller="albumController">
<ul data-ng-repeat="album in albums">
<li>
Artist is "{{album.artist}} " and title is {{album.title}}
</li>
</ul>
</div>
</body>
</html>
JS is
var albumsApp = angular.module ('albumsApp',[])
albumsApp.factory('albumFactory',function() {
return {
getAlbums: function(){
return [{"artist": "Kid 606","title":"Happiness"}];
},
};
});
albumsApp.controller ('albumController', function ($scope,albumFactory) {
$scope.albums = albumFactory.getAlbums();
});