巨蟒python全栈开发-第11阶段 ansible_project3

今日大纲:

1.用户创建

2.前端优化

3.用户编辑

4.用户删除

5.ansible api介绍

1.用户创建

新建一个user_create.html的页面

<form class="form-horizontal" id="createForm" action="" method="post">{% csrf_token %}
  <div class="box-body">
  {% for field in form %}
    <div class="form-group{% if field.errors %} has-error{% endif %}">
        <label class="col-sm-2 control-label">{{ field.label }}
          {% if field.field.required %}
            <span class="text-red">*</span>
          {% endif %}
        </label>
        <div class="col-sm-9">
            {{ field }}
        </div>
        <span class="help-block">
          {% for error in field.errors %}
              {{ error }}
          {% endfor %}
          {{ field.help_text }}
        </span>
    </div>
    {% endfor %}
    <div class="box-footer text-center">
        <button type="reset" class="btn btn-warning">清空</button>
        <button id="createBtn" type="button" class="btn btn-info">提交</button>
        <p class="text-center"><i id='iconWait'></i></p>
    </div>
  </div>
</form>
{% block js %}
<script>
    $("#createBtn").on("click",function () {
        if ("{{ pk }}" == "0") {
            url="{% url 'createuser' %}"
        } else {
            url="{% url 'edituser' pk %}"
        }
        Net.post({
            url:url,
            data:$("#createForm").serialize(),
            go:{% url 'userlist' %}
        })
    })
</script>
{% endblock %}

View Code

里边有一个"清空"按钮和"提交按钮",下边的id="iconWait"代表转圈的那个.

 下面,我们再创建一个py文件user_form.py

 

2.前端优化

3.用户编辑

4.用户删除

5.ansible api介绍