· 8 years ago · Dec 17, 2017, 04:06 AM
1$('#mymodal').on("hidden", function() {
2 location.reload();;
3 });
4
5$('#mymodal').on("hidden.bs.modal", function() {
6 location.reload();;
7 });
8
9<div class="container">
10<!-- <form name="" id="" action="" method="get"> -->
11<!-- Trigger the modal with a button -->
12 <div class="col-md-2 col-md-offset-5">
13 <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" style="margin:0 auto;">Request a Demo</button>
14 </div>
15 <!-- Modal -->
16 <div class="modal fade" id="myModal" role="dialog">
17 <div class="modal-dialog" id="idmodaldialog">
18 <!-- Modal content-->
19 <form name="frmdemo" id="idfrmdemo" method="post">
20 <div class="modal-content">
21 <div class="modal-header" align="center">
22 <button type="button" class="close" data-dismiss="modal">×</button>
23 <h4 class="modal-title"><strong>Request a Demo</strong></h4>
24 </div>
25 <div class="modal-body" id="idmodalcontent">
26 <div class="row">
27 <div class="form-group col-md-6">
28 <label for="txtfirstname">FIRST NAME</label>
29 <input name="txtfirstname" type="text" class="form-control required" placeholder="Please enter your first name" id="idfirstname" >
30 </div>
31 <div class="form-group col-md-6">
32 <label for="txtlastname">LAST NAME</label>
33 <input name="txtlastname" type="text" class="form-control required" placeholder="Please enter your last name" id="idlastname">
34 </div>
35 </div>
36 <div class="form-group">
37 <label for="Email">EMAIL</label>
38 <input type="email" name="txtemail" class="form-control" placeholder="Please enter your email id" id="idemail">
39 <div class="divstyle">(Please enter your email id in block letters)</div>
40 </div>
41 <div class="form-group">
42 <label for="idcompany">COMPANY</label>
43 <input type="text" name="txtcompany" placeholder="Please enter the name of your company" class="form-control" id="idcompany" >
44 </div>
45 <div class="form-group">
46 <label for="Phone">PHONE</label>
47 <input type="tel" name="txtphone" placeholder="Please enter your phone number" class="form-control" id="idphone">
48 </div>
49 <div class="form-group">
50 <label for="">MODE OF CONTACT</label>
51 <select name="selmode" id="idmode" class="form-control">
52 <option value="">Select</option>
53 <option value="email">Email</option>
54 <option value="phone">Phone</option>
55 </select>
56 </div>
57 </div>
58 <div class="modal-footer">
59 <input type="submit" id="idsubmit" name="submit" value="Submit" class="btn btn-warning" />
60 </div>
61 </div>
62 </form>
63 </div>
64 </div>
65</div>
66
67// Wait for the DOM to be ready
68$(function() {
69
70 $('#mymodal').on("hidden", function() {
71 location.reload();;
72 });
73
74 $('#idphone').mask('(000) 000-0000');
75
76 // Initialize form validation on the registration form.
77 // It has the name attribute "frmdemo"
78 $("form[name='frmdemo']").validate({
79 // Specify validation rules
80 rules: {
81 // The key name on the left side is the name attribute
82 // of an input field. Validation rules are defined
83 // on the right side
84 "txtfirstname": {required:true,firstnameval:true},
85 "txtlastname": {required:true,lastnameval:true},
86 "txtemail": {
87 required: true,
88 // Specify that email should be validated
89 // by the built-in "email" rule
90 email: true,
91 emailval:true
92 },
93 "txtcompany": {
94 required: true,
95 companyval:false
96 },
97
98 "txtphone" : {
99 required : true,
100 usphoneval:true
101 },
102
103 "selmode" :{
104 required : true
105 }
106 },
107 // Specify validation error messages
108 messages: {
109 txtfirstname: {
110 required:"Please enter your first name" ,
111 firstnameval:"Enter proper first name"
112 //firstnameval:"Enter only alphabets ",
113 },
114 txtlastname: {
115 required:"Please enter your last name " ,
116 lastnameval:"Enter proper last name"
117 //firstnameval:"Enter only alphabets ",
118 },
119 txtemail: {
120 required : "Please enter a valid email address",
121 emailval : "Please enter your corporate email id"
122 },
123 txtcompany: {
124 required :"Please enter the name of your company",
125 companyval:"Enter a proper company name"
126 },
127 txtphone: {
128 required :"Please enter your phone number",
129 usphoneval :"Please enter a valid phone number"
130 },
131 selmode:"Please select the mode in which we should contact you"
132 },
133
134 // Make sure the form is submitted to the destination defined
135 // in the "action" attribute of the form when valid
136
137 submitHandler: function(form) {
138 // form.submit();
139 $('#idmodalcontent').html('Form submitted successfully');
140
141 var input = $('<input/>').attr({ type: 'button', name:'btnsubmit', value:'Close', id:'idclose',"class":"btn btn-warning"});
142
143 //"data-dismiss":'modal',
144
145 $(".modal-footer").html(input);
146
147 $("#idclose").on("click",function(){
148 location.reload();
149 });
150
151 /*$('#idmodalcontent').modal({
152 onClose: function(dialog){
153 location.reload(true);
154 }
155 });
156 */
157 return false;
158 }
159 });
160
161
162//add your own custom validation rule
163
164 //US phone format
165 $.validator.addMethod("usphoneval", function(value,element)
166 {
167 //^(?([d]{3}))?[. ]?([d]{3})[. ]?([d]{4})$
168
169 if (/^(?([0-9]{3}))?[ ]?([0-9]{3})[-]?([0-9]{4})$/.test(value))
170 {
171 return true;
172
173 } else {
174
175 return false;
176 }
177
178 },function()
179 {
180 });
181
182
183 //first name : only alphabets
184 $.validator.addMethod("firstnameval", function(value,element)
185 {
186 //^(?([d]{3}))?[. ]?([d]{3})[. ]?([d]{4})$
187
188 if (/^[a-zA-Z]{1,256}$/.test(value))
189 {
190 return true;
191
192 } else {
193
194 return false;
195 }
196
197 },function()
198 {
199 });
200
201 $.validator.addMethod("lastnameval", function(value,element)
202 {
203
204 //first character alphabet - rest alphanumeric
205 if (/^[a-zA-Z][a-zA-Z0-9]{0,256}$/.test(value))
206 {
207
208 return true;
209
210
211 } else {
212
213 return false;
214 }
215
216 },function()
217 {
218 });
219
220 //validate company - first character alphabet,rest only alphabet,dot,spaces
221 $.validator.addMethod("companyval", function(value,element)
222 {
223 if (/^[a-zA-Z][a-zA-Z. ]{1,256}$/.test(value))
224 {
225 return true;
226
227 } else {
228
229 return false;
230 }
231
232 },function()
233 {
234 });
235
236 $.validator.addMethod("emailval", function(value,element)
237 {
238
239 var n = value.lastIndexOf('@');
240 var extension = value.substring(n+1).toLowerCase();
241 if (extension == "gmail.com" || extension=="aol.com"|| extension=="facebook.com"|| extension=="googlemail.com"
242 || extension=="hotmail.com" || extension=="hotmail.co.uk" || extension=="yahoo.com" || extension=="yahoo.co.uk"
243 || extension=="live.com" || extension=="att.net" || extension=="comcast.net" || extension=="gmx.com"
244 || extension=="mac.com" || extension=="me.com" || extension=="sbcglobal.net" || extension=="verizon.net"
245 || extension=="msn.com" || extension=="mail.com"|| extension=="email.com" || extension=="games.com"
246 || extension=="gmx.net" || extension=="hush.com" ) {
247
248 return false ;
249
250 } else {
251
252 return true;
253
254 }
255
256 },function()
257 {
258 });
259});
260
261$('#myModal').on('hidden.bs.modal', function () {
262 location.reload();
263})
264
265$(".close").click(function(){
266 bootbox.hideAll();
267 location.reload();
268});