【问题标题】:Updating records within a modal在模式中更新记录
【发布时间】:2021-08-03 09:21:28
【问题描述】:

我们已经完成了一个使用 Bootstrap Modals 创建前端管理仪表板的项目。

当我们从 ASP 模式更新记录时,我们使用 JSON 输出和 JQuery 来填充表单中的数据,因为我们发现这不能仅由 Django 完成。

我们遇到的问题是我们可以使用填充的 JSON 数据添加新记录,但我无法编辑现有记录。即使 JQUERY 和 JSON 在我们点击提交时带来了正确的数据,它也无法关联到数据库中的记录。

我们如何更新正确的记录?

我们尝试的另一种方法是通过 URL 传递 ID(与预订相关),但这会一直重定向页面而不是停留在模式上。

我就不多说了,下面是问题的相关代码。

我不擅长编程,所以希望这对我们正在努力实现的目标有所帮助,在此先感谢我们在此问题上可以获得的任何帮助。

查看代码

class admin_booking(View):
def get(self, request):

    # check whether the user is logged in.
    context = initialize_context(request)
    token = get_token(request)
    session = request.session
    if session.get('user') == None:
        return redirect('vistours:signin')

    # get the model data.
    asp_data = ASPBookings.objects.all()
    bfbw_data = BFBWBookings.objects.all()
    tour_data = SchoolTourBookings.objects.all()
    ath_data = Athlete.objects.all()

    # add the model data to a context dictionary
    context = {
        'asp_bookings': asp_data,
        'bfbw_bookings': bfbw_data,
        'tour_bookings': tour_data,
        'ath_data':ath_data,
        'ath_form': AthleteForm(),
        'asp_form': ASPBookingsForm(),
    }

    # Serialise the data to JSON output file.
    with open("vistours/static/vistours/json/asp.json", "w") as out:
        json_serializer = serializers.get_serializer('json')()
        json_serializer.serialize(asp_data, stream=out, indent=4)

    with open("vistours/static/vistours/json/bfbw.json", "w") as out:
        json_serializer = serializers.get_serializer('json')()
        json_serializer.serialize(bfbw_data, stream=out, indent=4)

    with open("vistours/static/vistours/json/tours.json", "w") as out:
        json_serializer = serializers.get_serializer('json')()
        json_serializer.serialize(tour_data, stream=out, indent=4)

    return render(request, 'vistours/admin_bookings.html', context)

    # post athlete data Modal.
def post(self, request):
    if request.method == 'POST':
        form = AthleteForm(request.POST)
        print(request.POST)
        if form.is_valid():
            form.save()
        else:
            print(form.errors)
            form()
        return redirect('vistours:admin_booking')    

    # Update ASP Modal.
def post(self, request, id):
        if request.method == 'POST':
            asp_id = request.POST.get('booking_ref')
            asp_data = ASPBookings.objects.filter(id=id)
            print(asp_id)
            print(asp_data)
            form = ASPBookingsForm(request.POST)
            form.save()
        else:
            print(form.errors)
        return redirect('vistours:admin_booking')

网址

path('admin_bookings/all/', views.admin_booking.as_view(), name='admin_booking'),
path('admin_bookings/confirmed/', views.admin_booking_confirmed.as_view(), name='admin_booking_confirmed'),
path('admin_bookings/tbc/', views.admin_booking_tbc.as_view(), name='admin_booking_tbc'),
path('admin_bookings/completed/', views.admin_booking_completed.as_view(), name='admin_booking_completed'),
path('admin_bookings/cancelled/', views.admin_booking_cancelled.as_view(), name='admin_booking_cancelled'),

型号

class ASPBookings(models.Model):

# Select/Choice field value lookups ('Database', 'HTML').

presentation_form_options = (
    ('Face to Face', 'Face to Face'),
    ('Virtual', 'Virtual'),
)
organisation_types = (
    ('Government School', 'Government School'),
    ('Community Organisation', 'Community Organisation'),
    ('Non-Government School', 'Non-Government School'),
    ('Other', 'Other')
)

regions = (
    ('Metro', 'Metro'),
    ('Regional', 'Regional')
)

statuses = (
    ('TBC', 'TBC'),
    ('Confirmed', 'Confirmed'),
    ('Completed', 'Completed'),
    ('Cancelled', 'Cancelled')

)

booking_times = [
    ('0900', '0900'),
    ('0915', '0930'),
    ('0930', '0900'),
    ('0945', '0945'),
    ('1000', '1000'),
    ('1015', '1030'),
    ('1030', '1000'),
    ('1045', '1045'),
    ('1100', '1100'),
    ('1115', '1130'),
    ('1130', '1100'),
    ('1145', '1145'),
    ('1200', '1200'),
    ('1215', '1230'),
    ('1230', '1200'),
    ('1245', '1245'),
    ('1300', '1300'),
    ('1315', '1330'),
    ('1330', '1300'),
    ('1345', '1345'),
    ('1400', '1400'),
    ('1415', '1430'),
    ('1430', '1400'),
    ('1445', '1445'),
    ('1500', '1500'),
]

durations = [
    ('0.5', '0.5'),
    ('1.0', '1.0'),
    ('1.5', '1.5'),
    ('2.0', '2.0'),
    ('2.5', '2.5'),
    ('3.0', '3.0'),
]

booking_ref = models.CharField(max_length=10, default=1)
program_type = models.CharField(max_length=120)
booking_date = models.DateField()
booking_time = models.CharField(max_length=10, choices=booking_times, default='0700')
duration = models.CharField(max_length=10, choices=durations, default='0.5')
street = models.CharField(max_length=120)
suburb = models.CharField(max_length=120)
region = models.CharField(max_length=120, choices=regions, default='Metro')
post_code = models.CharField(max_length=40)
organisation_type = models.CharField(max_length=120,choices=organisation_types, default='Government School')
audience_number = models.CharField(max_length=10)
presentation_form = models.CharField(max_length=120, choices=presentation_form_options, default='Face to Face')
contact_name = models.CharField(max_length=80)
email = models.EmailField()
phone_number = models.CharField(max_length=120)
comments = models.TextField()
status = models.CharField(max_length=80, choices=statuses, default='TBC')
athlete = models.ForeignKey(Athlete, default= '1', on_delete=models.CASCADE)

def __str__(self):
    return self.contact_name

# return URL after the POST has been submitted.
def get_absolute_url(self):
    return reverse('success')

表格

class ASPBookingsForm(forms.ModelForm):

class Meta():
    model = ASPBookings
    # Inclusion / Exclusion of fields within the Form view.
    fields = '__all__'
    exclude = ['athlete', 'status']
    # Widgets add Bootstrap and CCS classes to Django inputs.
    widgets = {
        'booking_ref': TextInput(attrs={'id':'asp_booking_ref', 'name': 'asp_booking_ref'}),
        'program_type': TextInput(attrs={'id': 'asp_prev_program', 'name': 'prev_program'}),
        'booking_date': TextInput(attrs={'type':'date', 'class': 'form-control', 'id': 'asp_prev_date', 'name': 'prev_date'}),
        'booking_time': Select(attrs={'class':'form-select','id': 'asp_prev_time', 'name': 'prev_time'}),
        'duration': Select(attrs={'class': 'form-select','id': 'asp_prev_duration', 'name': 'prev_duration'}),
        'street': TextInput(attrs={'class': 'form-control', 'id': 'asp_street', 'name': 'street', 'placeholder': 'Flinders Street'}),
        'suburb': TextInput(attrs={'class': 'form-control', 'id': 'asp_suburb', 'name': 'suburb', 'placeholder': 'Albert Park'}),
        'post_code': NumberInput(attrs={'class': 'form-control', 'id': 'asp_postcode', 'name': 'postcode', 'placeholder': '3000'}),
        'region': Select(attrs={'class': 'form-select', 'id': 'asp_region', 'asp_name': 'region', 'placeholder': 'region'}),
        'organisation_type': Select(attrs={'class': 'form-select', 'id': 'asp_org_type', 'name': 'org_type', 'placeholder': 'Organisation Type'}),
        'audience_number': TextInput(attrs={'class': 'form-control', 'id': 'asp_audience_number', 'name': 'audience', 'placeholder': '0-999'}),
        'presentation_form': Select(attrs={'class': 'form-select', 'id': 'asp_presentation_form', 'name': 'presentation_form'}),
        'contact_name': TextInput(attrs={'class': 'form-control', 'id': 'asp_contact_name', 'name': 'contact_name', 'placeholder': 'John Doe'}),
        'email': TextInput(attrs={'class': 'form-control', 'id': 'asp_email', 'name': 'email', 'placeholder': 'name@example.com'}),
        'phone_number': TextInput(attrs={'class': 'form-control', 'id': 'asp_phone', 'name': 'phone', 'placeholder': '0400 000 000', 'pattern': '^((\+61\s?)?(\((0|02|03|04|07|08)\))?)?\s?\d{1,4}\s?\d{1,4}\s?\d{0,4}$'}),
        'comments': Textarea(attrs={'class': 'form-control', 'id': 'asp_comments', 'name': 'comments'}),
    }

