Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ General Web Design _ Prefilling title on a contact page.

Posted by: PaulPott Feb 7 2017, 05:03 PM

Hi guys was wondering if anyone could help me out, I have been googling for hours for a solution but to no avail sad.gif .

Basically I want to know how I can create a contact me link on a page that will take the user to the main contact me page of my website but fill out the title part of the form with a description of the previous page.

Any help would be greatly appreciated smile.gif

Posted by: pandy Feb 7 2017, 05:30 PM

Where should this description come from? The TITLE of the page?

Posted by: Christian J Feb 7 2017, 06:04 PM

The link URL to the contact page might contain a query string that reveals the previous page. For example, on the page "foo.html" the link URL to the contact page might be "contact.html?from=foo". Then a script on the contact page might select the description related to foo from an array of descriptions.

Posted by: PaulPott Feb 7 2017, 06:27 PM

The site is a very simple image gallery, there isn't ever going to be hundreds of images so I elected to go with a simple layout from the gallery page displaying a grid of thumbnail pictures, once one is clicked it opens up to a new page specifically about that image alone. The contact page contains no images, I don't want people having to flick back and forth between the contact form and the previous picture, I would prefare when the contact link is clicked that the info about the picture would automatically fill the title of the contact form.


Gallery.html > select thumbnail > open Image1.html > select enquire about image > Contact.html with title pre filled with name of picture.


Posted by: pandy Feb 7 2017, 06:38 PM

I was wondering WHERE that info is to start with, if it exists. You could hard code a query string per Christians directives, but if the info needed, or at least part of it, is already available on the page there may be ways to extract it so you don't need to hard code the query string.

Do you for example have <title>Name of the picture</title> you could extract the text content of TITLE with JavaSript and put it into the query string. On the contact page another script would get the name of the image out of the query sting and use it in the form. That way you can use the same script on all image pages and don't need to edit anything for each new page.

Posted by: PaulPott Feb 7 2017, 07:02 PM

QUOTE(pandy @ Feb 7 2017, 06:38 PM) *

I was wondering WHERE that info is to start with, if it exists. You could hard code a query string per Christians directives, but if the info needed, or at least part of it, is already available on the page there may be ways to extract it so you don't need to hard code the query string.

Do you for example have <title>Name of the picture</title> you could extract the text content of TITLE with JavaSript and put it into the query string. On the contact page another script would get the name of the image out of the query sting and use it in the form. That way you can use the same script on all image pages and don't need to edit anything for each new page.


That sounds like a good solution, what sort of scripts would I need to be running to pull that off?

Posted by: pandy Feb 7 2017, 07:30 PM

The first part could go something like this. Note that you must have a TITLE if you try it. You needn't use TITLE for this, but that's how the example is written.

CODE

function qString()
{
   var imgname = document.getElementsByTagName("title")[0].textContent;
   var contactURL = 'http://htmlhelp.com?img=' + imgname;
   window.location = contactURL;
}


HTML
<a href="http://htmlhelp.com" onclick="qString(); return false">Contact</a>


Exchange http://htmlhelp.com for the real URL of course. Note that you should have the URL in the href of the link so it will work for those without JS. On the contact page you need a script that grabs the image name from the query string and does what it is you want done with it.

Posted by: CharlesEF Feb 7 2017, 11:25 PM

@pandy, I took your code and rewrote it a little. This line:

CODE
var imgname = document.getElementsByTagName("title")[0].textContent;
Becomes:
CODE
var imgname = document.title;

While this line:
CODE
var contactURL = 'http://htmlhelp.com?img=' + imgname;
Becomes:
CODE
var contactURL = 'http://htmlhelp.com?img="' + imgname + '"';
The parameter should be quoted, in case it contains spaces.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)