了解Django / REST / JS代码功能

时间:2019-06-05 18:09:34

标签: javascript html django

我的网站上有以下代码:

<tr onclick="editUsers(29)" data-id="29">

editUsers:

function editUsers(id) {
  loadUsers(false, id, showUsers, true);
}

loadUsers:

  function loadUsers(insert, id, func_call, html_form) {
  var data = insert ? {insert: true} : {}
  if (html_form)
    data.html_form = true;
    $.ajax({
             type: 'GET',
             url:  '/rest/user/' + id + '/',
             data: data
           })
      .done(function (data) {
        func_call(data, insert, id);
      })
      .fail(function () {
      });
}

当我单击该行时,它应该打开一个界面来编辑所选的行/用户,但是什么也没有发生。我确实在控制台中得到了答复,看起来应该可以,但没有。有人可以解释为什么它不起作用吗? 有问题的答复:"GET /rest/user/29/?html_form=true HTTP/1.1" 200 3170

我在代码的其他地方具有相同的功能,这增加了一个新用户:

function addUsers() {
  loadUsers(true, 0, showUsers, true);
}
<div class="btn btn-primary pull-right" onclick="addUsers()">Add User</div>

以上操作无效,编辑用户也无效。

编辑:showUsers函数

function showUsers(data, insert, id) {
  var form = $(data),
      $a= form.find('select[name="a"]'),
      $b= form.find('select[name="b"]');
  $a.on("change", function (e) { $b.val($a.val()).trigger('change'); });
  var p    = {
    type:     BootstrapDialog.TYPE_PRIMARY,
    title:    '{% trans "Add User" %}',
    message:  form,
    closable: true,
    cssClass: 'usersDialog',
    buttons:  [
      {
        label:  gettext('Cancel'),
        hotkey: 27,
        action: function (dlg) { dlg.close(); }
      },
      {
        label:    gettext('Save'),
        cssClass: 'btn-primary',
        action:   function (dlg) {
          var data       = form.find('#users-form').serializeForm();
          dlg.close();

          var storeData = function storeData(data) {
            data.html_form = true;
            $.ajax({
                     type:     data.id == '' ? 'POST' : 'PUT',
                     url:      '/rest/user/' + (data.id == '' ? '' : data.id + '/'),
                     data:     data,
                     dataType: 'json',
                     headers:  {'X-CSRFToken': '{{ csrf_token }}'}
                   })
              .done(function (res) {
                //self.updDeviceFields(res);
                if (conflictDialogs.length > 0)
                  storeData(conflictDialogs.pop());
                else
                  location.reload();
                //$.dreamAlert({type: 'success', message: gettext('Changes saved'), position: 'right'});
              }).fail(function (jqXHR, textStatus, errorThrown) {
              console.log([jqXHR.status, jqXHR, textStatus, errorThrown]);
              if (jqXHR.status == 400) {
                p.message = $(jqXHR.responseText);
                form      = p.message;
                currentForm = form;
                currentDialog = BootstrapDialog.show(p);
              }
              else if (jqXHR.status == 500) {
                currentDialog = BootstrapDialog.show(p);
              }
              //$.dreamAlert({type: 'error', message: gettext('Error saving changes'), position: 'right'});
            });
          }
          storeData(data);
        }
      }
    ]
  }
  if (conflictDialogs.length > 0) {
    p.animate = false;
    p.cssClass += ' flip';
  }
  currentDialog = BootstrapDialog.show(p);
  currentForm = form;
}

1 个答案:

答案 0 :(得分:0)

当我深入研究代码时,我发现了这一点。原来我有一个语法错误,编写代码时完全错过了。

从另一个页面复制粘贴代码时,我也复制了变量名。我的HTML看起来像这样:

<div class="row">
  <div class="col-xs-6">{% render_field foo_form.one bar_style %}</div>
  <div class="col-xs-6">{% render_field foo_form.two bar_style %}</div>
</div>

它应该看起来像这样:

<div class="row">
  <div class="col-xs-6">{% render_field foo_form.one foo_style %}</div>
  <div class="col-xs-6">{% render_field foo_form.two foo_style %}</div>
</div>

我没有看到重要性样式,因为它被定义为空列表,所以我完全错过了错误。