https://www.nakheel.com/Mvc/Scripts/forms/ajax-form.js?package=NakheelComponents

1(function ($) { //an IIFE so safely alias jQuery to $
2
3    if (typeof window.FormData === 'undefined')
4        return;
5
6    $.AjaxForm = function (element) {
7
8        if (element instanceof $) {
9            this.element = element
10        } else {
11            this.element = $(element);
12            this.elementSelector = element;
13        }
14    };
15
16    //assigning an object literal to the prototype is a shorter syntax
17    //than assigning one property at a time
18    $.AjaxForm.prototype = {
19        Init: function () {
20            if (this.element.length == 0) { return; }
21            var that = this;
22            this.element.each(function () {
23                var form = $(this).find("form");
24                that.InitForm(form);
25            });
26        },
27        Hash256: function (string) {
28            const utf8 = new TextEncoder().encode(string);
29            return crypto.subtle.digest('SHA-256', utf8).then((hashBuffer) => {
30                const hashArray = Array.from(new Uint8Array(hashBuffer));
31                const hashHex = hashArray
32                    .map((bytes) => bytes.toString(16).padStart(2, '0'))
33                    .join('');
34                return hashHex;
35            });
36        },
37        InitForm: function (form) {
38
39            var input = document.querySelector("#" + form.find('.phone').attr('id'));
40            window.intlTelInput(input, {
41                utilsScript: "/ResourcePackages/NakheelComponents/assets/src/Assets/scripts/utils.js",
42                separateDialCode: true,
43                initialCountry: "ae",
44                preferredCountries: ["ae"],
45                nationalMode: false
46            });
47
48            $(input).on('input', function () {
49                var inputValue = $(this).val();
50                $(this).val(inputValue.replace(/[^0-9]/g, ''));
51            });
52
53            $("#FirstName,#LastName,[id^=firstname_],[id^=lastname_]").on('input', function () {
54                $(this).val($(this).val().replace(/[^A-Za-z]/g, ''))
55            });
56
57            var successMessage = form.find('.success-message');
58            var errorMessage = form.find('.general-error-message');
59
60            var submitUrl = form.attr('action');
61
62            var formValidation = function () {
63                form.validate({
64                    errorElement: "span",
65                    rules: {
66                        FirstName: {
67                            required: true
68                        },
69                        LastName: "required",
70                        Email: {
71                            required: true,
72                            email: true
73                        },
74                        EnquiryType: {
75                            required: true
76                        },
77                        Phone: {
78                            required: true
79                        },
80                        Message: {
81                            required: true
82                        },
83                        Project: {
84                            required: {
85                                depends: function (element) {
86                                    console.log(element);
87                                    return $("#EnquiryType").val() === $("#EnquiryTypeValue").val();
88                                }
89                            }
90                        },
91                        'confirmcontactus': {
92                            required: true
93                        }
94                    },
95                    messages: {
96                        FirstName: $("#FirstNameErrorMessage").val(),
97                        LastName: $("#LastNameErrorMessage").val(),
98                        Email: $("#EmailErrorMessage").val(),
99                        Phone: $("#PhoneErrorMessage").val(),
100                        Message: $("#MessageErrorMessage").val(),
101                        EnquiryType: $("#EnquiryTypeErrorMessage").val(),
102                        Project: $("#ProjectErrorMessage").val(),
103                    }
104                });
105            };
106

107            var validationRules = {
108                required: true,
109                // Add other validation rules as needed
110            };
111
112            var validationMessages = {
113                required: $("#FieldRequiredErrorMessage").val(),
114                // Add other error messages as needed
115            };
116            var _that = this;
117            //var email = $("[name=Email]").val();
118
119            var submitClickHandler = function () {
120
121                form.find('.dynamic-id').each(function () {
122                    $(this).rules("add", validationRules);
123                });
124
125                var contactformIsValid = true;
126                contactformIsValid = form.valid() && contactformIsValid;
127
128                var captchaRespFlag = false;
129                var captchaResponse = grecaptcha.getResponse();
130                if (captchaResponse == '') {
131                    $(".ReCaptchaResponse-msg").addClass('error');
132                    $(".ReCaptchaResponse-msg").text("Please verify you're not a robot!");
133                    $('.ReCaptchaResponse-msg').show();
134                    //return false;
135                    captchaRespFlag = false;
136                } else {
137                    $(".ReCaptchaResponse").val(captchaResponse);
138
139                    $(".ReCaptchaResponse-msg").removeClass('error');
140                    $(".ReCaptchaResponse-msg").text("");
141                    $('.ReCaptchaResponse-msg').hide();
142
143                    captchaRespFlag = true;
144                }
145
146                var callBackConfirmContactUsFlag = false;
147                if ($('#IsCallBackConfirmInputFirstForm').is(':checked')) {
148                    //$("#IsCallBackConfirmFirstForm").val("true");
149                    $(".lblcallBackConfirmContactUs").removeClass("error");
150
151                    callBackConfirmContactUsFlag = true;
152                }
153                else {
154                    $(".lblcallBackConfirmContactUs").addClass("error");
155                    // $("#lblcallBackConfirmContactUs").val("false");
156                    callBackConfirmContactUsFlag = false;
157                }
158
159                contactformIsValid = captchaRespFlag && contactformIsValid;
160                contactformIsValid = callBackConfirmContactUsFlag && contactformIsValid;
161
162                if (!contactformIsValid) {
163                    return false;
164                }
165
166                // Pick email for data layer 
167                var email = $("[name=Email").val();
168
169                //send form data start
170
171                var formData = new FormData(form[0]);
172                var fileInput = $("#file");
173                if (fileInput.length > 0) {
174                    var fileVal = fileInput.get(0).files[0];
175                    formData.append("file", fileVal);
176                }
177                $("#form-loader").show();
178
179                $("#registerYourIntrestFormLoader").removeClass('d-none');
180                var request = new XMLHttpRequest();
181                request.open('POST', submitUrl);
182                request.onload = function () {
183                    if (request.status === 200) {
184                        var responseJson = JSON.parse(request.response);
185                        if (responseJson.success) {
186                            if (responseJson.redirectUrl && responseJson.redirectUrl !== '') {
187                                document.location.replace(responseJson.redirectUrl);
188                                setTimeout(function () { $("#registerYourIntrestFormLoader").addClass('d-none'); }, 250);
189                            } else if (responseJson.message && responseJson.message !== '') {
190                                successMessage.text(responseJson.message);
191                                successMessage.show();
192                                $('#' + form.attr('id'))[0].reset();
193                                ActionSuccess(form.attr('id'));
194                                $('#' + form.attr('id')).hide();
195                                setTimeout(function () { $("#registerYourIntrestFormLoader").addClass('d-none'); }, 250);
196
197                                _that.Hash256(email).then((hashEmail) 

197=> {
198                                    dataLayer.push({
199                                        'user_data': [
200                                            {
201                                                'email_address': email,
202                                                ' sha256_email_address': hashEmail
203                                            }
204                                        ]
205                                    });
206                                });
207
208                            } else {
209                                if (redirectUrl) {
210                                    document.location.replace(redirectUrl);
211                                    setTimeout(function () { $("#registerYourIntrestFormLoader").addClass('d-none'); }, 250);
212                                }
213                                else {
214                                    successMessage.show();
215                                    $('#' + form.attr('id'))[0].reset();
216                                    ActionSuccess(form.attr('id'));
217                                    $('#' + form.attr('id')).hide();
218                                    setTimeout(function () { $("#registerYourIntrestFormLoader").addClass('d-none'); }, 250);
219                                }
220                            }
221                        }
222
223                        else {
224                            errorMessage.text(responseJson.message);
225                            errorMessage.show();
226                            grecaptcha.reset();
227                            ActionFailure(responseJson.message, form.attr('id'));
228                            setTimeout(function () { $("#registerYourIntrestFormLoader").addClass('d-none'); }, 250);
229                        }
230                    } else {
231                        setTimeout(function () { $("#registerYourIntrestFormLoader").addClass('d-none'); }, 250);
232                        errorMessage.text(responseJson.message);
233                        errorMessage.show();
234                        grecaptcha.reset();
235                        ActionFailure(responseJson.message, form.attr('id'));
236                    }
237                };
238
239                //    errorMessage.hide();
240
241                request.send(formData);
242                $("#form-loader").hide();
243                // send form data ends
244
245                return false;
246            };
247
248            form.find('input[type=button]').on('click', function (e) {
249                var btnSubmitFirstForm = $("#firstFormSubmitId").val();
250
251                var btnSubmitSecondForm = $("#secondFormSubmitId").val();
252                if ($(this).attr('id') == btnSubmitFirstForm) {
253                    $("#phoneCode_firstForm").val($("#phoneFirstForm .iti__selected-dial-code").text());
254                    $("#ProjectNameFirstFrom").val($("#projectTitle").text());
255                    if ($('#IsCallBackConfirmInputFirstForm').is(':checked')) {
256                        $("#IsCallBackConfirmFirstForm").val("true");
257                    }
258                    else {
259                        $("#IsCallBackConfirmFirstForm").val("false");
260                    }
261                }
262                else if ($(this).attr('id') == btnSubmitSecondForm) {
263                    $("#phoneCode_secondForm").val($("#phoneSecondForm .iti__selected-dial-code").text());
264                    $("#ProjectNameSecondFrom").val($("#projectTitle").text());
265                    if ($('#IsCallBackConfirmInputSecondForm').is(':checked')) {
266                        $("#IsCallBackConfirmSecondForm").val("true");
267                    }
268                    else {
269                        $("#IsCallBackConfirmSecondForm").val("false");
270                    }
271                }
272
273                e.preventDefault();
274                form.find("#phoneCode").val(form.find('.iti__selected-dial-code').text());
275                $("#nationality").val($("#NationalityList").val());
276                formValidation();
277                submitClickHandler();
278
279                console.log('submit clicked' + form.attr('id'));
280            });
281
282            $("#FirstName,#LastName").bind('keyup', function () {
283                $(this).val($(this).val().replace(/[^A-Za-z]/g, ''))
284            });
285        },
286
287    };
288
289    $.AjaxForm.defaultOptions = {};
290
291
292
293}(jQuery));
294
295function recaptchaCallback() {
296    $(".ReCaptchaResponse-msg").removeClass('error');
297    $(".ReCaptchaResponse-msg").hide();
298};
299$("#EnquiryType").change(function () {
300    var showProjectDropdownValue = $("#EnquiryTypeValue").val()
301
302
303    var selectedOption = $('option:selected', this).val();
304    if (selectedOption === showProjectDropdownValue) {
305        $('#projectSection').removeClass('d-none');
306    }
307    else {
308        $('#projectSection').addClass('d-none');
309    }
310});
311var ajaxForm = new $.AjaxForm(".registration-form-selector");
312ajaxForm.Init();
313
314function ActionSuccess(formId) {
315    if (FindForm(formId) == "form1") {
316        var errorMessage = $("#firstFormErrorMsg");
317        ApplyActionSuccess(errorMessage);
318
319    }
320    else if (FindForm(formId) == "form2") {
321        var errorMessage = $("#secondFormErrorMsg");
322        ApplyActionSuccess(errorMessage);
323    }
324    grecaptcha.reset();
325}
326function ActionFailure(message, formId) {
327
328    if (FindForm(formId) == "form1") {
329        var errorMessage = $("#firstFormErrorMsg");
330        ApplyActionFailure(message, errorMessage);
331
332    }
333    else if (FindForm(formId) == "form2") {
334        var errorMessage = $("#secondFormErrorMsg");
335        ApplyActionFailure(message, errorMessage);
336    }
337    grecaptcha.reset();
338
339}
340function ApplyActionFailure(message, errorDiv) {
341    errorDiv.text(message);
342    errorDiv.show();
343    errorDiv.addClass("error");
344    errorDiv.removeClass("text-success");
345}
346function ApplyActionSuccess(errorDiv) {
347    var successMessage = $("#SuccessMessage").val();
348    errorDiv.text(successMessage);
349    errorDiv.show();
350    errorDiv.addClass("text-success");
351    errorDiv.removeClass("error");
352    $("#formSuccessMsg").show();
353}
354function FindForm(formId) {
355    var form = "";
356    var firstForm = $("#firstFormId").val();
357    var secondForm = $("#secondFormId").val();
358    if (formId == firstForm) {
359        form = "form1"
360    }
361    else if (formId == secondForm) {
362        form = "form2"
363    }
364    return form;
365}
366//$("#" + btnSubmitFirstForm).click(function () {
367//    $("#phoneCode_firstForm").val($("#phoneFirstForm .iti__selected-dial-code").text());
368//    $("#ProjectNameFirstFrom").val($("#projectTitle").text());
369//    if ($('#IsCallBackConfirmInputFirstForm').is(':checked')) {
370//        $("#IsCallBackConfirmFirstForm").val("true");
371//    }
372//    else {
373//        $("#IsCallBackConfirmFirstForm").val("false");
374//    }
375
376//});
377//$("#" + btnSubmitSecondForm).click(function () {
378//    $("#phoneCode_secondForm").val($("#phoneSecondForm .iti__selected-dial-code").text());
379//    $("#ProjectNameSecondFrom").val($("#projectTitle").text());
380//    if ($('#IsCallBackConfirmInputSecondForm').is(':checked')) {
381//        $("#IsCallBackConfirmSecondForm").val("true");
382//    }
383//    else {
384//        $("#IsCallBackConfirmSecondForm").val("false");
385//    }
386//});