Мобильная версияHi Im trying to change some parts from a existung project.
The existing project is is from Github here: https://github.com/AliBigdeli/Django-Sm ... s-Control/
I added in Card management one new field in models.py
class UIDCard(models.Model): ... ammount = models.DecimalField(max_digits=8, decimal_places=2, default=0) ... Also added in the folder dashboard/api/serializers.py the price in class CardReaderSerializer
Now I changed some parts in templates/card-management.html
- Added the field "ammount" in the genral overview, is showing me the Database value
- Added a Pay button, open a new Modal window, the plan is to add some money on it. The enterred value is saving on the Database, but with two issues.
first, I cant see the existing values from the Database in the formfields prefilled. Like in the edit part second, the Update button is saving the value but the modal window is not closing
I cant find the problems in the code, can somewhre helping me please
The complete changed .html file:
{% extends 'dashboard/base.html'%} {% block content %} Cards Add Card ID # Name Card ID Ammount Gateway Access Actions Create Form Name: Card ID: Ammount: Gateway Access Authorized UnAuthorized Close Create Create Form Name: Card ID: Ammount: Gateway Access Authorized UnAuthorized Close Update Pay Form Name: Card ID: Ammount: Gateway Access Authorized UnAuthorized Close Update {% endblock content %} {% block extra_js %} var host_url = location.protocol + '//' + location.host var main_url = new URL(host_url + "/dashboard/api/card-id/") var general_id function fetchGatewayData(){ let wrapper = $('.GatewaySelect') $.get("/dashboard/api/card-reader/", // url function (data, textStatus, jqXHR) { results_data = data wrapper.empty() results_data.forEach(function (item, i) { // for (post of data.results) { wrapper.append(`${item.name}`) } ) }) } function fetchData(url) { let wrapper = $('#table-item-wrapper') $.get(url, // url function (data, textStatus, jqXHR) { results_data = data wrapper.empty() results_data.forEach(function (item, i) { // for (post of data.results) { wrapper.append(` ${i += 1} ${item.name} ${item.card_id} ${item.ammount} € ${item.gateway.name} ${item.access.name} Pay Edit Delete `) } ) }) } $("#create-form").submit(function (e) { e.preventDefault() // console.log(this.job_title.value) // console.log('sent') formData = new FormData(); formData.append('name', this.name.value) formData.append('gateway', this.gateway.value) formData.append('card_id', this.card_id.value) formData.append('ammount', this.ammount.value) formData.append('access', this.access.value) $.ajax({ // contentType: "multipart/form-data", headers: { 'X-CSRFToken': csrftoken, }, type: 'POST', processData: false, contentType: false, data: formData, url: "/dashboard/api/card-id/", success: function (data) { fetchData(main_url) $('#create-form').trigger("reset"); $("#CreateFormModal").modal('hide'); }, failure: function (response) { alert(response) } }); }); $("#edit-form").submit(function (e) { e.preventDefault() formData = new FormData(); formData.append('name', this.name.value) formData.append('gateway', this.gateway.value) formData.append('ammount', this.ammount.value) formData.append('card_id', this.card_id.value) formData.append('access', this.access.value) let id = general_id $.ajax({ // contentType: "multipart/form-data", headers: { 'X-CSRFToken': csrftoken, }, type: 'PATCH', processData: false, contentType: false, data: formData, url: `/dashboard/api/card-id/${id}/`, success: function (data) { fetchData(main_url) $('#edit-form').trigger("reset"); $("#EditFormModal").modal('hide'); }, failure: function (response) { alert(response) } }); }); $("#pay-form").submit(function (f) { f.preventDefault() formData = new FormData(); formData.append('name', this.name.value) formData.append('gateway', this.gateway.value) formData.append('ammount', this.ammount.value) formData.append('card_id', this.card_id.value) formData.append('access', this.access.value) let id = general_id $.ajax({ // contentType: "multipart/form-data", headers: { 'X-CSRFToken': csrftoken, }, type: 'PATCH', processData: false, contentType: false, data: formData, url: `/dashboard/api/card-id/${id}/`, success: function (data) { fetchData(main_url) $('#pay-form').trigger("reset"); $("#PayFormModal").modal('hide'); }, failure: function (response) { alert(response) } }); }); function openEditModal(id) { $("#EditFormModal").modal('show'); general_id = id modal = document.getElementById("EditFormModal") let result_data $.get(`/dashboard/api/card-id/${id}/`, function (data, textStatus, jqXHR) { result_data = data // console.log(result_data.text) }).then(function () { console.log(result_data) $('#FormModalName').val(result_data.name) $('#FormModalCardID').val(result_data.card_id) $('#FormModalAmmount').val(result_data.ammount) $('#FormModalGateway').val(result_data.gateway.id) $('#FormModalAccess').val(result_data.access.id) }) } function openPayModal(id) { $("#PayFormModal").modal('show'); general_id = id modal = document.getElementById("PayFormModal") let result_data $.get(`/dashboard/api/card-id/${id}/`, function (data, textStatus, jqXHR) { result_data = data // console.log(result_data.text) }).then(function () { console.log(result_data) $('#FormModalName').val(result_data.name) $('#FormModalCardID').val(result_data.card_id) $('#FormModalAmmount').val(result_data.ammount) $('#FormModalGateway').val(result_data.gateway.id) $('#FormModalAccess').val(result_data.access.id) }) } function removeItem(id) { if (confirm(`Are you sure you want to remove this ${id} id?`)) { $.ajax({ // contentType: "multipart/form-data", headers: { 'X-CSRFToken': csrftoken, }, type: 'DELETE', processData: false, contentType: false, url: `/dashboard/api/card-id/${id}/`, success: function (data) { fetchData(main_url) }, failure: function (response) { alert(response) }, error: function (xhr, status, error) { alert(error); } }); } else { } } window.addEventListener('DOMContentLoaded', event => { url = main_url fetchData(url) fetchGatewayData() // fetchJobTitles() }); {% endblock extra_js %} In console log, the fields are visible with the Values. BUt not in the modal prefilled
Источник: https://stackoverflow.com/questions/780 ... th-preview
