diff --git a/CustomerOnlineV2/CustomerOnlineV2/Views/CustomerDocument/CustomerDocument.cshtml b/CustomerOnlineV2/CustomerOnlineV2/Views/CustomerDocument/CustomerDocument.cshtml
index 0c94136..3c9d5d0 100644
--- a/CustomerOnlineV2/CustomerOnlineV2/Views/CustomerDocument/CustomerDocument.cshtml
+++ b/CustomerOnlineV2/CustomerOnlineV2/Views/CustomerDocument/CustomerDocument.cshtml
@@ -181,10 +181,13 @@
                                         <div class="input-group flex-nowrap">
                                             <div class="flex-grow-1 input-file">
                                                 <input type="text"  asp-for="fileName" class="form-control" placeholder="Chose File..." />
+                                               @*  <img id="myUploadedImg" alt="Photo" style="width:180px;" /> *@
                                             </div>
-                                            <span class="input-group-text px-2">
-                                                <button class="btn-choose bg-transparent text-white border-0" type="button">Upload</button>
-                                            </span>
+                                           @*  <span class="input-group-text px-2">
+                                                <button class="btn-choose bg-transparent text-white border-0" id="BtnUpload" type="submit">
+                                                    < span class="RegisterText"></span>&nbsp;<div class="spinner-border text-success loading" role="status" style="display:none;"></div>
+                                                </button>
+                                            </span> *@
                                         </div>
                                     </div>
                                     <div class="mb-3">
@@ -199,7 +202,13 @@
                                         </div>
                                     </div>
 
-                                    <div class="d-grid mt-4"><button class="btn btn-primary" onclick="btnUpload" type="submit">Update Document</button></div>
+                                    <div class="d-grid mt-4">
+                                        @* <button class="btn btn-primary" onclick="btnUpload" type="submit">Update Document </button> *@
+
+                                        <button type="submit" id="btnUpload" class="btn btn-lg btn-primary" style="width: 250px;">
+                                            <span class="ButtonTExt">Update Document</span>&nbsp;<div class="spinner-border text-success loading" role="status" style="display:none;"></div>
+                                        </button>
+                                        </div>
                                 </form>
                             </div>
                         </div>