HTML

   <tbody>
            {% for booking in asp_bookings %}
            <tr>
              <td>{{booking.id}}</td>
              <td>{{booking.program_type}}</td>
              <td>{{booking.booking_date}}</td>
              <td>{{booking.booking_time}}</td>
              <td>{{booking.duration}}</td>
              <td>{{booking.organisation_type}}</td>
              <td>{{booking.contact_name}}</td>
              <td>
                <p class="table_tag">{{booking.athlete.athlete_name}}</p>
                <a href="#">
                  <i data-bs-toggle="modal" data-bs-target="#assign_athlete_modal" class="fa fa-user-times table_icons mx-1">
                  </i>
                </a>
              </td>
              <td>
                {% if booking.status == "TBC"%}
                <span class="badge rounded-pill bg-success table_tag">{{booking.status}}</span>
                {% elif booking.status == "Confirmed"%}
                <span class="badge rounded-pill bg-primary table_tag">{{booking.status}}</span>
                {% elif booking.status == "Cancelled"%}
                <span class="badge rounded-pill bg-danger table_tag">{{booking.status}}</span>
                {% else %}
                <span class="badge rounded-pill bg-secondary table_tag">{{booking.status}}</span>
                {% endif %}
                {% if booking.program_type == "asp" %}
                <a href="#"><i data-bs-toggle="modal" data-bs-target="#edit_asp_modal" class="fa fa-pencil table_icons mx-1" data-vis-ref="{{booking.id}}" data-vis-program="{{booking.program_type}}"></i></a>
                {% elif booking.program_type == "bfbw" %}
                <a href="#"><i data-bs-toggle="modal" data-bs-target="#edit_bfbw_modal" class="fa fa-pencil table_icons mx-1" data-vis-ref="{{booking.id}}" data-vis-program="{{booking.program_type}}"></i></a>
                {% elif booking.program_type == "tours" %}
                <a href="#"><i data-bs-toggle="modal" data-bs-target="#edit_tours_modal" class="fa fa-pencil table_icons mx-1" data-vis-ref="{{booking.id}}" data-vis-program="{{booking.program_type}}"></i></a>
                {% endif %}
                {% if booking.status == "Confirmed" %}
                <a class="fa-disabled-admin-icons" href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
                <a href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
                {% elif booking.status == "Cancelled" %}
                <a href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
                <a class="fa-disabled-admin-icons" href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
                {% elif booking.status == "Completed" %}
                <a class="fa-disabled-admin-icons" href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
                <a href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
                {% else %}
                <a href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
                <a href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
                {% endif %}

              </td>

 <!-- EDIT ASP Modal -->
  <form method="post" id="edit_asp_form">
    {% csrf_token %}
    {{ form.non_field_errors }}

    {{ form.source.errors }}
    {{ form.source }}
    <div class="modal fade" id="edit_asp_modal" tabindex="-1" aria-hidden="true">
      <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
        <div class="modal-content">
          <div class="modal-header card-header">
            <h5 class="modal-title"><i class="fa fa-pencil mx-1"></i> Edit ASP Booking Details</h5>
            <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div class="card text-dark bg-light mb-3">
              <div class="card-body">
                <div class="form-floating mb-3">
                  {{asp_form.street}}
                  <!-- <input type="text" required class="form-control" id="asp_edit_street" name="asp_edit_street" placeholder="Flinders Street"> -->
                  <label for="asp_edit_street">Street</label>
                </div>
                <div class="form-floating mb-3">
                  {{asp_form.suburb}}
                  <!-- <input type="text" required class="form-control" id="asp_edit_suburb" name="asp_edit_suburb" placeholder="Albert Park"> -->
                  <label for="asp_edit_suburb">Suburb</label>
                </div>
                <div class="form-floating mb-3">
                  {{asp_form.post_code}}
                <!-- <input required oninput="this.value =
                !!this.value && Math.abs(this.value) >= 0 ? Math.abs(this.value) : null;if(this.value<0){this.value= this.value =0} else if(this.value>9999){this.value= this.value =9999}
                " type="number" min="0" max="9999" class="form-control" name="asp_edit_postcode" id="asp_edit_postcode" placeholder="0 - 9999"> -->
                <label for="asp_edit_postcode">Post Code</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.audience_number}}
                <!-- <input required oninput="this.value =
                !!this.value && Math.abs(this.value) >= 0 ? Math.abs(this.value) : null;if(this.value<0){this.value= this.value =0} else if(this.value>9999){this.value= this.value =9999}
                " type="number" min="0" max="9999" class="form-control" name="asp_edit_audience_number" id="asp_edit_audience_number" placeholder="0 - 9999"> -->
                <label for="asp_edit_audience_number">Audience Number</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.region}}
                <!-- <select class="form-select" id="asp_edit_region" name="asp_edit_region">
                  <option value="1">Metro</option>
                  <option value="2" selected>Suburb</option>
                </select> -->
                <label for="asp_edit_region">Region</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.organisation_type}}
                <!-- <select class="form-select" id="asp_edit_org_type" name="asp_edit_org_type">
                  <option value="1">Community organisation</option>
                  <option value="2">Corporation</option>
                  <option value="3" selected>Government school</option>
                  <option value="4">Non-Government school</option>
                  <option value="5">Other</option>
                </select> -->
                <label for="asp_edit_org_type">Organisation Type</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.duration}}
                <!-- <select  class="form-select" id="asp_edit_session_length" name="asp_edit_session_length">
                  <option value="1">0.5 Hr</option>
                  <option value="2">1.0 Hr</option>
                  <option value="3">1.5 Hr</option>
                  <option value="4">2.0 Hr</option>
                  <option value="5">2.5 Hr</option>
                  <option value="6">3.0 Hr</option>
                </select> -->
                <label for="asp_edit_session_length">Session Length</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.booking_time}}
                <!-- <select class="form-select" id="asp_edit_time" name="asp_edit_time">
                  <option selected value="0700">07:00 AM</option>
                  <option value="0715">07:15 AM</option>
                  <option value="0730">07:30 AM</option>
                  <option value="0745">07:45 AM</option>
                  <option value="0800">08:00 AM</option>
                  <option value="0815">08:15 AM</option>
                  <option value="0830">08:30 AM</option>
                  <option value="0845">08:45 AM</option>
                  <option value="0900">09:00 AM</option>
                  <option value="0915">09:15 AM</option>
                  <option value="0930">09:30 AM</option>
                  <option value="0945">09:45 AM</option>
                  <option value="1000">10:00 AM</option>
                  <option value="1015">10:15 AM</option>
                  <option value="1030">10:30 AM</option>
                  <option value="1045">10:45 AM</option>
                  <option value="1100">11:00 AM</option>
                  <option value="1115">11:15 AM</option>
                  <option value="1130">11:30 AM</option>
                  <option value="1145">11:45 AM</option>
                  <option value="1200">12:00 Noon</option>
                  <option value="1215">12:15 PM</option>
                  <option value="1230">12:30 PM</option>
                  <option value="1245">12:45 PM</option>
                  <option value="1300">01:00 PM</option>
                  <option value="1315">01:15 PM</option>
                  <option value="1330">01:30 PM</option>
                  <option value="1345">01:45 PM</option>
                  <option value="1400">02:00 PM</option>
                  <option value="1415">02:15 PM</option>
                  <option value="1430">02:30 PM</option>
                  <option value="1445">02:45 PM</option>
                  <option value="1500">03:00 PM</option>
                  <option value="1515">03:15 PM</option>
                  <option value="1530">03:30 PM</option>
                  <option value="1545">03:45 PM</option>
                  <option value="1600">04:00 PM</option>
                  <option value="1615">04:15 PM</option>
                  <option value="1630">04:30 PM</option>
                  <option value="1645">04:45 PM</option>
                  <option value="1700">05:00 PM</option>
                  <option value="1715">05:15 PM</option>
                  <option value="1730">05:30 PM</option>
                  <option value="1745">05:45 PM</option>
                  <option value="1800">06:00 PM</option>
                  <option value="1815">06:15 PM</option>
                  <option value="1830">06:30 PM</option>
                  <option value="1845">06:45 PM</option>
                  <option value="1900">07:00 PM</option>
                </select> -->
                <label for="asp_edit_time">From 07:00 AM to 07:00 PM</label>
              </div>
              <div class="form-floating">
                {{asp_form.booking_date}}
                <!-- <input required type="date" class="form-control" id="asp_edit_date" name="asp_edit_date"> -->
                <label for="asp_edit_date">Date</label>
              </div>
            </div>
          </div>
          <div class="card text-dark bg-light mb-3">
            <div class="card-body">
              <div class="form-floating mb-3">
                {{asp_form.presentation_form}}
                <!-- <select class="form-select" id="asp_edit_presentation_form" name="asp_edit_presentation_form">
                  <option value="1" selected>Face-to-Face</option>
                  <option value="2">Virtual</option>
                </select> -->
                <label for="asp_edit_presentation_form">Preferred Presentation Form</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.contact_name}}
                <!-- <input required type="text" class="form-control" id="asp_edit_contact_name" name="asp_edit_contact_name" placeholder="John Doe"> -->
                <label for="asp_edit_contact_name">Contact Name</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.email}}
                <!-- <input required type="email" class="form-control" id="asp_edit_email" name="asp_edit_email" placeholder="name@example.com"> -->
                <label for="asp_edit_email">Email</label>
              </div>
              <div class="form-floating mb-3">
                {{asp_form.phone_number}}
                <!-- <input pattern="^((\+61\s?)?(\((0|02|03|04|07|08)\))?)?\s?\d{1,4}\s?\d{1,4}\s?\d{0,4}$" required type="text" class="form-control" id="asp_edit_phone" name="asp_edit_phone" placeholder="0400 000 000"> -->
                <label for="asp_edit_phone">Phone</label>
              </div>
              <div class="form-floating">
                {{asp_form.comments}}
                <!-- <textarea required class="form-control" placeholder="Leave a comment here" name="asp_edit_comments" id="asp_edit_comments" maxlength="500"></textarea> -->
                <label for="asp_edit_comments">Speaker Brief</label>
              </div>
            </div>
          </div>
        </div>
        {{asp_form.program_type}}
        {{asp_form.booking_ref}}
        
        <!-- <input type="text" name="asp_edit_program" id="asp_prev_program" hidden="hidden" style="visibility: hidden;"> -->
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
          <button type="submit" class="btn btn-primary" name="save_edit_asp">Save Changes</button>
        </div>
      </div>
    </div>
  </div>
