Question

我是javascript和Django的新手，如果我的问题可能很简单，对不起。

我正在使用Django模型表单来呈现我的字段。它在HTML中呈现良好。然后，我决定添加一个select2组件。我想要实现的是使select2组件从API端点获取其数据，如果选择了某个选项，我希望在数据库中获取所选选项的数据，然后替换Django文本框中的值。我通过获取Django呈现的组件的ID，然后使用jquery来选择它们并将其值更改为API调用的结果来做到这一点。

所以这是模型形式：

class ProfileModelForm(ModelForm):
    def __init__(self, *args, **kwargs):
        class Meta:
            model = Profile
            exclude = ['id']

以及以下示例模板摘要：

<div class="row mt-1">
    <div class="col-4 offset-md-4">
        <label for="existing">Search</label><br/>
        <select class="form-control" id="existing">
        <option></option>
        </select>
    </div>
</div>
<hr/>

<div class="row mt-1">
    <div class="col-3">
        <label for="input-first-name">First name</label>
        {% render_field  ProfileModelForm.first_name class+="form-control form-control-sm" placeholder="First name" %}
    </div>
    <div class="col-3">
        <label for="input-middle-name">Middle name</label>
        {% render_field  ProfileModelForm.middle_name class+="form-control form-control-sm" placeholder="Middle name" %}
    </div>
    <div class="col-3">
        <label for="input-last-name">Last name</label>
        {% render_field  ProfileModelForm.last_name class+="form-control form-control-sm" placeholder="Last name" %}
    </div>
    <div class="col-3">
        <label for="input-last-name">Suffix</label>
        {% render_field  ProfileModelForm.suffix class+="form-control form-control-sm" placeholder="Suffix" %}
    </div>
</div>

以下是我对模板所做的操作：

$("#existing").on("select2:select", function(e) {
  data = e.params.data;
  $.ajax({
  url: "/sacrament/profiles/" + data["id"],
  beforeSend: function(xhr) {
  xhr.setRequestHeader("X-CSRFToken", Cookies.get("csrftoken"));
  },
  type: "GET",
  success: function(json) {
      profile = JSON.parse(json)[0]["fields"];
      $("#id_profile-first_name").val(profile["first_name"]);
      $("#id_profile-middle_name").val(profile["middle_name"]);
      $("#id_profile-last_name").val(profile["last_name"]);
      $("#id_profile-suffix").val(profile["suffix"]);
      $("#id_profile-gender").val(profile["gender"]);
      $("#id_profile-birthdate").val(profile["birthdate"]);
      $("#id_profile-birthplace").val(profile["birthplace"]);
      $("#id_profile-residence").val(profile["residence"]);
      $("#profile_ID").val(data["id"]);

      $("#id_profile-first_name").attr("disabled", "disabled");
      $("#id_profile-middle_name").attr("disabled", "disabled");
      $("#id_profile-last_name").attr("disabled", "disabled");
      $("#id_profile-suffix").attr("disabled", "disabled");
      $("#id_profile-gender").attr("disabled", "disabled");
      $("#id_profile-birthdate").attr("disabled", "disabled");
      $("#id_profile-birthplace").attr("disabled", "disabled");
      $("#id_profile-residence").attr("disabled", "disabled");
   },
// handle a non-successful response
   error: function(xhr, errmsg, err) {
  $("#results").html(
    "<div class='alert-box alert radius' data-alert>Oops! We have 
    encountered an error: " +
      errmsg +
      " <a href='#' class='close'>&times;</a></div>"
  ); // add the error to the dom
  console.log(xhr.status + ": " + xhr.responseText); // provide a bit more info about the error to the console
}

}）； }）;

看起来不错，直到我尝试将表单发送为发帖请求为止。用ajax编辑的字段似乎不是request.POST的一部分。我尝试打印模型表格以检查它在哪里损坏。在POST中打印模型表格时，我看不到修改后的模型表格中的任何字段都被发回了。在这种情况下，我是否正确使用了Django和Ajax。

通过AJAX修改字段后，POST请求中未收到Django模型表单

0 个答案: