How to use function inside Javascript file using NodeJS - javascript

I start to develop a website using NodeJS and Express.
This website is about a Cinema and I have to develop a form which allows users to add a movie in database with informations like a list of actors.
I write a simple JS script to add an input to enter a new actor and I call this function addActor() in a script called dynamic.js. Here is my code :
console.log("Launching dynamic.js !")
function addActor(){
var txtNewInputBox = document.createElement('div');
txtNewInputBox.innerHTML = "<input type='text' id='newInputBox'>";
document.getElementById("actorsList").appendChild(txtNewInputBox);
}
Dynamic.js is stored in js repository so inside my app.js file I add the line :
app.use("/js", express.static("js"));
Of course I add this line in my file and I also add the button :
<script type="text/javascript" src="/js/dynamic.js"></script>
//.... some code ....//
<input type="button" name="addActor" value="ajouter" onclick="addActor()">
Here is the problem, when I click on the button, it returns "TypeError: addActor is not a function" but it prints "Launching dynamic.js !" so I don't know how to use my function addActor(). (If I called directly my function in web console it works so I don't understand)
If you have a solution, I will be glad to hear it ! Thanks ;)

Finally I find the problem. It's because I called my button "addActor" so it didn't distinguished my JS function and my HTML button.
<input type="button" name="addActor" value="ajouter" onclick="addActor()">
name="addActor" was the problem, now it works ! Thanks for helping ;)

Related

Cannot call a server-side function located inside a library from client-side code

I tried the simplest way of calling Google Apps Script server-side function from my html using the sample code given here https://developers.google.com/apps-script/guides/html/reference/run. It works like a charm.
However, when I try to do the same thing in my actual project which has all the server code in a library, it doesn't work. I keep getting the error
"Uncaught TypeError: google.script.run.doSomething is not a function"
Here is a sample project that I created to recreate the issue
The Gdoc
Here look for "Test Menu" and click on "open sidebar" to invoke the functionality. Access the bound script to see the code and the usage of Library.
Library code
Any help with this would be much appreciated.
Example:
html:
<script>
function doSomething() {
google.script.run
.withSuccessHandler(function(msg){
window.alert(msg);//Thank's I got it.
})
.doSomething();
}
</script>
<body>
<input type="button" value="Do Something" onClick="doSomething();" />
</body>
gs:
function doSomething() {
return 'Thanks I got it';
}
You are trying to call DocumentApp.getUi() from the library.
As you can see here
A script can only interact with the UI for the current instance of an
open document, and only if the script is bound to the document.
Your library is not bound to your document. This is why your code cannot work.
You can only move those parts of your code into a library that do no use getUi() or any Not-shared resources (e.g. triggers). The documentation specifies which resources are shared and which ones are not.

How do i change the Action attribute in a form field? HTML

