Hi all,

I have a new form that is not responding in the Firefox browser and I can not figure out why. The code is:

        <form action="http://www.hostmonster.com/monstermail" enctype="multipart/form-data" method="post">

                <fieldset id="contact">
                    <label for="fName">First name</label>
                        <input name="fName" id="fName" required="required" />            

                    <label for="lName">Last name</label>
                        <input name="lName" id="lName" required="required" />

                    <label for="biz">Company name</label>
                        <input name="biz" id="biz" />

                    <label for="phone">Phone</label>
                        <input name="phone" id="phone" type="text" />

                    <label for="email">Contact Email</label>
                        <input name="email" id="email" type="email" required="required" />

                    <label for="message">Message</label>
                        <textarea name="notes" id="message" required="required" >
                        </textarea>  
                </fieldset>

                <p>
                    <input type="hidden" name="sendtoemail" value="mobile@badgarden.com" />
                    <input type="submit" value="Send" />
                    <input type="hidden" name="redirect" value="http://www.badgarden.com/emsuccess.htm" />
                </p>

            </form>

It seems to be working. I have the latest Firefox. It is obviously your version of firefox. Get the latest version and tell me if it works.

I have the most current version of Firefox. The only way it is working is by first clicking on the send button, which is not very user intuitive...

To make it clearer for us you could have mentioned that the problem is that the textboxes don't get focus so you can't type in them. Tabbing also works to get into the textbox by the way but it still isn't very user friendly.
The code works fine if I paste it into a test page of my own. Is there anything else on the page that would be intercepting the click events of the textboxes? Does adding tabindex="1" to the first textbox help?

Tab indexing.. it has been so long since I had built a site that I forgot about that. I do have some javascript protection scripts in place to protect content. Could they be interferring? Also, I have gotten confused by the different requirements for doctypes for HTML5 vs XHTML. Maybe poorly written code there is causing the problem?

Here is the page code in its entirety:

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

   <head>

   <!--
      Final Project
      badGarden website
      Author:   Carol Bernard
      Date: July 25, 2012
      Filename: contact.htm


   -->
        <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
    <meta http-equiv="imagetoolbar" content="no" />
    <meta name="keywords" content="badGarden, bad garden, graphic art, music, Peter Bernard, Carol Bernard, websites,logos, artist" />

    <title>Contact badGarden</title>
        <script src="modernizr-1.5.js" type="text/javascript"></script>
        <script src="protect.js" type="text/javascript"></script>
    <link href="bg_styles.css" type="text/css" rel="stylesheet" />
        <link href="contact.css" rel="stylesheet" type="text/css" />

    <script src="spam.js" type="text/javascript"></script>


    <script type="text/javascript">
        function stringReverse(textString) 
        {
            if (!textString) return '';
            var revString='';
            for (i = textString.length-1; i>=0; i--)
                revString+=textString.charAt(i)
            return revString;
        }

        function showEm(userName, emServer) 
        {
            userName = stringReverse(userName);
            emServer = stringReverse(emServer); 

            var emLink = userName + "@" + emServer;  
            document.write("<a href='mailto:" + emLink + "'>"); 
            document.write(emLink); 
            document.write("</a>"); 
        }       
    </script>


   </head>

   <body>
    <section id="main">

<!-- header -->
    <header>
        <section class="logo">
            <a href="index.htm">
                <img src="_images/logo.png" alt="badGarden" />
            </a>
        </section>
        <nav class="prNav">
            <ul>
                <li><a href="about.htm">about</a></li>
                <li><a href="music.htm">music</a></li>
                <li><a href="imagery.htm">imagery</a></li>              
                <li><a href="contact.htm">contact</a></li>
            </ul>
        </nav>
    </header>


<!-- content -->

    <section id="content">
        <section class="aside1">
            <h1>Contact Information</h1>
            <h2>badGarden</h2>
            <p>11 Manley Street</p>
            <p>Augusta, ME 04330</p>
            <p>E: <a>
            <script type="text/javascript">
                showEm("elibom","moc.nedragdab");
            </script></a></p>

            <p>T: 207-402-4621</p>
        </section>


        <section class="aside2">
            <h1>Contact badGarden</h1>
            <form action="http://www.hostmonster.com/monstermail" enctype="multipart/form-data" method="post">

                <fieldset id="contact">
                    <label for="fName">First name</label>
                        <input name="fName" id="fName" required="required" />            

                    <label for="lName">Last name</label>
                        <input name="lName" id="lName" required="required" />

                    <label for="biz">Company name</label>
                        <input name="biz" id="biz" />

                    <label for="phone">Phone</label>
                        <input name="phone" id="phone" type="text" />

                    <label for="email">Contact Email</label>
                        <input name="email" id="email" type="email" required="required" />

                    <label for="message">Message</label>
                        <textarea name="notes" id="message" required="required" >
                        </textarea>  
                </fieldset>

                <p>
                    <input type="hidden" name="sendtoemail" value="mobile@badgarden.com" />
                    <input type="submit" value="Send" />
                    <input type="hidden" name="redirect" value="http://www.badgarden.com/emsuccess.htm" />
                </p>

            </form>
        </section>

    </section>

<!-- footer -->
    <footer>
        <p>&#169; Copyright 2012 badGarden All Rights Reserved</p>
    </footer>

  </body>

</html>

It's working for me. It must be your end.

It is not "my end". The form has been tested on multiple independent computers and is still not functioning properly.

Try a simple test: add a javascript function to the first textbox so it prompts an alert when clicked. If that alert doesn't come up when you try and click on it then you have something intercepting the clicks on the form.
What does spam.js do?

spam.js shouldn't have been there. I put the function in my head and forgot to remove the link to the external file... Thanks for catching it. It is a text reverse function for the email address on the page.

I removed another one as well and that made the difference. The form didn't like the scripts that deactivated right clicking.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.