Link form fields response in sql database to Html - javascript

How do I link form field (like every time someone fills a form I get an update on the homepage, where it says number of reported cases, by different categories) to update on an html element. Probably from an sql database. I’m coding in HTML, CSS, JS.
Also, Please if you know any video that explain more anywhere, kindly link to it in your response.

Related

Prepopulate a Google Form using ID without using emails

Here's my situation. I have a long list of students (each student with an ID); and each student have their own preferences on food, and games, ... (all of these data are stored on a Google Spreadsheet). I'd like to confirm all the students that the info are all correct.
I can do this by sending each student with a prefilled-link a Google Form, then after they edit, and hit submit, I'll scan and update the spreadsheet, and resend them the new link with pre-filled information that they've just editted.
However, I find it to be a little bit 'messy' (? I'm not exactly sure if this is the right word, as they have to check their emails, click on the link, and when they need to modify their data yet again, they have to find the newest email sent by me, and click on the new link).
I wonder if this can be solved just by using only Google Form (or maybe by embedding a Google Form inside another page?)? I'm thinking off creating 2 Google Forms:
One form for the students to enter their ID, and when they hit submit they'll be taken to the second Google Form with their newest info (fetched from the spreadsheet) pre-filled for them.
The second form is the form filled with their previously-entered information.
Since Google App Script will not allowed me to redirect the users to some other website (including, other Google Forms?) upon form submission, so I'm thinking of embedding the ID Google Form into my site on Google Site.
Here's my pretty bad embedding:
<!-- Normal form embed code, add an ID -->
<iframe id="gform" src="https://docs.google.com/forms/d/e/MyFirstFormURL/viewform?embedded=true" width="640" height="700" frameborder="0" marginheight="0" marginwidth="0" style="margin:0 auto; max-width:100%;">Loading…</iframe>
<script type="text/javascript">
var load = 0;
document.getElementById('gform').onload = function(){
/*Execute on every reload on iFrame*/
load++;
if(load == 2){
/*Second reload is a submit*/
document.location = "https://docs.google.com/forms/d/e/MySecondFormURL/viewform?embedded=true";
}
}
</script>
But I run into 2 problems (or maybe 3 problems):
I use onload event for the iframe to check whether the form has already been submitted; which is bad, since it will still direct me to the second page even when I hit "Clear Form".
I cannot read the ID the student provided inside the Google Form embedded in iframe. :(
Even if I can somehow read the ID in my Google Form, I have no way to externally perform a search on my spreadsheet to get the desired pre-filled link (it must be done by GAS back-end, right?)
I have some basic knowledge in programming (like a tad C, and C++; but I have very little (next to nothing) experience when it comes to web-development), I just list out everything that I have thought about, and worked on in this post. :(
Can someone give me a push? :(
Thank you so much in advance, :*
There's a variety of ways this can be done, but here's what I would use. The major advantage of this approach is that it wouldn't require any app script coding.
Rather than email a direct link to a form, I would send the students a link to a webpage that is actually a google spreadsheet (example here --Feel free to submit test data on the form).
Make sure to link the form's responses to appear in the same spreadsheet and then use an index and Counta function (see below) to get the respective latest answers to appears as I did in cells b3 and c3 in screenshot below. These latest answers can be embedded in the link to the form shown in cell A3 which ensures that the spreadsheet will always have a link to the latest submission.
Note if you want to give your students a link to the actual spreadsheet, that would be a little less browser compatible but offers instant updates to the updated form link, whereas a webpage refreshes every 5 minutes.
Good luck.

How to access an input field and write text to it inside an iframe?

I need some guidance from you. I am trying to automate a process with WinAutomation software and i need to open a web page and just insert login name, password and press log in. All seemed very easy but i got stuck because i first time encountered iframe. The login is in an iframe and i cant access it. What I can do is execute javascript function. I wanted to ask is it posbile to access it using javascript and populate those fields with text? Tried googling it but every answer i find people are asking how to access it on their own page so they have more control over it than I do. I just have the webpage name and that's it. And I have minimal knowledge on javascript.
The page is: https://mit.nykredit.dk/erhverv/?kort=2
I tried just some simple code with getElementById but the ID of the input field seems to change everytime you refresh the page. I would be really grateful for any help.

How to scrape data from website when the data is only accessible by pressing a button?

I want to scrape data from a website within my java-application. The data I want to collect is inside a html-table-element. I tried two different methods:
I tried to load the website with a BufferedReader into a String and collect the data from the String.
I tried to use Jsoup to get access to the exact html-element, but it's empty.
Turns out that the table exists, but it is empty as long as the user has not pressed a button (labled "load raw data"). I inspected the sourcecode of the webpage. When the user presses the button, a load_table()-function is called which loads the data into the table. Obviously, the URL remains the same, otherwise I could've just used the other URL where the data is already loaded into the table. Has anyone an idea on how to scrape data from a website although it's only on the website if the user presses a button after the website is loaded?
I'm not really a trained Javascript-coder, but I tried to look through the script which is executed after the user presses the button. It's kind of hard to understand for me but I made a pastebin of the script with a highlighting where I think the rows are added to the table if that helps. The code for the button is:
Load raw data
The code I use to access the html element with Jsoup would be (all the child(x) methods are called on different div-elements to go deeper into the html-document until I finally reach the table-element):
Jsoup.connect(url).get().body().children().get(5).child(0).child(4).child(1).child(1);
As I stated above, the element is empty. I hope the description of my problem is detailed enough and somebody has at least an idea of what I'm trying to say. Sorry for my clumsy expressions. Not a native speaker.
if you are familiar with selenim webdriving you could use selenium to load the page and then pass to source page into beautifulSoup argument.
html = pageSource()
you could parse the page by this method i guess

Stop text being made HTML unless needed

I have the ability for a user to post some text into a message feed. They are able to type whatever they want.
The backend server detects that there are links and other linkable elements (like tagging someone else), then saves these links into a database.
When a user is served up the full list of messages, they get shown what the user has posted, and anything that was meant to be a link is turned into a link
For example someone typed www.foobar.com so the post will show <a href='www.foobar.com'>www.footbar.com</a>
This works great, however what if someone types HTML in themselves. First off it will mess with formatting, and secondly it allows users to post their own HTML which can be dangerous for obvious reasons.
I need a way of not turning the text that comes back from the API into HTML unless it was HTML that I intended. However I don't want to STOP someone trying to post HTML, just stop it turning into HTML
Twitter does it correctly. If I post this to twitter
<a href='www.foobar.com'>www.footbar.com</a>
It will show me exactly what you see there, but the www.foobar.com will be highlighted and clickable.
Although it may not be relevant, I am using a ASP.NET Web API backend and Knockout.JS for the front end
UPDATE
I am using the following code to show the text (knockout JS observables)
<div data-bind="foreach: allMessages">
<span data-bind="html: theText"></span>
Your backend code should encode the data coming in. this will change the html tags into text based.
Example is <div>test</div> changes to %3Cdiv%3Etest%3C/div%3E. this will prevent data getting into your database that you don't want.

Preview/Summary Page

New to HTML javascript programming and have an issue with implementation of my page.
I have created multipage HTML form layout(using div) which runs 4 pages with approximately 140 input values(most are optional values) all together. I need to implement a preview page before actually submit where in only filled input values along with their labels are displayed within a section of the page.I am able to collect the filled input values and the label values to an array using javascript. However the issue is, I am not able to figure out how I can pass these values to the actual in html summary page? I cannot implement .innerHTML as my labels need to be dynamically generated based on input values. Can this even be done just by javascript or HTML or do I need a server side script to implement the preview page? Does learning DHTML or AJAX help to implement a solution to this problem? I appreciate all the help. Let me know if I need to explain better.
The BEST way would be a session variable in a server-side language. If security is not an issue though, you can save the variables into a cookie though javascript.
See here.

Categories

Resources