</form>
<!-- END EDIT ASP Modal -->

【问题讨论】:

    标签: json django django-views django-forms bootstrap-modal


    【解决方案1】:

    以防万一这可以帮助其他人,我设法通过将帖子视图更改为下方来修复模式以允许更新。

     def post(self, request):
            if request.method == 'POST':
                booking_id = request.POST.get('booking_ref')
                asp_data = ASPBookings.objects.get(id=booking_id)
                asp_data.street = request.POST['street']
                asp_data.suburb = request.POST['suburb']
                asp_data.post_code = request.POST['post_code']
                asp_data.audience_number = request.POST['audience_number']
                asp_data.region = request.POST['region']
                asp_data.organisation_type = request.POST['organisation_type']
                asp_data.duration = request.POST['duration']
                asp_data.booking_time = request.POST['booking_time']
                asp_data.booking_date = request.POST['booking_date']
                asp_data.presentation_form = request.POST['presentation_form']
                asp_data.contact_name = request.POST['contact_name']
                asp_data.email = request.POST['email']
                asp_data.phone_number = request.POST['phone_number']
                asp_data.comments = request.POST['comments']
                asp_data.save()
            else:
                print(form.errors)
            return redirect('vistours:admin_booking')
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-11-16
      • 1970-01-01
      • 1970-01-01
      • 2014-01-09
      • 1970-01-01
      相关资源
      最近更新 更多