AnsweredAssumed Answered

How to use <iframe> tag for simple variable parsing. Error on button press.

Question asked by Russell Dines on Aug 9, 2018
Latest reply on Aug 9, 2018 by Russell Dines

Hello,

I'm trying to create a page in Canvas where students can go to to fill out information regards applying for an extension to their assignments.

I'd like to embed some Office 365 forms (simple enough) and create a small button to click to open up their email client (mailto:email address) to allow them to attach supporting files as well as create a subject with their name and/or student id.

 

I've used the <iframe> tag to display a small html file I've added to the course files.

The idea being they are presented with a html form to fill in their name, then, they click the button.

The script takes the field data and adds that to the email subject.

 

All is well and good. However when you click the button and the client loads (all good), the canvas page now displays a canvas error page in the iframe window in non-english. Any ideas why?

I sourced the url for the html page by right-clicking the file and choosing 'Copy link address'. Using Chrome.

I've noticed that canvas auto corrected to add download and an api call. However, I don't need to download the html document.

 

My knowledge of JavaScript is very slim. I've stitched this code together from searching the web.

Any help would be great.

Kind regards,

Russ.

 

************Code*************

<!DOCTYPE html>
<html>
<head>
<script>
function validateForm() {
var x = document.forms["myForm"]["fname"].value;
if (x == "") {
;
return false;
}
else {
var str1 = 'mailto:example@example.ac.uk?subject='
var str2 = x
var str3 = str1.concat(str2)
window.open(str3);
}
}
</script>
</head>
<body>

<form name="myForm"
="return validateForm()"
method="post">

Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>

</body>
</html>

The error page i get is as follows:

Before

After

Outcomes