startbootstrap-freelancer icon indicating copy to clipboard operation
startbootstrap-freelancer copied to clipboard

Contact Form Problem and solution

Open drubio1989 opened this issue 5 years ago • 9 comments

I saw that there were a lot of comments on the contact.php form and not being able to submit. I also had this problem and after a handful of hours trying to find a solution, I went ahead and just went with formspree.io instead of the contact.php.

For future developers using this theme who encounter this problem. Just comment out the existing form and then add this. Once you've taken the 5 minutes to verify with formspree, this should work.

      <form action="https://formspree.io/YOUR_EMAIL" method="POST" />
        <div class="control-group">
          <div class="form-group floating-label-form-group controls mb-0 pb-2">
            <label>Name</label>
            <input class="form-control" id="name" type="text" placeholder="Name" required="required" data-validation-required-message="Please enter your name.">
            <p class="help-block text-danger"></p>
          </div>
        </div>
        <div class="control-group">
          <div class="form-group floating-label-form-group controls mb-0 pb-2">
            <label>Email Address</label>
            <input class="form-control" id="email" type="email" placeholder="Email Address" required="required" data-validation-required-message="Please enter your email address.">
            <p class="help-block text-danger"></p>
          </div>
        </div>
        <div class="control-group">
          <div class="form-group floating-label-form-group controls mb-0 pb-2">
            <label>Message</label>
            <textarea class="form-control" id="message" rows="5" placeholder="Message" required="required" data-validation-required-message="Please enter a message."></textarea>
            <p class="help-block text-danger"></p>
          </div>
        </div>
        <br>
        <div id="success"></div>
        <div class="form-group">
          <button type="submit" class="btn btn-primary btn-xl" id="sendMessageButton">Send</button>
        </div>
      </form>

drubio1989 avatar Jul 04 '19 02:07 drubio1989

formspree needs to have the name element in each input to be included in the message that is forwarded.

so for example

<textarea class="form-control" id="message" rows="5" placeholder="Message" required="required" data-validation-required-message="Please enter a message."></textarea>

needs to be

<textarea name="message" class="form-control" id="message" rows="5" placeholder="Message" required="required" data-validation-required-message="Please enter a message." ></textarea>

after that thought it works great, thanks for the tip.

lcwyo avatar Sep 15 '19 12:09 lcwyo

Keeping this open since it's an important way around using the PHP mailer that is included with this theme.

If you're trying to use the PHP mailer and it's not working after you upload it to your web server, it could be a problem that is outlined here on this post on StackOverflow https://stackoverflow.com/questions/24644436/php-mail-function-doesnt-complete-sending-of-e-mail

If your server doesn't support sending mail, for example, if you're hosting your site on GitHub Pages, then Formspree is an excellent solution.

davidtmiller avatar Apr 01 '20 23:04 davidtmiller

Hello! I came up with this issue today and fixed it by changing the code on line #23 of contact_me.js from:url: “contact_me.php”, to: url: "././assets/mail/contact_me.php”,

And now the form works in my server.

mcanelson avatar Apr 18 '20 18:04 mcanelson

Hello! I came up with this issue today and fixed it by changing the code on line #23 of contact_me.js from:url: “contact_me.php”, to: url: "././assets/mail/contact_me.php”,

And now the form works in my server.

It indeed works. I tested it too. Thanks a lot. So many people missed this simple error.

digitalspan avatar Apr 19 '20 07:04 digitalspan

formspree needs to have the name element in each input to be included in the message that is forwarded.

so for example

<textarea class="form-control" id="message" rows="5" placeholder="Message" required="required" data-validation-required-message="Please enter a message."></textarea>

needs to be

<textarea name="message" class="form-control" id="message" rows="5" placeholder="Message" required="required" data-validation-required-message="Please enter a message." ></textarea>

after that thought it works great, thanks for the tip.

Would be useful to change the code in the original issue, are these editable?

dostrelith678 avatar Apr 22 '20 14:04 dostrelith678

At this point in time, the free tier for Formspree is a lot more limited than it once was. There are a lot of ways to add forms to static sites at this point in time, and I am considering dropping the 'working form functionality' from the theme all together in the upcoming Bootstrap 5 compatible version.

The PHP scripts with jQuery validation is becoming more and more antiquated, and it's a difficult thing to provide troubleshooting and support for. Instead we may set up an article or guide on the various techniques one could use to add functionality to a form.

davidtmiller avatar Mar 30 '21 00:03 davidtmiller

At this point in time, the free tier for Formspree is a lot more limited than it once was. There are a lot of ways to add forms to static sites at this point in time, and I am considering dropping the 'working form functionality' from the theme all together in the upcoming Bootstrap 5 compatible version.

The PHP scripts with jQuery validation is becoming more and more antiquated, and it's a difficult thing to provide troubleshooting and support for. Instead we may set up an article or guide on the various techniques one could use to add functionality to a form.

Have you thought of mailChimp ?

jovialcore avatar May 10 '21 13:05 jovialcore

I was having a lot of issues getting the formspree form to work. I needed to make a formspree account (free). Then cope the end point HTML code and implant in the action section however, I was only updating the index file. There were about 3 separate files including some or all portions of the contact form that needed to be updated and committed with intended code for it work. Hopefully this helps some other novice that is banging their head against a wall currently.

tschwerman avatar Nov 16 '22 05:11 tschwerman