Hi All !

After a few hours of googling around i found this community. I am not sure if i am in the right place, sorry if i am not.
I want to build a form with a drop down menu and a few text fields.
On load, they are all visible and set to their default empty value.
Based on what is selected in the drop down, the text fields populate but if needed can be edited.

I have read and tried so many different suggestions from different sites i don't even know where to start anymore.
I know no PHP and am hoping for a copy/paste solution that i can tailor to my needs and learn from.

Any help greatly appreciated.

Jay

Member Avatar for diafol

This is probably a javascript solution. Where are you storing the data for the dropdown items and the related data for the input fields/textboxes?

I'm assuming that because you know no PHP, you don't know any MySQL either, so no database.

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
    <form>
        <label for = "dd">Being:</label>
        <select id="dd" name="dd">
        </select>
        <label for = "colour">Colour:</label>
        <input id="colour" name="colour" />
        <label for = "size">Size:</label>
        <input id="size" name="size">
    </form>
    <script>
    var items = <?php echo $json;?>;
    output = "";
    $.each(items, function(key, value) { 
        output += '<option value="' + key + '">' + value['label'] + '</option>'; 
    });
    $('#dd').html(output);
    function changeMe(passed){
        $('#size').val(items[passed]['size']);
        $('#colour').val(items[passed]['colour']);
    }
    $('#dd').change(function(){
        changeMe($('#dd').val());
    });
    changeMe(0);
</script>

</body>
</html>

That's an example using jQuery. You can do it in normal javascript, it's pretty much the same, but with bloated item references.

In addition, you don't NEED php at all, I just used it to create my json. You can do without php like this:

var items = [{"label":"smurf","colour":"blue","size":"small"},{"label":"pixie","colour":"red","size":"teeny"},{"label":"dragon","colour":"green","size":"humungous"},{"label":"hobbit","colour":"pink","size":"pint-sized"}];
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.