Javascript function's argument is the word "Array" instead of a mySQL row

Question

It appears that I am facing a common beginer's problem but I haven't managed to solved it on my code.

What I want to do: I have created a database and I am currently working on a simple UI for updating it. So, I use

One drop-down menu populated by a mySQL table
Some forms with their values changed accordingly to the drop down selection.

Code(Simplified a little):

<html>
<body>
    <form method="post">
        <select class="dropdown" id="dropdown_id" onChange='fillFun(this.value)' >
            <option disabled selected value style="display:none"> -- select an option  -- </option>
            <?php
                //stuff pdo connection 
                $pdo = new PDO("mysql:host=$servername;dbname=myDatabase", $user, $password);
                try
                {
                    $result = $pdo->query("SELECT * FROM dbTable");
                    foreach($result  as $row)
                    {
                        echo '<option value="'.$row.'"';
                        echo '>'. $row['last_name'].' '. $row['first_name'].'</option>'."\n";
                    }
                }
                catch(PDOException $e) { echo 'No Results'; }
            ?>
        </select >
    </form>

    <form id="forms" action="results.php" method="post">
        Last Name:      <input type="text" id="last_name" /><br><br>
        First Name:     <input type="text" id="first_name" /><br><br>
        <input type="submit" />
    </form>

    <script>
        function fillFun(fill)
        {   
            document.getElementById('last_name').value = fill[1];
            document.getElementById('first_name').value = fill[2];
        }
    </script>
<body>

Problem:

this.value = "Array"

After researching a little I found a couple of question with a similar problem.(For instace this one) The thing is that I can't(or don't know how,to be precise) apply the given solution print_r() or var_dump() since I am echo-ing an option value. Another way to solve a similar problem was the use of json_encode() but after the change of

onChange='fillFun(this.value)'

with

onChange='fillFun(json_encode(this.value))'

the problem wasn't solved. On the contrary, it seems that now the fill parameter was null.(Nothing happens on change).

What am I missing here?Thanks.

Have you tried it with this.options[this.selectedIndex].value? — Geshode
– Geshode, Commented Jan 9, 2018 at 2:34
You're setting the <option> tag's value to the entire $row variable, rather than a specific column — iainn
– iainn, Commented Jan 9, 2018 at 9:37
@Geshode I tried it but the problem remains. @iainn If I do option value = row[first_name] then I can correctly set first_name but I have no way to passing the last_name value. That's why I tried pass the entire row. — cgss
– cgss, Commented Jan 9, 2018 at 20:10

Thai Duong Tran · Accepted Answer · 2018-01-09 04:12:59Z

0

Instead of referring to this.value you can pass the event object to fillFunc function and obtain the value through event.target.value.

So fillFunc will be updated to:

fillFunc(event) {
   document.getElementById('last_name').value = event.target.value[1];
   document.getElementById('first_name').value = event.target.value[2];
}

And pass event to your onchange handler.,

<select onchange="filFunc(event)"></select>

answered Jan 9, 2018 at 4:12

Thai Duong Tran

2,54214 silver badges15 bronze badges

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

2 Comments

Thai Duong Tran Over a year ago

@cgss, it's because of a problem with your PHP code, you pass an array to the option value. In HTML, option value default to be string. You don't want to pass the entire row to the value.You should pass only first_name and last_name to the option value, then you can you javascript split function to split the value and access them separately.

cgss Over a year ago

If I understood correctly, I need something like stringForOptionValue = "row[first_name]-row[last_name]" option value = stringForOptionValue And inside the script split(fill,-). Is that what you mean? If yew then I guess I can try it but if you kindly provide a solution it would be much appreciated.

Collectives™ on Stack Overflow

Javascript function's argument is the word "Array" instead of a mySQL row

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related