How can Google App Script HtmlService Form change innerHtml of div in the page - google-apps-script

I have a form that I have created using Google App Script. And it is really good because it allows me to create a form that could be moulded in any manner and not be put down by the limitation of Google Forms. But I am now having a hard time figuring out how to run a script to manipulate the innerHTML of a div using form action when the form in submitted. Can someone help me with this or suggest a solution.

This should be standard JavaScript. The nice thing about HtmlService is that anything you can do in jQuery, you should be able to do in JavaScript. Some restrictions apply because we need to apply Caja to sandbox the JavaScript so it is safe, but this should not interfere with what you are doing.
What you want to do is this:
Attach an onClick handler to the submit button. Return false from this function so it does not do an HTTP POST/GET.
In the onClick function, use the jQuery function to find the div element you want to populate and populate it with data.
I highly recommend John Resig's jQuery tutorial if you haven't done it already.

Related

HTML form is getting hanged/Freezes when i try to do any action on screen in Angular 7

Hi my angular form is getting hanged when am try to scroll up and down and try to select drop down options, selecting items in list control. My form contains input controls which has regex patterns, controls. All these controls are in my child html form.
And if i clear cache its working fine.
Please suggest me to fix this issue.
Calling a method function from direct html can be costlier Operation which might have called your application function multiple times apart of life cycle hooks.
It's better to use always variable instead of functions if you are not using it already. Please share your code snippet or stackblitz url for better help from community

Using HTML buttons to variably point to links

I'm looking for a way to use a button on my website as a trigger for a google script. The script needs to be called with an email input:
scripts.google.com/.../exec?[email]
Using a text input field that is submitted with a button seems the simplest.
Is it possible for the button's link to change to reflect the email typed into the text field?
NEW: Is there a HTML/CSS only way to do this?
Is it possible for the button's link to change to reflect the email typed into the text field?
Yes. You could use oninput to do it live, or a lesser version of that such as onblur or onchange if it didn't need to change right as the user typed it. You could also simply go with onclick, and change it prior to submission ensuring that you return true during the click event handler.
Are there better ways to approach this?
This would just be an opinion, there are certainly many ways to approach this, however especially given the lack of code presented, this isn't really answerable without context. One route could be to use an ajax request with XMLHtppRequest. It depends on what you need to get back.
//get email
<input id="mail" type"email" placeholder="en">
//sent data
<button onclick="submit();">click to sent</button>
<script>
//get input data
var email = document.getElementById("mail").value;
//button clicked start function
function submit(){
window.location.href = "you'r url"+ "/"+ email;
}
</script>

Why does ddl 'onchange' event not appear in intellisense?

I was working out a problem with a ddl trying to get a message box to popup when the item changed. You can read about that here >>>
How to Popup Alert() from asp:DropDownList OnSelectedIndexChanged?
The working answer shows me to use the onchange event but then I'm working in VS2010 this event does not appear in the intellisense dropdown. However if I type it in anyway it works fine.
For this, you need to understand how the thing works....when you change the value of a input element, onchange event gets triggered on the browser, so the browser looks for a way to handle it. So when you put the onchange event specified for the element it gets called.
Now, ASP.NET OnSelectedIndexChanged uses the same functionality(logically saying) to POST the page to the server. From there, the ASP.NET runtime triggers the function you wrote in the codebehind file and returns you the result. Now, if you really don't require any operation that can only happen on the server, you don't need to use the server functionality, instead you can do it in javascript.
On the other hand, if you want something that happens on server: like some database get, you are supposed to use the OnSelectedIndexChanged event.
And if you use the OnSelectedIndexChanged event, you can still call some javascript functions from there.
Page.ClientScript.RegisterClientScriptBlock(typeof(string),"myScript","alert('HI')",true);
To answer your question about intellisense, onchange is a event of input types, and in aspx pages, i guess you are using <asp:..> tags, which does not have the same event - thus visual studio does not show it in the intellisense. But when you put it, it gets assigned to the HTML markups, which is interpreted correctly by the browser.
PROS and CONS
onchange works on your browser, so it is lot faster than the server-side code. On the other hand, we had an issue once that the browsers has the capability to restrict pop-ups. So if you want some really important message to be shown, it is better to use the Server-Side event and the RegisterClientScriptBlock function.
Hope it helps.

HTML: Multiple submit buttons in a form, each leading to a different python script?

How can I do this? Doesn't a form only have one action? What if I have 3 different buttons at the end of a form and each one invokes a different script? Much appreciated.
Something like this is possible, but not in pure html. You need javascript for that, because a html forms action is defined in the form tag, which accepts only a single action.
Using javascript however you can register differrent handlers for the click events of different submit buttons, thus send the forms data to different locations.

Creating "are you sure?" popup window by using html only

Assume I have a html from, and it contain some submit type. I want to create a "are you sure" popup window that will appear when user click submit button.
My question is that is there any way to create it by using "only" html, not using javascript or any other?
HTML only is possible, but not without a postback
Scenario that could work without javascript:
You have your form with submit button
User clicks (and submits) the form
You display another form with are you sure? form (that contains Yes and No buttons as well as hidden fields of the first form that will make it possible to do the action required on the original data
functionality that executes the action and goes back to whatever required.
This would be completely Javascript free, but it would require several postbacks.
This kind of thing is usually done on the client with a Javascript confirm() function (here's a simple example) or lately with a more user friendly modal dialog provided by many different client libraries or their plugins.
When to choose the script free version?
If you know your clients are going to be very basic ones (ie. vast majority of your users will access your application using clients like Opera Mini that's not able to run scripts at all). But in all other cases it's much better to do this using Javascript. It will be faster, easier to develop and much more user friendly. Not to mention that it will put less strain on your server as well since certain parts will execute on the client without the need of any server processing.
No, there isn't. Despite of the new features in HTML 5, HTML is still a markup language, not a programming language. In order to express dynamic behavior (such as an "are you sure?" box), you need to use a programming language.
Javascript would be the most obvious choice for this, but you could also do it with frameworks that can get you around writing Javascript by hand (for example ASP.NET).
Edit: Actually it appears that it would theoretically possible to do this with without Javascript or other frameworks. As I just learned, HTML 5 + CSS 3 seems to be turing complete. But this is hardly relevant to this question.
It's possible to ask for a confirmation, but it will not be in a "popup window". The creation of the "popup window" requires javascript/other language.
It will be:
Request (first form)
POST
Response (confirmation form)
POST
Response (outcome message)
You can create a form with all hidden elements containing the data from the first form and a "Yes" and "No" button below the "Are you sure?" text. You can use PHP sessions to avoid the hidden form elements. If there is a lot of data or confidential data or you do not want to re-validate the data from the second form, use sessions. Make sure you validate the data from either form before using it.
I know I'm like .. 10 years late. But for anyone still wondering I thought I could be of some help!
What I did for this exact problem was make sure I had multiple "divs" in my code. For me specifically, I had two main ones.
First, one whose id="main", and another whose id="popup" with the 'visible' property initially set to 'false' for the popup div.
Then, on whichever event you're looking for (button click for example) you'll simply set main.Visible = false and popup.Visible = true, then you could have more buttons in your popup (yes, no, cancel, confirm, etc.) which do the exact same thing, but in reverse!
The most important thing to make sure of is that you have the 'runat="server"' property in your divs so that you can access them in your CS code
Hope this was helpful! :)