从 javascript 文件访问 Webform

Accessing webform from javascript file

本文关键字：Webform 访问 文件 javascript      更新时间：2023-09-26

我正在寻找一种将一些隐藏的表单数据发送到 Django 服务器的方法，只要将 javascript 和 html（template） 保留在同一文件中就可以了，但现在我正在尝试将它们分开。

可能真的很简单，但我想我所要做的就是获取（设置？）窗口/html的"名称"，并从javascript模块访问它？

.HTML：

<html>
<head>
<script src="/media/postIt.js"></script>
</head>
<body>
<form action="" method="post" id="postForm">{% csrf_token %}
<input type="hidden" id="scoreField1" name="score1"></input>    
<input type="hidden" id="scoreFieldSet1" name="score1Set"></input>
<input type="hidden" id="scoreField2" name="score2"></input>
<input type="hidden" id="scoreFieldSet2" name="score2Set"></input>
<input type="hidden" id="scoreField3" name="score3"></input>
<input type="hidden" id="scoreFieldSet3" name="score3Set"></input>
</form>
<table>
<tr>
        <td id="bg1" onclick="postIt('score1')">
            Ones
        </td>   
        <td id="bg1_1">
        </td>
    </tr>
    <tr>
        <td id="bg2" onclick="postIt('score2')">
            Twos
        </td>
        <td id="bg2_1">
         </td>
    </tr>
</table>

Javascript：

    function postIt(x){
var pointArray = [d1,d2,d3,d4,d5];
var totVal = d1+d2+d3+d4+d5;
pointArray.sort(function(a,b){return a-b});
alert(pointArray);
alert("total value: " + totVal);    
if(x == "score2"){
    if("{{ res.score2Set }}" == 0){     
            var form = document.getElementById('postForm');
            document.getElementById('scoreField1').value = score1;
            document.getElementById('scoreFieldSet1').value = score1Set;
            document.getElementById('scoreField2').value = score;
            document.getElementById('scoreFieldSet2').value = 1;
            document.getElementById('scoreField3').value = score3;
            document.getElementById('scoreFieldSet3').value = score3Set;
            form.submit();

    }       
}

编辑：澄清：我无法通过调用 document.getElement 来访问 html "文档"中的元素...因为它们现在在不同的文档中（物理上..）。我想我必须以某种方式为文档分配一个名称/变量。并像这样称呼它：nameOfDocument.getElement..

等等..

我猜这条线

if("{{ res.score2Set }}" == 0)

是问题所在 - 包含的 Javascript 文件不会通过 Django 模板加载器，因此您无法在其中放置变量。此条件的计算结果将始终为 false。

您需要以某种方式在模板文件中设置变量，然后在 Javascript 中检索它。最好的方法可能是将res.score2Set作为附加参数添加到 postIt（） 函数中，然后执行以下操作：

<td id="bg1" onclick="postIt('score2', '{{ res.score2Set }}')">

虽然显然我真的不知道您的应用程序是做什么的，所以这可能不适用。如果res.score2Set在HTML中的其他地方使用，那么最好从Javascript中的DOM加载它。

你对javascript的假设是错误的。无论您在哪里编写JS代码（内联，文件内，外部文件），所有JS代码都可以访问 DOM.So，问题是您没有正确加载JS文件。

相关文章：