使用 XHR 更新服务器文件并向 html 选择添加选项

Question

我正在尝试让输入字段将文本添加到服务器上的文件中，并将其动态添加到网页上的选择元素中，但效果不佳。目前我收到一个错误，即 e1 为空，并且文本没有附加到我的 testdoc.txt 文本文件中。如果我取出代码尝试写入文本文件，这将毫无问题。我还尝试了不动态添加到选择字段以查看它是否会附加到文件并且不会。在萤火虫中，我确实看到了帖子，并且看到了响应，但它没有附加到文件中。下面是我当前代码的 sn-p。

function submitxhr(){
 var e1=document.getElementById('item');
 var e2=document.getElementById('items');
 var o=document.createElement('option');
 var xhr = new XMLHttpRequest();
 xhr.overrideMimeType("text/plain; charset=x-user-defined");
 o.value=e1.value;
 o.text=e1.value;
 e2.options.add(o);
 xhr.open("POST","testdoc.txt");  
 xhr.send(e1);
};

 <form id="myForm"> 
   <input name="item" type="text" value="" />  
   <select size="3" id="items" name="items">
   <input type="button" value="submit"  ONCLICK="submitxhr()">   
 </form>

我的下一步是为选择表单中的选项创建一个删除按钮，但我还没有到那里，但任何帮助将不胜感激。

[更新] 如果我能够将 XHR POST 传递到 python CGI 脚本中，我可以计算出添加和删除。目前，我无法将 POST 传递到 python CGI 脚本中。传递时找不到e1变量。

import cgi
import cgitb
cgitb.enable()

form = cgi.FieldStorage()

value1 = form.getvalue[e1]

f = open(r'testdoc.txt', 'a')
f.write(e1)
f.close()

我什至检查了这个问题，但是当我使用它制作测试脚本时，我也得到一个空值，“message = 'writelines() 需要一个可迭代的参数'”。 In my Python CGI script, how do I save to disk a file uploaded via POST request of data entered by the user in a form?

看起来该值正在传递，但也许我没有正确提取数据。 f = , f.writelines = , fileitem = FieldStorage('userfile', None, 'sghjsjh')

谢谢

Answer 1

只是为了让任何人来看这个并在玩了几个小时后想知道答案，我终于能够通过 python CGI 脚本更新我的文本文件，感谢 kol 他得到了它，所以我可以输入在我的选择字段中添加一个选项，因为我完全错过了一个关键字段。

我需要将我的原始网页更新为以下内容：

function submitxhr(form){
 var e1=document.getElementById('item');
 var e2=document.getElementById('items');
 var o=document.createElement('option');
 var xhr = new XMLHttpRequest();
 xhr.overrideMimeType("text/plain; charset=x-user-defined");
 o.value=e1.value;
 o.text=e1.value;
 e2.options.add(o);
 var formElement = form;
 formData = new FormData(formElement);
 xhr.open("POST","appendtest3.cgi");
 xhr.send(formData);
};

 <form id="myForm" name="myForm" action="" method="POST">  
 <input id="item" name="item" type="text" value="" />
 <select size="3" id="items" name="items">
 <input type="button" value="submit"  ONCLICK="submitxhr(this.form)">
 </form>

并将其添加为我的 python CGI 脚本，以将输入字段传递到我的文本文件中。

fs = cgi.FieldStorage()
payload = fs.getvalue('item', 'unknown')

f = open(r'testdoc.txt', 'a')
f.writelines(payload + "\n")
f.close()

这适用于我需要它做的事情。我确信有更好的方法，但这是我现在所拥有的。

Answer 2

您忘记将id 添加到第一个input 字段！应该是：

<input id="item" name="item" type="text" value="" />

而不是

<input name="item" type="text" value="" />