Primary Navigation
Embedding Java
I'm trying to implement the script below onto our Contact Us page. However, when I click on the link to email the person, a new window opens and says "object". This code works on it's source page - the only things I've changed are the variables - site, subject, email prefix and name to be clicked on. I know typically Java scripts should be entered into the header of the page, but I'm not sure how to do that in the Igloo environment. Any advice is appreciated. Thanks!
<script language="javascript" type="text/javascript">
<!--//
var to, sbj, site="hopespring.ca", subject="Inquiry from HopeSpringWeb site";
function email(to) {
window.location="mailto:"+to+'@'+site+"?subject="+subject;
}
//-->
</script>
<a href="javascript:email('carrie');">Carrie Nixon Elg</a>
- 548 views
- $obj.VersionIndex versions
- 7 comments
- 2 followers
- Post Date:
- February 22, 2010
- Posted By:
- Carrie Elg
About this forum
- 1,288 views
- 5 topics
- 2 followers
Edit community pages quickly, easily and reliably with an advanced What-You-See-Is-What-You-Get(WYSIWYG) editor. Authorized members can edit pages from right within your browser. No downloading. No moving and uploading files. No technical knowledge required.
Page Options
7 Replies
Hi Carrie,
As of our last release, we have been filtering out "unsafe" JavaScript - in this case the href="javascript:email('carrie');" would be converted to unsafe.href="javascript:email('carrie');" (which is why the script will not run). Any script in the actual element's tag will have the same consequence (i.e. changing it to onclick="email('carrie');return false;" would not help either.)
You will have to add an event listener to the anchor element. To do this, you can utilize the addEvent function of MooTools (the JavaScript framework IGLOO uses). As a quick example, you could do something like this:
<a href="carrie" class="dyn-email">Carrie Nixon Elg</a>
<script type="text/javascript">// <![CDATA[
//
var to, sbj, site="hopespring.ca", subject="Inquiry from HopeSpringWeb site";
function email(to) {
window.location="mailto:"+to+'@'+site+"?subject="+subject;
}
$$('.dyn-email').each(function(element){
element.addEvent('click', function(e){
e.stop(); //Stop the click event from bubbling
email(this.get('href'));
});
});
// ]]></script>
So, the script will do the following:
- Find every element that has a class of "dyn-email"
- For each element found, add an event listener that fires on the click event
- When the click event occurs, call the email function, and use the element's HREF attribute as the parameter
- Stop the link from changing the URL.
Some notes:
- The script will have to be below all the email links
- Each email link will need 'dyn-emai' as the class name
- The href of the email link should be the first part of the person's email address
Hope this will help!
Hello,
Thank you for the support. For some reason this still isn't working. When posted into one of the original "folder" pages it causes the link to go to "http://www.hopespring.ca/library/carrie" instead of opening a new email. I also tried in one of the "new" style pages and the code keeps being auto-edited to this:
<a class="WikiLinkType3 dyn-email" href="/carrie">Carrie Nixon Elg</a>
<script type="text/javascript">// <![CDATA[
//
var to, sbj, site="hopespring.ca", subject="Inquiry from HopeSpringWeb site";
function email(to) {
window.location="mailto:"+to+'@'+site+"?subject="+subject;
}
$$('.dyn-email').each(function(element){
element.addEvent('click', function(e){
e.stop(); //Stop the click event from bubbling
email(this.get('href'));
});
});
// ]]></script>
Which results in the mailto link working and causing Outlook to launch a new email window, but the email address has a "/" in front of it, which I can't get rid of and I wouldn't assume our visitors would notice it to remove it manually.
Any thoughts on this? Thanks again!
Carrie,
This is probably bad form, and perhaps the Webmaster has some better code, but a quick workaround would be to use the "id" tag when calling the email function. (As I don't know how to prevent that backslash from inserting when using the href tag). Note, this would need to go into the new widget style pages.
Change the link to
<a id="carrie" class="WikiLinkType3 dyn-email" href="/carrie">Carrie Nixon Elg</a>
Change the function call line to
email(this.get('id'));
Webmaster, found this thread as I was looking for javascript samples on form processing....didn't find any. Could you post here or another thread a basic form with js that is not 'unsafe' for use on Igloo? thanks
Larry - Thank you! Your fix seems to work on the new pages but not on the old folder "folder" pages - it still causes the link to go to "http://www.hopespring.ca/library/carrie". Webmaster, if you have any further insights they would be greatly appreciated.
I will redo our contact page if necessary, however, I'd prefer not to if I don't have to!
Thanks for the help.
Hey,
Larry - thanks for the help, yes, putting the ID would be better practice.
Carrie - could you post a link to where this is happening on the old folder pages? I can take a look to see why this is happening
I'm attempting to change the links on my organization's "Contact Us" page: http://www.hopespring.ca/aboutus/BoardStaff
I have not yet embedded the code and saved it since it's not working. If you need me to do so, I can.
Thank you both.
I copied the code from that page, and tried to update it with the new code (in a sandbox community folder), and it was working fine for me. The only things to keep in mind:
- Links need to have "dyn-email" as the class
- id is the username of email
- script should only be on the page once, at the bottom of the content
If you are doing all of the above, could you send an email to support@igloosoftware.com (subject: "Embedding Java"), and attach the HTML that is failing for you? We'll take a look and see what is causing this to fail
Would you like to comment?
You must be a member. Sign In if you are already a member.