Sorry for the vague title. I have a a userscript I was working on for a site I frequent. I was editing a page that was abandoned to make it semi-work again client side. I can't show you the page but I can show you everything you should need.

EDIT: I'm attempting to update a form that doesn't work, I'm not sure what else to say.

My script :

var form = document.getElementByTagName("FORM")[0];
var form_new = document.createElement("FORM");
var form_table = document.createElement("TABLE");
var form_submit = document.createElement("INPUT");
var form_input = [{
    "type" : "hidden",
    "name" : "securitytoken",
    "value" : "1384271912-8dbdaf1d1f16d4d6e0a33bf3a1b184c6add5b295"
},{
    "type" : "hidden",
    "name" : "do",
    "value" : "archive"
},{
    "type" : "hidden",
    "name" : "search",
    "value" : "1"
},{
    "type" : "text",
    "name" : "search[phrase]",
    "value" : "",
    "label" : "Shout Contains"
},{
    "type" : "text",
    "name" : "search[username]",
    "value" : "",
    "label" : "Username Contains"
},{
    "type" : "text",
    "name" : "search[time]",
    "value" : "999999999999",
    "label" : "Time"
},{
    "type" : "text",
    "name" : "perpage",
    "value" : "50",
    "label" : "Per Page"
},{
    "type" : "select",
    "name" : "search[sort]",
    "option" : [{
        "value" : "new",
        "text" : "Newest first"
    },{
        "value" : "old",
        "text" : "Oldest first"
    }],
    "label" : "Sort by"
}];

for(var a = 0; a < form_input; a++){
    var tr = document.createElement("TR");
    var td1 = document.createElement("TD");
    var td2 = document.createElement("TD");
    var input = document.createElement("INPUT");
    var select = document.createElement("SELECT");
    var el = form_input[a];

    if(el.type !== "hidden"){
        var td1_text = document.createTextNode(el.label);
        td1.appendChild(td1_text);

        if(el.type == "select"){
            var select_options = el.option;
            for(var b = 0; b < select_options.length; b++){
                var select_option = document.createElement("OPTION");
                select_option.setAttribute("value",select_options[b].value);
                var select_option_text = document.createTextNode(select_options[b].text);
                select_option.appendChild(select_option_text);
                select.appendChild(select_option);
            }
            td2.appendChild(select);
        }else{
            input.setAttribute("type",el.type);
            input.setAttribute("name",el.name);
            input.setAttribute("value",el.value);
            td2.appendChild(input);
        }
        tr.appendChild(td1);
        tr.appendChild(td2);
        form_table.appendChild(tr);
    }else{
        input.setAttribute("type",el.type);
        input.setAttribute("name",el.name);
        input.setAttribute("value",el.value);
        form_new.appendChild(input);
    }
}
form_new.appendChild(form_table);
form.innerHTML = '';
form.setAttribute("style","position:fixed;\
bottom:4px;\
right:4px;\
padding:4px;\
background:#ddd;\
border-radius:10px;\
border:solid 1px black;");
form.setAttribute("method","POST");
form.setAttribute("action","boxoshouts.php?do=archive");
form_submit.setAttribute("type","submit");
form_submit.setAttribute("class","button");
form_submit.setAttribute("value","Submit");
form_new.appendChild(form_submit);
form.appendChild(form_new);

Form I'm updating:

<form method="post" action="iarchive.php">
<input type="hidden" name="do" value="archive">
<input type="hidden" name="search" value="1">
</form>

Do you see anything wrong with this? As I've been over it multiple times and not found anything wrong. It also gives no errors in console and the FORM does exist and is the the 1st and only one on page.

有帮助吗?

解决方案

For starters:

for(var a = 0; a < form_input; a++){

should be

for (var a = 0; a < form_input.length; a++) {

Also you don't have to use .setAttribute() to set DOM element properties:

        input.type = el.type;
        input.name = el.name;
        input.value = el.value;
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top