如何在Ajax加載的表單上激活django form.media JavaScript？

Question

我在這里有一個小問題：
由於窗口小部件，我有一個包含一些媒體的表單。
當表單是頁面的一部分時，一切都會按預期工作，但是如果我想使用ajax調用 （例如，以模態） 加載該表單 ，即使js腳本包含在表單中， 它也不會運行 。 另一方面， CSS工作得很好 。

我猜想這與javascript無法檢測到新腳本標簽有關 。

我需要做什么來運行此js？

代碼示例：

模態表單模板：

{{form.media}}
{% crispy form %}
<a class="close-reveal-modal">&#215;</a>

模態內渲染的模板：

<div id="level-modal" class="reveal-modal" data-reveal="">
  <link href="/static/ajax_upload/css/ajax-upload-widget.css" type="text/css" media="all" rel="stylesheet">
  <script type="text/javascript" src="/static/ajax_upload/js/jquery.iframe-transport.js"></script>
  <script type="text/javascript" src="/static/ajax_upload/js/ajax-upload-widget.js"></script>
  <form id="level-form" class="foundation-form" method="post" enctype="multipart/form-data"></form>
  <a class="close-reveal-modal">×</a>
</div>

Answer 1

經過一番研究，我終於找到了啟用加載的javascript文件的正確方法。
請注意， jquery是必需的 。
這是一個簡單的$.ajax({{dataType: "script", cache: true, url: "url/file.js"}})

當我談論form.media時，您可以執行以下操作來檢索表單所需的所有腳本：

files_url = []
for js in form.media._js: # for all the scripts used by the form
    files_url.append(form.media.absolute_path(js)) # we retrieve their url

當我使用dajax啟用腳本時，我可以簡單地調用dajax.script來啟用腳本：

loaders = []
for js in level_form.media._js:
    loaders.append('$.ajax({{dataType: "script", cache: true, url: "{0}"}})'.format(level_form.media.absolute_path(js)))

dajax.script("""
    $.when(
        {0}
    ).done(function() {{
        console.log("scripts are loaded !");
        // do something here when files are loaded
    }}).fail(function () {{ 
        alert("An error occured, try reloading the page.");
        // do something here if loading failed
    }});""".format(",\n".join(loaders)))

謹防 ！ 您需要在settings.py中添加DAJAXICE_XMLHTTPREQUEST_JS_IMPORT = False ， 有關詳細信息 ，請參見本主題 。