From c9cf5aebeaa159580b1ed6e35c1155de9602063d Mon Sep 17 00:00:00 2001
From: Pranav Nachanekar <pranav@Pranavs-MacBook-Pro.local>
Date: Tue, 24 Sep 2019 12:08:37 +0530
Subject: [PATCH] Changed required values, add clientside validation

---
 erpnext/crm/doctype/appointment/appointment.json |  8 +++-----
 erpnext/www/book-appointment/index.html          | 14 ++++++--------
 erpnext/www/book-appointment/index.js            |  7 ++++++-
 3 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/erpnext/crm/doctype/appointment/appointment.json b/erpnext/crm/doctype/appointment/appointment.json
index 22df5c6aa8..9dfcc57197 100644
--- a/erpnext/crm/doctype/appointment/appointment.json
+++ b/erpnext/crm/doctype/appointment/appointment.json
@@ -35,14 +35,12 @@
   {
    "fieldname": "customer_phone_number",
    "fieldtype": "Data",
-   "label": "Phone Number",
-   "reqd": 1
+   "label": "Phone Number"
   },
   {
    "fieldname": "customer_skype",
    "fieldtype": "Data",
-   "label": "Skype ID",
-   "reqd": 1
+   "label": "Skype ID"
   },
   {
    "fieldname": "customer_details",
@@ -95,7 +93,7 @@
    "fieldtype": "Column Break"
   }
  ],
- "modified": "2019-09-23 10:57:04.876506",
+ "modified": "2019-09-24 11:44:21.228104",
  "modified_by": "Administrator",
  "module": "CRM",
  "name": "Appointment",
diff --git a/erpnext/www/book-appointment/index.html b/erpnext/www/book-appointment/index.html
index 2e0321394e..1f6dd2e0e6 100644
--- a/erpnext/www/book-appointment/index.html
+++ b/erpnext/www/book-appointment/index.html
@@ -45,16 +45,14 @@
     </div>
     <div class="row justify-content-center mt-3">
         <div class="col-md-4 align-items-center">
-            <input class="form-control mt-3" type="text" name="customer_name" id="customer_name" placeholder="Your Name"
-                required>
-            <input class="form-control mt-3" type="tel" name="customer_number" id="customer_number"
-                placeholder="Contact Number" required>
-            <input class="form-control mt-3" type="text" name="customer_skype" id="customer_skype" placeholder="Skype"
-                required>
-            <input class="form-control mt-3"type="email" name="customer_email" id="customer_email" 
-                placeholder="Email Address">
+            <form id="customer-form" action='#'>
+            <input class="form-control mt-3" type="text" name="customer_name" id="customer_name" placeholder="Your Name (required)"required>
+            <input class="form-control mt-3" type="tel" name="customer_number" id="customer_number" placeholder="+910000000000">
+            <input class="form-control mt-3" type="text" name="customer_skype" id="customer_skype" placeholder="Skype">
+            <input class="form-control mt-3"type="email" name="customer_email" id="customer_email" placeholder="Email Address (required)"required>
             <textarea class="form-control mt-3" name="customer_notes" id="customer_notes" cols="30" rows="10"
                 placeholder="Notes"></textarea>
+            </form>
             <div class="row mt-3 ">
                 <div class="col-md"><button class="btn btn-dark form-control" onclick="initialise_select_date()">Go back</button></div>
                 <div class="col-md"><button class="btn btn-primary form-control " onclick="submit()" id="submit-button">Submit</button></div>
diff --git a/erpnext/www/book-appointment/index.js b/erpnext/www/book-appointment/index.js
index 345e614154..6034f4eb48 100644
--- a/erpnext/www/book-appointment/index.js
+++ b/erpnext/www/book-appointment/index.js
@@ -195,7 +195,11 @@ function setup_details_page() {
 }
 
 async function submit() {
-    // form validation here
+    let form = document.querySelector('#customer-form');
+    if(!form.checkValidity()){
+        form.reportValidity();
+        return;
+    }
     get_form_data();
     let appointment = (await frappe.call({
         method: 'erpnext.www.book-appointment.index.create_appointment',
@@ -212,6 +216,7 @@ async function submit() {
 }
 
 function get_form_data() {
+    
     contact = {};
     contact.name = document.getElementById('customer_name').value;
     contact.number = document.getElementById('customer_number').value;