Làm cách nào để di chuyển trên FormSpree?

Question

Tôi đã truy cập trang web của mình trên Dịch vụ trang Github. Tôi đang cố triển khai biểu mẫu liên hệ miễn phí FormSpree nhưng sau khi bạn gửi biểu mẫu, nó chuyển hướng bạn đến một trang web khác. Một cái gì đó tôi muốn tránh. Vì vậy, tôi tìm kiếm nó trên internet và tất nhiên những người khác muốn loại bỏ nó quá (tôi bỏ qua email của tôi trong hình dưới đây).

Đây là hình thức tôi đã ở trên nhưng nó không thực sự làm việc ở tất cả. Nó làm việc trước khi tôi cố gắng để fiddle với nó mặc dù.

Dưới đây là những gì các hình thức trông giống như theo mặc định từ FormSpree:

<form action="//formspree.io/your@email.com" 
     method="POST"> 
    <input type="text" name="name"> 
    <input type="email" name="_replyto"> 
    <input type="submit" value="Send"> 
</form> 

Đây là phiên bản của tôi (mà làm việc tốt trước khi tôi cố gắng để có được xung quanh redirect)

<div class=modal-body style="background-color: #454545"> 
    <p>Please use the form below to contact us regarding feedback or any questions you may have! 
     We will never use the information given below to spam you and we will never pass on your 
     information to a 3rd party.</p> 
    <p>As we are using <a target="_blank" href="http://formspree.io">FormSpree</a> for this form 
    please consult their privacy policy for any questions regarding this matter.</p> 
    <form id="contactform" method="POST"> 
     <div class="form-group"> 
      <div class="input-group"> 
       <span class="input-group-addon">Name</span> 
       <input name="form-name-input" type="text" name="name" class="form-control" required> 
      </div> 
      <div class="input-group"> 
       <span class="input-group-addon">Email</span> 
       <input name="form-email-input" type="email" name="_replyto" class="form-control" required> 
      </div> 
      <div class="input-group"> 
       <span class="input-group-addon">Subject</span> 
       <input name="form-subject-input" type="text" name="subject" class="form-control" required> 
      </div> 
      <div class="input-group"> 
       <span class="input-group-addon">Description</span> 
       <textarea name="form-description-input" name="description" class="form-control" rows="4" cols="60" required></textarea> 
      </div> 
      <input type="text" name="_gotcha" style="display:none" /> 
      <input class="btn btn-success" data-dismiss="modal" type="submit" id="form-submit-btn" value="Submit"> 
      <input type="hidden" name="_next" value="http://www.dynamicrealities.net" onclick="FormSentConfirmation()"/> 
     </div> 
     <script> 
      var contactform = document.getElementById('contactform'); 
      contactform.setAttribute('action', '//formspree.io/' + 'dynamicrealities@gmail.com'); 
     </script> 
    </form> 
</div> 
<div class="modal-footer" style="background-color: #333333"> 
    <button class="btn btn-danger btn-bg" data-dismiss="modal" type="button" id="form-dismiss-btn" onclick="">Close</button> 
</div> 

Và khi tôi hãy gọi _next Tôi muốn nó thực hiện cảnh báo sau:

function FormSentConfirmation() { 
    alert('Thanks for the email, we\'ll be in touch promptly.'); 
} 

Wh vi Tôi nhấn nút Gửi, tất cả những gì xảy ra là biểu mẫu biến mất nhưng tôi không nhận được bất kỳ email nào. Tôi có lẽ chỉ làm điều này sai vì tôi khá mới vẫn còn HTML/JavaScript.

Answer 1

Follow dụ AJAX của họ ở phía dưới: https://formspree.io/

$("#sendMessage").on("click", function() { 
    $.ajax({ 
     url: "//formspree.io/dynamicrealities@gmail.com", 
     method: "POST", 
     data: {message: "hello!"}, 
     dataType: "json" 
    }); 
}); 

Hãy nhớ bao gồm jQuery cũng để làm việc này. Xóa:

var contactform = document.getElementById('contactform'); 
contactform.setAttribute('action', '//formspree.io/' + 'dynamicrealities@gmail.com 

và thay thế bằng mã của tôi và thay đổi công cụ chọn. Hoặc sử dụng $("form").on("submit"...

Dưới đây là ví dụ của tôi, trong đó gửi cho bạn một email và nhắc nhở một cảnh báo cho người sử dụng: http://jsfiddle.net/228d4snb/

làm bất cứ điều gì bạn muốn làm ngay trước đó return false;

Answer 2

Sử dụng nhập ẩn này trường bên trong biểu mẫu để chuyển hướng sau khi gửi biểu mẫu. Bạn có thể chuyển hướng người dùng đến một trang mà bạn thích hoặc bạn đã tạo bằng cách sử dụng khối mã này.

<input type="hidden" name="_next" value="//site.io/thanks.html" /> 

thay giá trị với URL trang cảm ơn hợp lệ.

theo liên kết này cho một hướng dẫn về how to use Formspree và cũng là một video demo

Answer 3

Có thực sự là một cách dễ dàng hơn bây giờ:

_next 

Theo mặc định, sau khi nộp một hình thức người dùng được hiển thị các Formspree "Thank Bạn "trang. Bạn có thể cung cấp một URL thay thế cho trang đó.

<input type="hidden" name="_next" value="//site.io/thanks.html" /> 

này được ghi chép lại vào cuối của https://formspree.io/