Using XHR to update a server file and add option to html select
Question: I am trying to have the input field add text into a file that is on the server
and add it to the select element on the webpage dynamically but it is not
working out so well. Currently I am getting an error that e1 is null and the
text is not getting appended to my testdoc.txt text file. If I take out the
code to try and write to the text file this works without issue. I also tried
without the dynamic adding to the select field to see if it would append to
file and that does not go. In firebug I do see the post and I see a response
but it does not get appended to the file. Below is a snippet of my current
code.

    
    
    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>
    

My next step is then to create a remove button for the options in the select
form but I have not gotten there yet but any help would be much appreciated.

[UPDATE] If I am able to pass the XHR POST into a python CGI script I could
figure out both adding and removing. Currently, I am unable to pass the POST
into the python CGI script. It cannot find the e1 variable when passed.

    
    
    import cgi
    import cgitb
    cgitb.enable()
    
    form = cgi.FieldStorage()
    
    value1 = form.getvalue[e1]
    
    f = open(r'testdoc.txt', 'a')
    f.write(e1)
    f.close()
    

I even checked out this question but when I make a test script using this, I
also get a null value, "message = 'writelines() requires an iterable
argument'". [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?](http://stackoverflow.com/questions/15947988/in-my-python-cgi-script-
how-do-i-save-to-disk-a-file-uploaded-via-post-request)

It does look like the value is getting passed but maybe I am not pulling the
data out correctly. f = , f.writelines = , fileitem = FieldStorage('userfile',
None, 'sghjsjh')

Thanks


Answer: You've forgotten adding the `id` to the first `input` field! It should be:

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

instead of

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

