document.getElementById return empty

Question

i have a form that need to be proceed in other page, when i try to get value of a input the js return nothing!

the form:

<form id="myf" name="myf" method="POST" action="folder/nextstep.php">

    <label for="place">Name: </label>
    <input id="place" name="place" type="text" onkeyup="getfind('result_place','folder/nextstep.php','place');"><br>
    <div id="result_place"></div>

    <script type="text/javascript"> 
        var values = new Array();
        values[0] = new Array();
        values[0][0] = "place";
        values[0][1] = document.getElementById("place").value;
    </script>

    <input id="submit" name="submit" type="button" onclick="getfind('folder/nextstep.php',values);" value="Add">
</form>

and other file that proceed:

function getfind() {
    var xmlobj = ajax();
    if (arguments.length == 3) {
          //something here
    } else if (arguments.length == 2) {

        var thepage = arguments[0];
        var thevalues = arguments[1];
        var theparam = "";

        for (var i in thevalues) {
            theparam += thevalues[i][0] + "=" + thevalues[i][1] + "&";
            alert(theparam);
        }

but alert something like this:

place=&input2=& and ...

and the values are empty! why?

length is a base 1 integer, looks like you are testing based on base 0? IE you have 3 arguments and the code section for 3 arguments is blank? my first guess. — Wobbles
– Wobbles, Commented Aug 2, 2014 at 13:26
Also you are setting var values on load but i see nothing updating them on text entry — Wobbles
– Wobbles, Commented Aug 2, 2014 at 13:28

jcaron · Accepted Answer · 2014-08-02 13:27:33Z

1

You are initialising values at the time the page is loaded.

If you want to use the current contents of the inputs, you need to do that at the time of the click.

The simplest option is probably to put it in a function:

function getvalues()
{
    var values = new Array();
    values[0] = new Array();
    values[0][0] = "place";
    values[0][1] = document.getElementById("place").value;
    return values;
}

then instead of values, use getvalues():

onclick="getfind('folder/nextstep.php',getvalues());"

answered Aug 2, 2014 at 13:27

jcaron

17.8k6 gold badges36 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Florian Wendelborn · Accepted Answer · 2014-08-02 13:33:21Z

The problem is most likely that you don't get the values when the function is called. Your code that tries to get them is evaluated before you enter anything. If you embed that part into the getfind() function it should work.

var values = new Array();
values[0] = new Array();
values[0][0] = "place";


function getfind() {

    var xmlobj = ajax();
    if (arguments.length == 3) {
          //something here
    } else if (arguments.length == 2) {

        var thepage = arguments[0];
        var thevalues = arguments[1];

        var theparam = "";

        for (var i = 0; i < values.length; i++) {
            // get latest values
            thevalues[i][1] = document.getElementById(thevalues[i][0]).value;
            theparam += thevalues[i][0] + "=" + thevalues[i][1] + "&";
            alert(theparam);
        }

Ashish Balchandani · Accepted Answer · 2014-08-02 13:37:34Z

0

Its seems that element place element is not ready when you scripting is executed. Put your code in

window.onload=function(){
//your code here
}

Your code should be

<script type="text/javascript"> 
window.onload=function(){
     var values = new Array();
     values[0] = new Array();
     values[0][0] = "place";
     values[0][1] = document.getElementById("place").value;
}       
</script>

answered Aug 2, 2014 at 13:37

Ashish Balchandani

1,2761 gold badge9 silver badges14 bronze badges

1 Comment

reza Over a year ago

tnx, all answers correct :) and now, i use this: function getvalues() { values = [["edu_place",document.getElementById("edu_place").value], ["edu_degree",document.getElementById("edu_degree").value], ["edu_field",document.getElementById("edu_field").value], ["edu_description",document.getElementById("edu_description").value], ["edu_indate",document.getElementById("edu_indate").value], ["edu_outdate",document.getElementById("edu_outdate").value]]; return values; }

Collectives™ on Stack Overflow

document.getElementById return empty

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related