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

Using XHR to update a server file and add option to html select

本文关键字：添加 选项 html 选择 XHR 更新 服务器 文件 使用      更新时间：2023-09-26

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

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（） 需要一个可迭代的参数'"。在我的Python CGI脚本中，如何将用户在表单中输入的数据通过POST请求上传的文件保存到磁盘？

看起来值确实被传递了，但也许我没有正确提取数据。f = ， f.writelines = ， fileitem = FieldStorage（'userfile'， None， 'sghjsjh'）

谢谢

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

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

而不是

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

只是为了任何过来看看这个并想知道答案的人，在玩了几个小时后，我终于能够通过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()

这对我需要它做的事情有用。我相信有更好的方法可以做到这一点，但这就是我现在所拥有的。

相关文章：