Making selection before continuing

[theremotedr]

Hi,
Ive overlooked something on my web page but not sure on how to tackle it.
Here is a page for you to inspect.
http://www.theremotedoctor.co.uk/karvolkswagen.html?scrollto=selection

How this works is as follows.
Make your item selection from the list on the right.
The photo of that item is then shown.
You then select the Click to order button.
Here is then the contact form with the part number pre-filled.

What is happening is,
Customers are just hitting Click to order button & when they see the contact form the Part number is not pre-filled as you would expect and shows Please select.
They then for some reason just select anything.

What im looking for is something that if no item selection is made & they just hit Click to order then they are unable to continue to the contact form.

[styxlawyer]

Try removing the link from line 232 of your code. The correct link will be inserted once a selection is made.

Change:


<h1><a id="btnOrder1" href="http://form.jotformeu.com/form/51272609383356" target="_self"><img src="m-images/order.png" alt="order from the remote doctor website" width="287" height="92"></a>


to



<h1><a id="btnOrder1" href="" target="_self"><img src="m-images/order.png" alt="order from the remote doctor website" width="287" height="92"></a>

[theremotedr]

Doing that just sends me back to the same page,ie it doesnt go anywhere.
I am happy with the existing code and how it works but if click to order is selected without making a selection this is where the extra code kicks in and advises the user etc.

[styxlawyer]

.
.
What im looking for is something that if no item selection is made & they just hit Click to order then they are unable to continue to the contact form.
.
.
Doing that just sends me back to the same page,ie it doesnt go anywhere.
.
.

That was exactly what you asked for in the first post. If you really meant something different then please define what action you would like.

[theremotedr]

Sorry,
My mistake, i thought that i had written another line.
What you advised is good but can we then prompt etc the user to make selection or anything that would tell them why clicking the order button does nothing.
They then would go elsewhere.

Thanks & sorry for confusion in this.

[theremotedr]

Hi,
Having said that i have just checked it again with your advice about removing the code.
If you just select order then nothing happens and you stay on the same page.
If you select an item,photo is now loaded and you now click on order you are not taken to the contact form but you stay on the same page.

See here.
http://www.theremotedoctor.co.uk/accaudi.html?scrollto=selection

[styxlawyer]

This is a different page from the link in the first post and I don't know if it worked correctly before you made the modification. Let's go back to the first page and make the change there.

Change one thing at a time and we'll get to a solution. Change too many things and we have no idea what's happening.

[styxlawyer]

Incidentally, that Audi page has a lot of HTML errors. See here (https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.theremotedoctor.co.uk%2Faccaudi.html).

There are numerous incorrectly nested <ul>...<li>...</li>...</ul> tags. For example in lines 113 - 123 you have this:



<li><a href="#">Contact Me</a>
<ul>
<li class="current">
<li><a href="mailto:theremotedr@gmail.com?subject=Mobile%20friendly%20site%20">Email Me</a></li>
<li><a id="btnOrder2" href="http://form.jotformeu.com/form/51272609383356">Form Request</a><li> <li><a href="skype_id.html?scrollto=secondary-navigation">Skype</a></li>
</ul>
</li>
<li><a href="#">Accessories</a>
<ul>
<li><a href="accaudi.html?scrollto=selection">Audi</a>
<li><a href="accbmw.html?scrollto=selection">Bmw</a></li>

[styxlawyer]

... furthermore, you have two calls to load a jQuery library.

One on line 33:



<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>


and on line 303 you load a different version:



<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.9.0.min.js">\x3C/script>')</script>


That's going to cause all sorts of difficulties. The VW page linked earlier also has the same problem (different line numbers).

[styxlawyer]

Having combed through your pages, I think the link problem might be solved by changing the following code:



var url = 'http://form.jotformeu.com/form/51272609383356?partNumber=';

function replaceMainImage(imgSrc, partNumber, myContent) {
$('#content a').get(0).search = 'partNumber=' + partNumber;
.
.


to:



var url = 'http://form.jotformeu.com/form/51272609383356?partNumber=';

function replaceMainImage(imgSrc, partNumber, myContent) {
$('#content a').get(0).search = url + partNumber;
.
.


However, with so many other errors on the pages it might not work.

[theremotedr]

Ok,
Here is the original page.
http://www.theremotedoctor.co.uk/karvolkswagen.html?scrollto=selection

Selecting click to order goes to same page,good.

Make selection from the list.
Photo is loaded.
Now selection click on order.

You stay on the same page as opposed to being taken to the contact form with the pre filled part number.

[styxlawyer]

Ok,
Here is the original page.
http://www.theremotedoctor.co.uk/karvolkswagen.html?scrollto=selection

Selecting click to order goes to same page,good.

Make selection from the list.
Photo is loaded.
Now selection click on order.

You stay on the same page as opposed to being taken to the contact form with the pre filled part number.

Good, we are back where we started and the behaviour is as you described in your first post. Now you need to do the following:

1. Edit line 232 in the VW page as I wrote in post #2 and test it.

2. Then modify the Javascript code on line 313 as I described in post #10 and test again.

If neither of those work, then we need to look further, but you will have to fix all the HTML errors first, so that we know none of them are causing the problem. You must also decide which version of jQuery you want to use and delete either line 36 or lines 297/298 so that you aren't trying to load two different jQuery libraries.