changes for the file upload

content_quality_tool/urls.py

@@ -25,7 +25,8 @@ urlpatterns = [
     path("", views.login_view, name="login_view"),
     path('', include('content_quality_tool_public.urls')),  # Your app's routes
 
-    # path("core/", include("core.urls")),
+    # api url
+    path("core/", include("core.urls")),
     # path("", views.login_view, name="login_view"),
 ]
 

content_quality_tool_public/templates/index.html

@@ -152,27 +152,43 @@
                                     <!-- <a href="#" class="btn btn-sm btn-primary float-sm-end me-2">Download Template</a> -->
                                 </div> <!-- /.card-header -->
                                 <div class="card-body p-0">
-                                    <form id="myForm" action="get-data.html"> <!--begin::Body-->
+                                    <!-- {% if success %}
+                                        <div class="alert alert-success mt-3">
+                                            File uploaded successfully! {{ file_url }}View File</a>
+                                        </div>
+                                    {% endif %} -->
+
+                                    <form id="uploadForm" method="POST"  enctype="multipart/form-data"> <!--begin::Body-->
+                                        {% csrf_token %}
                                         <div class="card-body">
                                             
                                             <div class="form-group row mb-3">
                                                 <label for="file" class="col-sm-2 col-form-label">Select Input
                                                     File <span class="text-danger">*</span></label>
                                                 <div class="col-sm-6">
-                                                    <div class="input-group mb-3"> <input type="file"
+                                                    <div class="input-group mb-3"> 
+                                                        <input type="file" class="form-control"
+                                                            id="fileInput" name="file" required
+                                                            >
+<!-- onchange="enableSubmitButton()" -->
+                                                        <!-- <input type="file"
                                                             onchange="$(this).parents('.form-group').next().removeClass('d-none')"
-                                                            class="form-control" id="file" required> </div>
+                                                            class="form-control" id="file" required> 
+                                                        </div> -->
                                                 </div>
                                             </div>
 
-                                            <div class="form-group row mb-3 d-none">
+                                            <div class="form-group row mb-3 ">
                                                 <label for="file" class="col-sm-2 col-form-label"></label>
                                                 <div class="col-sm-6">
-                                                    <button type="submit" class="btn btn-primary">Submit</button>
+                                                    <button type="submit" class="btn btn-primary" id="submitBtn" disabled>Upload</button>
                                                 </div>
                                             </div>
                                         </div>
                                     </form>
+                                    
+                                    <div id="responseMessage" class="mt-3"></div>
+
                                 </div>
                             </div> <!-- /.card -->
                         </div> <!-- /.col -->
@@ -246,6 +262,117 @@
     </script> <!--end::OverlayScrollbars Configure--> <!-- OPTIONAL SCRIPTS --> <!-- apexcharts -->
     <script src="https://cdn.jsdelivr.net/npm/apexcharts@3.37.1/dist/apexcharts.min.js"
         integrity="sha256-+vh8GkaU7C9/wbSLIcwq82tQ2wTf44aOHA8HlBMwRI8=" crossorigin="anonymous"></script>
+    
+    <!-- <script>
+    function enableSubmitButton() {
+        const fileInput = document.getElementById('fileInput');
+        const submitBtn = document.getElementById('submitBtn');
+
+        if (fileInput.files.length > 0) {
+            submitBtn.disabled = false;
+        } else {
+            submitBtn.disabled = true;
+        }
+    }
+    </script> -->
+
+    <script>
+document.addEventListener('DOMContentLoaded', function () {
+    const form = document.getElementById('uploadForm');
+    const fileInput = document.getElementById('fileInput');
+    const submitBtn = document.getElementById('submitBtn');
+    const responseDiv = document.getElementById('responseMessage');
+
+    // Enable submit button when file is selected
+    fileInput.addEventListener('change', function () {
+        submitBtn.disabled = fileInput.files.length === 0;
+    });
+
+    // Handle form submission
+    form.addEventListener('submit', function (e) {
+        e.preventDefault();
+
+        // Disable button during upload
+        submitBtn.disabled = true;
+        submitBtn.textContent = 'Uploading...';
+
+        const formData = new FormData(form);
+
+        fetch('/core/api/upload-rules/', {
+            method: 'POST',
+            body: formData,
+            headers: {
+                'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
+            }
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.success) {
+                responseDiv.innerHTML = `<div class="alert alert-success">✅ ${data.message}</div>`;
+                fileInput.value = ''; // Clear file input
+                submitBtn.disabled = true; // Keep disabled until new file selected
+            } else {
+                responseDiv.innerHTML = `<div class="alert alert-danger">❌ ${data.error}</div>`;
+                submitBtn.disabled = false;
+            }
+        })
+        .catch(error => {
+            responseDiv.innerHTML = `<div class="alert alert-danger">❌ Upload failed: ${error}</div>`;
+            submitBtn.disabled = false;
+        })
+        .finally(() => {
+            submitBtn.textContent = 'Upload';
+
+            // Remove message after 5 seconds
+            setTimeout(() => {
+                responseDiv.innerHTML = '';
+            }, 5000);
+        });
+    });
+});
+</script>
+
+    <!-- <script>
+        function enableSubmitButton() {
+            const fileInput = document.getElementById('fileInput');
+            const submitBtn = document.getElementById('submitBtn');
+            submitBtn.disabled = fileInput.files.length === 0;
+        }
+        
+        document.addEventListener('DOMContentLoaded', function () {
+            
+            const form = document.getElementById('uploadForm');
+
+            form.addEventListener('submit', function(e) {
+            e.preventDefault(); // prevent default form submission
+
+            const form = e.target;
+            const formData = new FormData(form);
+            const responseDiv = document.getElementById('responseMessage');
+
+            fetch('/core/api/upload-rules/', {
+                method: 'POST',
+                body: formData,
+                headers: {
+                    'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
+                }
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    responseDiv.innerHTML = `<div class="alert alert-success">✅ ${data.message}</div>`;
+                } else {
+                    responseDiv.innerHTML = `<div class="alert alert-danger">❌ ${data.error}</div>`;
+                }
+            })
+            .catch(error => {
+                responseDiv.innerHTML = `<div class="alert alert-danger">❌ Upload failed: ${error}</div>`;
+            });
+        });
+                
+        });
+
+        </script> -->
 
 </body><!--end::Body-->
 

content_quality_tool_public/views.py

@@ -11,6 +11,8 @@ from django.utils import timezone
 from django.views.decorators.csrf import csrf_exempt
 from django.conf import settings
 
+from django.core.files.storage import FileSystemStorage
+
 import os
 import json
 
@@ -75,6 +77,18 @@ def logout_view(request):
 
 
 # index page
+
+# @login_required
+# def upload(request):
+#     if request.method == 'POST' and request.FILES.get('file'):
+#         uploaded_file = request.FILES['file']
+#         fs = FileSystemStorage()
+#         filename = fs.save(uploaded_file.name, uploaded_file)
+#         file_url = fs.url(filename)
+#         return render(request, 'index.html', {'file_url': file_url, 'success': True})
+#     return render(request, 'index.html')
+
+
 @login_required
 def upload(request):
     return render(request, 'index.html')