如何在Django中使用复选框创建这样的表?

时间:2019-02-03 05:02:53

标签: django python-3.x django-models django-forms django-views

我想要一个带有Django的每一行都有一个复选框的表,如图所示。我的Django view.py,models.py和HTML文件如下所述。如何做到这一点? Django中有内置功能吗?

Table with check box

我的模型文件为:

class AppsDescription(db.Model):
    aws_response = aws_list_conf_api_call()

    CHOICES = [("yes", "YES"),
           ("no", "NO")]
    OPTIONS = list()

    for apps in aws_response:
        OPTIONS.append(('{name1}'.format(name1=apps.lower()), '{name2}'.format(name2=apps)), )

    name = db.CharField(max_length=256)
    description = db.TextField()
    plan_to_migrate = db.CharField(choices=CHOICES, max_length=256)
    # app_names = MultiSelectField(choices=OPTIONS)

    def __str__(self):
        return self.name

我的views.py为

def createapp(request):
    # import ipdb; ipdb.set_trace()
    form = DashboardForm()

    if request.method == "POST":
        form = DashboardForm(request.POST)
        list_of_inputs = request.POST.getlist("inputs")

        if form.is_valid:
            form.save(commit=True)
            return HttpResponseRedirect(reverse("aws:createapp"))

    server = aws_server_list_conf()

    return render(request, "createapp.html", {'server':server, 'form': form})

我的html文件为

<form method="POST">
      {{form.as_p}}

      <table>
        <tr>
          <th>Select</th>
          <th>Agent ID</th>
          <th>Configuration ID</th>
          <th>Host Name</th>
          <th>OS Name</th>
          <th>OS Version</th>
          <th>Source</th>
          <th>Time of Creation</th>
          <th>Type</th>
        </tr>

        {% for apps in server %}
        <tr>


          <td><input type="checkbox" name="" value=""></td>

          {% for k,v in apps.items %}

          <td>{{ v }}</td>

          {% endfor %}

        </tr>
        {% endfor %}

      </table>




      {% csrf_token %}
      <input type="submit" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" name="" value="submit">
      <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog">
            <div class="alert alert-success alert-dismissible">
                <a  class="close" data-dismiss="modal" aria-label="close">&times;</a>
                <strong>Success!</strong> App information stored Successfully.
              </div>
        </div>
      </div>

      </form>

我想要一张带有django的表格的复选框,如图所示。

1 个答案:

答案 0 :(得分:3)

您的HTML文件应如下所示:

<form method="POST">
      {{form.as_p}}

      <table>
        <tr>
          <th>Select</th>
          <th>Agent ID</th>
          <th>Configuration ID</th>
          <th>Host Name</th>
          <th>OS Name</th>
          <th>OS Version</th>
          <th>Source</th>
          <th>Time of Creation</th>
          <th>Type</th>
        </tr>

        {% for apps in server %}
        <tr>




          {% for k,v in apps.items %}
          <td><input type="checkbox" name="selected_options" value="v.id"></td>
          <td>{{ v }}</td>

          {% endfor %}

        </tr>
        {% endfor %}

      </table>




      {% csrf_token %}
      <input type="submit" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" name="" value="submit">
      <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog">
            <div class="alert alert-success alert-dismissible">
                <a  class="close" data-dismiss="modal" aria-label="close">&times;</a>
                <strong>Success!</strong> App information stored Successfully.
              </div>
        </div>
      </div>

      </form>