Website Module Contact Page

A sample contact us page:

Create a new Web Page and add the content and code

Content Section

# Write to us.

<br>We would love to hear from you and we usually reply back in one business day.<br>

<div class="web-form">
  <input name="email" placeholder="Your Email">
  <br></br>
  <textarea name="message" rows="10" placeholder="Your Question"></textarea>
  <br><br>
  <button class="btn btn-primary btn-send">Send</button>
</div>

Code Section

The name of the page is "contact-us". If it is something else, just update the correct name page.

You can ofcourse add more fields and concat them in the message property.

// attach events after the page loads
wn.pages["contact-us"].onload = function(wrapper) { 
  
  // button click event
  $('#page-contact-us .btn-send').click(function() {
    var email = $('#page-contact-us [name="email"]').val();
    var message = $('#page-contact-us [name="message"]').val();

    // check if both properties are set
    if(!(email && message)) {
      msgprint("Please enter both your email and message so that we can get back to you. Thanks!");
      return;
    }

    // create a new "Support Ticket"
    erpnext.send_message({
      subject:'Website Query',
      sender: email,
      message: message,
      callback: function() {
        // clear the values once updated
        $('#page-contact-us :input').val('');
      }
    });
  });
}