1

I cant get the two forms to play with each other.. - meaning I have one form that sends an email - and another that is using a search function. The email form is working ok. Validates just fine, but when I click on the search button, it doesn't do anything. ( the search form is working fine if I remove the email form )

What am I missing ??.. ugh.. I've been working on this, but my brain is fried. I am sure it is something simple.

Any help from you guys would be much appreciated.

<form method="post" action="contact.php" name="contactform" id="contactform">
  <div class="full-lenght">
    <div class="to-left">Name<br>
      <span class="small-required">Required</span> </div>
    <div class="to-right">
      <input name="name" type="text" id="name"  value="" class="contact-field" />
    </div>
  </div>
  <div class="clear"></div>
  <div class="full-lenght">
    <div class="to-left">Email<br>
      <span class="small-required">Required</span> </div>
    <div class="to-right">
      <input name="email" type="text" id="email"  value="" class="contact-field" />
    </div>
  </div>
  <div class="clear"></div>
  <div class="full-lenght">
    <div class="to-left">Phone<br>
      <span class="small-required">Required</span> </div>
    <div class="to-right">
      <input name="phone" type="text" id="phone"  value="" class="contact-field" />
    </div>
  </div>
  <div class="clear"></div>
  <div class="full-lenght">
    <div class="to-left">Message<br>
      <span class="small-required">Required</span> </div>
    <div class="to-right">
      <textarea name="comments" rows="3" id="comments"  class="contact-message"></textarea>
    </div>
  </div>
  <div class="clear"></div>
  <div class="clear"></div>
  <div class="human">3 + 1 = ?<br>
    <input name="verify" type="text" id="verify" size="4" value="" style="width: 30px;" />
    <input name="e" type="submit" class="contact-button" id="submit" value="Submit" />
  </div>
</form>
<div class="search">
  <form class="form" action="search_results.php" method="get">
    <input name="q" type="text" class="search_field" value="Search.." onfocus="if (this.value=='Search..') this.value='';">
    <a onclick=" document.forms[0].submit();return false" href="#"><img class="search_button" title="Search Button" src="images/search_button.jpg" alt="" width="24" height="24"></a> <br>
    <br>
  </form>
</div>

This is the code. The second form starts in search div. The first one is an email form with ajax validation.

Improve this question
6
  • 1
    What exactly do you mean by "play with each other"? You should describe the desired behavior and then describe what's wrong with the current/actual behavior. Commented Jul 14, 2014 at 20:33
  • You need to further explain what exactly you're trying to achieve, and what exactly is going wrong, and what you expect to happen instead. Too much information is usually better than not enough. Commented Jul 14, 2014 at 20:33
  • 1
    sorry, you are right. My first post here. So, I have one form that sends an email - and another that is using a search function. The email form is working ok. Validates just fine, but when I click on the search button, it doesn't do anything. You can preview the live version here: greeleylongmontlaw.com/new-site/index.php. Commented Jul 14, 2014 at 20:36
  • I just tested it on the provided link and the search form redirects me to this URL. Commented Jul 14, 2014 at 20:40
  • My 2 second look says change onclick=" document.forms[0].submit();return false" to onclick=" document.forms[1].submit();return false" Commented Jul 14, 2014 at 20:40

3 Answers 3

Reset to default
1

try this,

in the second form

<form class="form" id="searchform" action="search_results.php" method="get">
    <input name="q" type="text" class="search_field" value="Search.." onfocus="if (this.value=='Search..') this.value='';" />
    <a onclick=" document.getElementById('searchform').submit();return false" href="#"><img class="search_button" title="Search Button" src="images/search_button.jpg" alt="" width="24" height="24"/></a> <br/>
        <br/>
  </form>
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

This doesn't have anything to do with PHP, but does have everything to do with JavaScript.

Change:

<a onclick=" document.forms[0].submit();return false" href="#">

to:

<a onclick="document.forms[1].submit();" href="#">

You're using legacy DOM notation in your JavaScript, which is OK but outdated. When you have forms[0] you're referring to the first form in the DOM which isn't the search form (the contact form is), forms[1] is the search form. Clicking the icon will fail without the change, but you could type in the box and hit enter and it will work, since the JavaScript you have won't be triggered (no click). I also see no need to keep the return false statement in there.

Improve this answer

1 Comment

YES! :) thank you!!! Sorry, I knew it was something trivial. I am not much of a coder, I work primarily on design and simple html structures. So much appreciated!!! !
0 
<form class="form" action="search_results.php" method="get">
 <input name="q" type="text" class="search_field" value="Search.." onfocus="if (this.value=='Search..') this.value='';">
<input type="submit" value='Search'> <br>
<br>

This problem you used anchor tag as button form and it doesn't work for submitting form so you can either replace anchor tag with input tag "submit type" as you see in code or you can use JavaScript to make anchor tag when you click on it, it fires a submitting form.

Enjoy :)

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.