ejb122
ejb122

Reputation: 1

Make button fill out a part of a contact form

I put a button beneath an SEO service I offer and when they click it I want it to direct them down to the contact form below and fill out the "service needed" area as "SEO". Is this possible?

<!-- MY FORM THAT I WANT FILLED OUT AFTER THEY CLICK A BUTTON -->

<form id="contact-form" class="form" action="contact.php" method="POST" role="form">
              <div class="form-group">
                  <label class="form-label" for="name"></label>
                  <input type="text" class="form-control" id="name" name="name" placeholder="Your Name" tabindex="1" required>
              </div>                            
              <div class="form-group">
                  <label class="form-label" for="email"></label>
                  <input type="email" class="form-control" id="email" name="email" data-constraints="@NotEmpty @Email" placeholder="Your Email" tabindex="2" required>
              </div>                            
              <div class="form-group">
                  <label class="form-label" for="subject"></label>
                  <input type="text" class="form-control" id="subject" name="subject" placeholder="Service Needed" tabindex="3">
              </div>                            
              <div class="form-group">
                  <label class="form-label" for="comments"></label>
                  <textarea rows="5" cols="50" name="comments" class="form-control" id="comments" placeholder="Message..." tabindex="4" required></textarea>                                 
              </div>
              <div class="text-center">
                  <button type="submit" value="send" class="btn btn-start-order">Send Message</button>
              </div>
          </form>



<!-- BUTTON I USE -->
<a href="index.html#contact" class="btn btn-default">get a quote</a>

Upvotes: 0

Views: 51

Answers (1)

Todor Simeonov
Todor Simeonov

Reputation: 806

$.ready(function(){
    $('#myButtonID').click(function(){
         $('#subject').val('SEO');
         event.preventDefault(); // prevent default anchor tag action otherwise animation wont work
         $('html, body').animate({scrollTop: $('#contact-form').offset().top}, 300 /*duration*/);
         return false;
    });

});

Upvotes: 1

Related Questions