Django

Question

我正在构建一个 Django 应用程序，我尝试以模式 window 显示我的一个表单。它最初是为一个普通的开发的，脚本运行良好，但我无法正确实现模态。
上下文是经典的：window 显示一个对象列表，其中每个对象都有一个用于编辑它的按钮，以及一个用于创建新对象的附加全局按钮。每个按钮都应该打开相同的模式。
如果我没有几个专门用于表单的 js 脚本，它可能会变得很容易，因为它们是我的问题：现在表单处于模态状态时不能正常工作。所以我做错了什么，最后我什至不确定我的方法是最好的。

第一个问题：在我的搜索中，一个想法可能是 js 脚本不会应用于 html 之后更新的部分：是真的吗？在这种情况下，有没有办法制作一种 'reload' 让 js 理解它的范围已经改变？

使用bootstrap显示模态，HTML代码如下：

<div id="grp_detail" class="modal fade hide" role="dialog" tabindex='-1'>
    <div class="modal-dialog modal-lg">
        <div class="modal-content form_content">
            {% include './adm_group_detail.html' %}
        </div>
    </div>
</div>

如果您需要包含的模板，请告诉我 - 它很大，因为表单有点棘手。

显示列表页面的视图如下：

@user_passes_test(lambda u: u.is_superuser or (u.id is not None and u.usercomp.is_admin))
def adm_groups(request, comp_slug):
    '''
        Manage users groups
    '''
    # Variables set to be integrated in locals()
    company = Company.get_company(comp_slug)
    group_list = UserGroup.objects.filter(company__comp_slug=comp_slug, hidden=False).order_by('group_name')

    # Initialize an empty form to create a new group (to be displayed in a modal)
    group_form = GroupDetail()
    group_form.fields['all_users'].queryset = UserComp.objects.\
                                                filter(company=company).\
                                                order_by('user__last_name', 'user__first_name')


    return render(request, "polls/adm_groups.html", locals())

如您所见，我在这个阶段生成了一个空表单，以便在用户打算创建新项目时简化显示。
在这种情况下，模态可以完美地工作。不幸的是，如果我之前编辑过另一个项目，我需要使用脚本来刷新表单；并且，在这种情况下，如您所见，它不起作用。

为了填充表单以编辑对象，通过 js 脚本收集数据：生成表单的脚本如下：

    $('.update-grp').click(function(e) {
        $.ajax({
            method: 'GET',
            url: $(this).attr('url-endpoint'),
            data: {
                comp_slug: $(this).attr('comp-slug'),
                grp_id: $(this).attr('grp-id')
            },
            success: handleSuccess,
            error: handleError,
        });

        function handleSuccess(data) {
            $(".form_content").html(data.group_form);
        };

        function handleError(error_data) {
            console.log("error");
            console.log(error_data);
        };
    })

它调用以下视图：

def get_group_detail(request):
    """ Gather and send information related to groups """

    comp_slug = request.GET["comp_slug"]
    grp_id = int(request.GET["grp_id"])   # comes as string when 0
    company = Company.get_company(comp_slug)

    if grp_id > 0:
        current_group = UserGroup.objects.get(id=grp_id)
        group_form = GroupDetail(instance=current_group)
    else:
        group_form = GroupDetail()
        group_form.fields['all_users'].queryset = UserComp.objects.\
                                                    filter(company=company).\
                                                    order_by('user__last_name', 'user__first_name')

    context = {
        "comp_slug": comp_slug,
        "company": company,
        "grp_id": grp_id,
        "group_form": group_form,
    }

    template = render_to_string('polls/adm_group_detail.html', context=context, request=request)

    return JsonResponse({"group_form": template})

模态显示正确，但与表单相关的脚本根本没有启动（即使是console.log('Hello')也不显示任何东西）。

在我的尝试中，其中之一不仅是生成整个模板，专门用于表单的模板，但结果更糟。

仅供参考，我不知道它是否有帮助，这是带有数据的模态视图：

蓝色按钮用于将元素从一个列表移动到另一个列表，这也可以通过双击来实现。但是在模态中什么也没有发生。

Answer 1

我最近认为是正确的：脚本不适用于更新的 html 代码。要更改此设置，我需要将处理程序附加到不会更改的父对象，然后 'delegate' 附加到应该触发操作的实际对象。

因此，我需要更改模式中按钮的触发方式并替换它，其中处理程序位于按钮本身：

$("#add_selected").on("click", function(e) {

这样，处理程序包含模式，并将事件委托给按钮：

$(".form_content").on("click", '#add_selected', function(e) {

Django - 以模式显示表单

Django - Diplay a form in a modal

javascript

django-forms

bootstrap-modal