CODEWITHSUNDEEP
phphtmlmysql
Marina
Marina

Reputation: 161

PHP MySQL dropdown population with blank first option

Edit: gbalduzzi solved it for me with what you guys call a "dirty fix" - which is now my favorite term in coding. Thank you all so much for the help!

I'm very new to PHP/MySQL - and by new I mean the only experience I have is playing around with our site that was created by someone who didn't really care what his code looked like.

I'm attempting to fix a few issues our old IT guy had on our site. He was self-taught, so I'm sure this code I'm using is probably not up to current standards. We have a contact list in our database, and that information is connected to this dropdown.

I'm trying to add a blank option so when you first load the page, there is no contact selected. What I currently have adds a blank dropdown, but ends up selecting the blank option as the first contact, first option as the second contact, and so on.

Is there a way for me to implement the blank option without ruining the contact selection?

<select class="inputbox" id="job_contacts" name="job_contacts" onchange="Choice();">
    <?php
    echo '<option value=""></option>';
    foreach ($uArr as $key=>$value) {
        echo '<option value="'.$key.'">'.$value['contact_name'].'</option>'; 
    }
    ?>
</select>

Here is the array he created:

<script type="text/javascript">
        var nam = new Array();
        var pho = new Array();
        var email = new Array();
        <?php
            foreach($uArr as $key=>$value) {
                echo "nam[" . $key . "] = '" . $value['contact_name'] . "';\n";
                echo "pho[" . $key . "] = '" . $value['contact_phone'] . "';\n";
                echo "email[" . $key . "] = '" . $value['contact_email'] . "';\n";
            }
            ?>

        function Choice() {
            x = document.getElementById("nam");
            y = document.getElementById("job_contacts");
            x.value = y.options[y.selectedIndex].text;
            document.getElementById("nam").value = nam[y.selectedIndex];
            document.getElementById("pho").value = pho[y.selectedIndex];
            document.getElementById("email").value = email[y.selectedIndex];
        }
    </script>

Upvotes: 2

Views: 63

Answers (2)

clearwaterbrewer
clearwaterbrewer

Reputation: 1

Can you try this:

change 

echo '<option value=""></option>';

to

echo '<option selected value=""></option>';

Upvotes: 0

gbalduzzi
gbalduzzi

Reputation: 10166

After adding the blank option, you need to edit the Choice function accordingly:

function Choice() {
            x = document.getElementById("nam");
            y = document.getElementById("job_contacts");
            var index = y.selectedIndex - 1;
            if (index < 0) return
            x.value = y.options[index].text;
            document.getElementById("nam").value = nam[index];
            document.getElementById("pho").value = pho[index];
            document.getElementById("email").value = email[index];
        }

Upvotes: 3

Related Questions