@@ -213,38 +222,186 @@
 <!-- Content end -->
 @section Scripts {
     
+
     <script>
-        $(document).ready(function () {
+
+
+        (function () {
+            'use strict'
+            // Fetch all the forms we want to apply custom Bootstrap validation styles to
+            var forms = document.querySelectorAll('#updateCard')
+            // Receiver();
+            // Loop over them and prevent submission
+            Array.prototype.slice.call(forms)
+                .forEach(function (form) {
+                    form.addEventListener('submit', function (event) {
+                        if (!form.checkValidity()) {
+                            event.preventDefault()
+                            event.stopPropagation()
+                        }
+                        else {
+                            event.preventDefault();
+                            FileUpload();
+                        }
+                        form.classList.add('was-validated')
+                    }, false)
+                })
+        })();
+
+
+
+        function FileUpload() {
             debugger;
-            $('#updateCard').submit(function (e) {
-                e.preventDefault();
 
-                var formData = new FormData(this);
+            DisableDocumentButton();
+
+
+
+            let documentType = $('#documentType').val();
+            let fileName = $('#fileName').val();
+          
+
+
+
+
+
+            let Data = {
+
+                documentType: documentType,
+                fileName: fileName,
+
+
+
+            };
+
+            $.ajax(
+                {
 
-                $.ajax({
-                    url: '/CustomerDocument/Upload',
                     type: 'POST',
-                    data: formData,
-                    processData: false,
-                    contentType: false,
-                    success: function (data) {
-                        // Handle success
-                        $('#result').text('File uploaded successfully.');
+                    url: '/CustomerDocument/AddDocment',
+                    data: Data,
+                    processData: true,
+                    headers: {
+                        "RequestVerificationToken":
+                            $('input[name="__RequestVerificationToken"]').val()
                     },
-                    error: function (error) {
-                        // Handle error
-                        $('#result').text('File upload failed: ' + error.responseText);
+                    async: true,
+                    success: function (response) {
+                        EnableDocumentButton();
+                        if (response.responseCode != 0) {
+                            ShowAlertMessage(response.responseCode, response.responseMessage);
+                            //ShowAlertMessage("Receiver Successfully created")
+
+                            return;
+
+                        }
+
+                        // clearFields();
+
+                        // $('#Country').focus();
+                        $('#message').text('Data successfully submitted');
+
+                        window.location.replace("/home");
+                    },
+
+
+                    error: function () {
+                        return null;
                     }
                 });
-            });
-        });
+        }
+
 
-        $(document).ready(function () {
+        function DisableDocumentButton() {
+            $('.ButtonTExt').hide();
+            $('#btnUpload').css('cursor', 'not-allowed');
+            $('.loadingSend').show();
+            $('#btnUpload').prop('disabled', true);
+        }
+
+        function EnableDocumentButton() {
             debugger;
-            $('#submit').click(function () {
-                var url = $(location).attr('href');
-                $('#btnUpload').html('<strong>' + url + '</strong>');
-            });
-        });
+            $('.ButtonTExt').show();
+            $('#btnUpload').css('cursor', 'pointer');
+            $('.loadingSend').hide();
+            $('#btnUpload').prop('disabled', false);
+        }
+
+
+       // $(document).ready(function () {
+
+
+            // $('#ContentPlaceHolder1_reg_front_id').on('change', function (e) {
+            //     $('.loadImg').remove();
+            //     ValidateExtension('ContentPlaceHolder1_reg_front_id');
+            //     // console.log(e.target, 'e')
+            //     for (var i = 0; i < e.target.files.length; i++) {
+            //         var tmppath = URL.createObjectURL(e.target.files[i]);
+            //         $(this).after('<span class="loadImg"><img src="' + tmppath + '" alt=""></span>');
+            //         $(".loadImg img").fadeIn("fast");
+            //     }
+            // });
+            // $('#ContentPlaceHolder1_reg_id_additional').on('change', function (e) {
+            //     $('.loadImg2').remove();
+            //     ValidateExtension('ContentPlaceHolder1_reg_id_additional');
+            //     // console.log(e.target, 'e')
+            //     for (var i = 0; i < e.target.files.length; i++) {
+            //         var tmppath = URL.createObjectURL(e.target.files[i]);
+            //         $(this).after('<span class="loadImg2"><img src="' + tmppath + '" alt=""></span>');
+            //         $(".loadImg2 img").fadeIn("fast");
+            //     }
+            // });
+            // // Image upload for back id
+            // $('#ContentPlaceHolder1_reg_back_id').on('change', function (e) {
+            //     $('.loadImg1').remove();
+            //     ValidateExtension('ContentPlaceHolder1_reg_back_id');
+            //     // console.log(e.target, 'e')
+
+            //     for (var i = 0; i < e.target.files.length; i++) {
+            //         var tmppath = URL.createObjectURL(e.target.files[i]);
+            //         $(this).after('<span class="loadImg1"><img src="' + tmppath + '" alt=""></span>');
+            //         $(".loadImg1 img").fadeIn("fast");
+            //     }
+            // });
+
+
+       // });
+        // var _URL = window.URL || window.webkitURL;
+        // $("#fileName").on('change', function () {
+
+        //     var file, img;
+        //     if ((file = this.files[0])) {
+        //         img = new Image();
+        //         img.onload = function () {
+        //             sendFile(file);
+        //         };
+        //         img.onerror = function () {
+        //             alert("Not a valid file:" + file.type);
+        //         };
+        //         img.src = _URL.createObjectURL(file);
+        //     }
+        // });
+
+        // function sendFile(file) {
+
+        //     var formData = new FormData();
+        //     formData.append('file', $('#fileName')[0].files[0]);
+        //     $.ajax({
+        //         type: 'post',
+        //         url: 'CustomerDocument/AddDocment,
+        //         data: formData,
+        //         success: function (status) {
+        //             if (status != 'error') {
+        //                 var my_path = "MediaUploader/" + status;
+        //                 $("#myUploadedImg").attr("src", my_path);
+        //             }
+        //         },
+        //         processData: false,
+        //         contentType: false,
+        //         error: function () {
+        //             alert("Whoops something went wrong!");
+        //         }
+        //     });
+      
     </script>
     }
\ No newline at end of file