jQuery Contact Form Issue

Status
Not open for further replies.

ziycon

New Member
I'm using a jQuery contact form on my site and there is a 'contact us' link that will popup the jQuery overlay on my site.

I've added the link also to the footer of the site, now in FF both links work fine but in IE only the first link works and the footer one doesn't.

I've also noticed that no CSS styling is being used since I added the link into the footer.

Any ideas/suggestions much appreciated.
 

louie

New Member
Can we have a link to this page / website?
 

ziycon

New Member
Its not live, its only on a local server while in development. You can view it working fine on the current site(www.ign.ie) but it only has one link to the contact form at the moment.

This is the code on the page and is used twice on the page.
Code:
<div id="contactForm"><div id='contact-form'>To contact us or report a server issue/channel creation <a href='#' class='contact'>click here</a></div></div>
Its using the 'Contact Form', source(http://www.ericmmartin.com/projects/simplemodal-demos/), second demo down.
 

php.allstar

New Member
Hi,

Can you paste the jquery function you have for triggering the popup. i.e. - $('.contact').click(function(){...
 

ziycon

New Member
Code:
$('#contact-form input.contact, #contact-form a.contact').click(function (e) {
e.preventDefault();

    $.get("contact.php", function(data){
        $(data).modal({
            closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
            position: ["15%",],
            overlayId: 'contact-overlay',
            containerId: 'contact-container',
            onOpen: contact.open,
            onShow: contact.show,
            onClose: contact.close
        });
    });
});
 

php.allstar

New Member
OK,

So in english (kind of) that listener says:

"If an input with the class 'contact' within the element with the ID of 'contact-form' is clicked"

OR

"If a link with the class 'contact' within the element with the ID of 'contact-form' is clicked"

then the overlay is shown

in both places you have added the link to open the popup thingy, did you use the exact same code?

HTML:
<div id="contactForm"><div id='contact-form'>To contact us or report a server issue/channel creation <a href='#' class='contact'>click here</a></div></div>

If so, this part of the code:

Code:
#contact-form input.contact,

is obsolete.

Can you paste the html for both instances of the link if they are not the same.

If snippets of code are the same, just check with the author of the script whether it only works in standards compliant mode as in that case, you can only elements with unique id attributes, in other words, you can't have two divs with id="contactForm" or id='contact-form'
 

ziycon

New Member
This is the second link in the footer.
Code:
<div id='footerLink'>
   <div id='contact-form'>
       <a href='index.html'>home</a>&nbsp;|&nbsp;
       <a href='#' class='contact'>contact us</a>
   </div>
</div>
 

php.allstar

New Member
Hi,

Change this line if your listener code from this...

Code:
$('#contact-form input.contact, #contact-form a.contact').click(function (e) {

...to this...

Code:
$('.contact').click(function (e) {

then try the two links and tell me what happens
 

MOH

New Member
php.allstar could be right on the compliance thing - in the non-working one you have two nested divs with the same id, the working one doesn't - just try renaming the outer one
 

ziycon

New Member
Sorry for not replying sooner, I've been up to my eyes, I'll get a chance to try it out this evening hopefully and I'll get back to you. Thanks again for the help.
 
Status
Not open for further replies.
Top