django窗口弹出窗口与表详细信息

时间:2017-09-29 09:09:43

标签: jquery html mysql django

我想在模板中创建一个按钮,如果我按查看我想要弹出一个弹出窗口,我想在models.py中显示我的表格。

基本上我希望弹出窗口具有所有列名称以及该表格显示的所有日期。如果可能的话,请加以分页。

这是 seaerch_table.html

的一部分
<script>
    $("#mytable").dialog({autoOpen: false});
    $("#opener").click(function () {
        $("#mytable").dialog("open");
    });
</script>

    <table class="table table-bordered sortable table-hover" id="mytable">
        <thead>
        <tr>
            <th>Id</th>
            <th>Title</th>
            <th>Url</th>
            <th>View All Info</th>
        </tr>
        </thead>
        <tbody>
        {% for lists in details %}
            <tr>
                <td>{{ lists.id }}</td>
                <td>{{ lists.title }}</td>
                <td><a href="{{ lists.url }}" target="_blank">{{ lists.url }}</a></td>
                <td>
                    <button id="opener">View</button>
                </td>
            </tr>

        {% endfor %}
        </tbody>
    </table>

它只在模板中显示3个字段...我想在弹出窗口时添加2个字段,其中包括已创建 at和描述< / strong>字段。我不想在弹出窗口上做任何特别的事情......只需显示mysql中的整个表格(包括创建 描述的列)

有人可以帮帮我吗?

谢谢

1 个答案:

答案 0 :(得分:0)

$( function() {
$( "#dialog1" ).dialog({
autoOpen: false,
show: {
  effect: "blind",
  duration: 1000,
  width: "auto", 
  height: "auto",
  position: "left", 

},
hide: {
  effect: "explode",
  duration: 1000,
  width: "auto", 
  height: "auto",
  position: "left",
}
});

$( "#opener1" ).on( "click", function() {
$( "#dialog1" ).dialog( "open" );
});
});

html:

<p id="opener1" style="color:green; margin: 0%">show table</p>
<div id="dialog1" title="Number of entry failed.">
<table class="table table-bordered sortable table-hover" id="mytable">
    <thead>
    <tr>
        <th>Id</th>
        <th>Title</th>
        <th>Url</th>
        <th>View All Info</th>
    </tr>
    </thead>
    <tbody>
    {% for lists in details %}
        <tr>
            <td>{{ lists.id }}</td>
            <td>{{ lists.title }}</td>
            <td><a href="{{ lists.url }}" target="_blank">{{ lists.url }}</a></td>
            <td>
                <button id="opener">View</button>
            </td>
        </tr>

    {% endfor %}
    </tbody>
</table>
 </div>