jeudi 30 juin 2016

passing value to a different webpage form

I'm trying to learn to make a webapp using JavaScript along side with nodejs. I'm all out of ideas and have no clue if im doing this correctly. So what im trying to do is when a user clicks on a row of a the dynamically created table it opens up a new html page with a bunch of form inputs already filled in with the values in a json. Right now I have it that when I click on the table row I can get the Id chosen and as a test i want to load it in to a input field but im getting it as undefined

a good portion of the table creating function with the fillform function

    for (i = 0; i < attendee.length; i++) {
        var tr = document.createElement('TR');
        if(i % 2 == 0)
        {
            tr.bgColor = '#E9F2F5';
        }
        for (var j = 0; j < attendee[i].length; j++) {
            var td = document.createElement('TD');

           /* if (j != 0) {
                td.setAttribute('contenteditable', 'true');
            }*/
            td.appendChild(document.createTextNode(attendee[i][j]));
            tr.appendChild(td);

            var currentRow = table.rows[i];
            var createClickHandler =
                function(tr)
                {
                    return function() {
                        var cell = tr.getElementsByTagName("td")[0];
                        var id = cell.innerHTML;
                        fillForm(id);
                    };
                };
            currentRow.onclick = createClickHandler(currentRow);
        }
        tableBody.appendChild(tr);
    }
    myTableDiv.innerHTML = "";
    myTableDiv.appendChild(table);
}

// this function is included in the html page as a onload function
function fillForm(id) 
{
    window.open("/populatedForm.html");
    document.getElementById("id").value = id;
    console.log(id);
} 

Part of the html input I want to fill out.

<div class=container2>
    <form method="PUT" action="/process-form" enctype="multipart/form-data" autocomplete="off">
        <fieldset>
            <label>
                ID<br/>
                <input id="id" name="id" type="text" value=" " required/>
            </label>
            <br/>

This is how my table looks like enter image description here

And this is how the input looks like when I click on a row in the table. It opens the new html page but the input is set to undefined. I havent done the rest since I cant get id to work. enter image description here

Any advice would be great! Thank you!




Aucun commentaire:

Enregistrer un commentaire