Im currently working on a web application, where i need to be able to take a picture in a browser using a mobile device.
I'am currently able to upload this picture to my storage on googlecloud, but i am having some troubles with the URL of said picture. The URL of the picture is defined in an action(HTML attribute). And im struggling to see how this action field can be dynamic.
It seems i cant put in the variable name for my URL in the action field.
Is there any other way to do this?
Im sorry in advance for my bad english.
<form id="BilleddeUpload" action="url" method="POST" enctype="multipart/form-data">
<input type="file" accept="/*" name="file">
<button>Submit</button>
</form>
<script>
function gogogoogle(){
var billedenavn = document.getElementById("BilledeUpload");
var url = "https://storage.googleapis.com/notgonnaputreallinkhere/"
+ prompt("Insert picture name here.");
billedenavn.action=url;
}
</script>
<p>Billede på google cloud </p>
<button onclick="gogogoogle()">
Hvad skal den hedde????
</button>
You already have defined a variable to hold a reference to the form billedenavn.
This line
var billedenavn = document.getElementById("BilledeUpload")
and a few lines later you wrote
document.getElementById("BilledeUpload").action = url;
which contains a typo in the form ID. But why not directly write:
billedenavn.action = url;
their is some syntax error.
put function [and it's body] into script tag,
and change form id from BilleddeUpload to BilledeUpload.

How to call function in another page?

I created a link https://www.sefaz.rs.gov.br/NFE/NFE-CCC.aspx?ErrKey=true&iCodUf=0&lCnpj=00110612000137 To fill the input field CNPJ.
This is fine. However, I need to run the function preencheParametros('CNPJ') together above link.
So, I tried something like this https://www.sefaz.rs.gov.br/NFE/NFE-CCC.aspx?ErrKey=true&iCodUf=0&lCnpj=00110612000137&exec=preencheParametros('CNPJ')
And not worked. How handle this?
First Way: Not Worked
GET method
<form method="post" action="https://www.sefaz.rs.gov.br/NFE/NFE-CCC.aspx?ErrKey=true&iCodUf=0" name="nForm" id="nForm">
<div class="CInput" id="CCnpj">
<input type="text" name="lCnpj" id="lCnpj" value="00110612000137">
</div>
</form>
Result: open new tab, like https://www.sefaz.rs.gov.br/NFE/NFE-CCC.aspx?ErrKey=true&iCodUf=0&lCnpj=00110612000137
Second Way: Not Worked
Read GET method in JS
Input values:
<input type="text" name="lCnpj" id="lCnpj" value="00110612000137">
<input type="button" value="Get Input Values" id="retrieveInputValuesButton" />
<script>
var cnpj = document.getElementById("lCnpj");
var element = document.getElementById("retrieveInputValuesButton");
element.onclick = function() {
window.open("https://www.sefaz.rs.gov.br/NFE/NFE-CCC.aspx?ErrKey=true&iCodUf=0" + cnpj.value + "&exec=preencheParametros('CNPJ')");
};
</script>
Result: open new tab, like https://www.sefaz.rs.gov.br/NFE/NFE-CCC.aspx?ErrKey=true&iCodUf=0&lCnpj=00110612000137&exec=preencheParametros('CNPJ')
I'm sorry, but there is no way to pass in executable instructions to a website like that (unless they specifically provide you a way to do so). That would be a huge security risk if anyone could just inject code.
You could however try cooking something up with a Greasemonkey script.
It's called Greasemonkey for Firefox, or Tapermonkey for Chrome

Using variables from an HTML file with an external JS file

I am using Google Scripts to make a web-app that creates a spreadsheet based on data entered on the page.
Here's some example code:
page.html
<form id="form1">
Time 1:<br>
<input type="number" id="time1" name="time1"/>
</form>
<script>
var num = document.getElementById("time1").value;
google.script.run.test(num);
</script>
Code.gs
function test(thing) {
return thing;
}
This would return undefined if I were to set an HTML element equal to the test function. How can I use the num variable from the HTML file with methods inside of my Code.gs file? I've looked through the Google APIs but there wasn't a solution that popped out at me, and I tried a couple things mentioned here on StackOverflow that didn't do the trick.
Thanks in advance.
You have to include the script in your document by linking it. Set the src attribute to the file path.

Yahoo Merchant Store Catalog Tags Insert Dynamically with Javascript, Jquery, or Ajax

I opened up a yahoo store through their Merchant Service. They have a pretty good store catalog that I have used on a business site that I own. I like it so I decided to use the service again on another business I own. I got the site built but have ran into a few issues with calling the Yahoo Catalog Tags. The tags are basically comments. EX: (<!--#ystore_order id=item_id -->). When the site is loaded it is parsed and the page loads the product details in place of this tag/comment.
I can get everything to work except for the action attribute of my form.
I have tried a bunch of things but I cannot seem to get the action set for my form. If I hard code the tag then it works fine but obviously if I did that then I would have to create a page for every single product.
My form:
<div id="list">
<form method="post">
<input id="btnSubmit" type="submit" value="Add To Cart">
</form>
</div>
Trying to add the comment/tag to form action attribute. I've done it this way(below) and also by getting rid of the variable and just paring the url in the jquery attr function.
<script language="javascript">
$.ajaxSetup({cache: false});
$(document).ready(function(){
//Get URL from URL Query String.
var obj = getUrlVars()["Object"];
//Set form action attribute
$('form').attr('action', '<!--#ystore_order id='+ obj +' -->');
});
</script>
I've also tried creating the form dynamically.
<script language="javascript">
$.ajaxSetup({cache: false});
$(document).ready(function(){
//Get URL from URL Query String.
var obj = getUrlVars()["Object"];
var new_form = '<form method="post" action="<!--#ystore_order id='+obj + ' -->">' +
'<input type="submit" value="Add To Cart" id="btnSubmit">' +
'</form>';
$('#list').append(new_form);
});
</script>
I have tried to escape some characters but have had no success there either.
"\<\!--#ystore_order id='+obj + ' --\>"
I know the issue has something to do with the comment syntax but if I can add it manually then I should be able to do it dynamically. I know this is a hard one to test but if anyone thinks they may have a solution I would be happy to set up an ftp account on my site so you can test and I will provide the product ID's for testing. I've fought with this for about 30+ hours.
Yahoo store tags are populated server-side. Adding a store tag on the client side using Javascript won't do anything, because the code that recognizes the store tag and appends the appropriate html will never see the tag you drop in on the client side. There's no client-side solution possible
The best solution here would be to write a server side program to populate a template with the appropriate tag in response to http requests. I'm not super-familiar with the Yahoo store, so I don't know what the best language for this would be, but it would be a very simple program given how straightforward it sounds like your template is. Since this is already embedded in a site you own, I'd just use whatever backend language you are already working in.
Once you have a server side script that executes and returns the html you need, you could use AJAX to populated it with the appropriate product details as needed.

Categories

Resources