[Løst] booking skjema

tjumsen · 6. september 2013

lure på om noen som vet hvordan man kan lage slik skjema at en kan velge fra et dropdown meny og så kommer et felt under .

eksempel :

velger barne fotografering ,
kommer det

alder, navn

velger bryllups fotografering ,

kommer det
dato, ønsker.

med andre ord forskjellig felt for det man velger ?

Thorbear · 6. september 2013

Det løses som regel med JavaScript =)

tjumsen · 6. september 2013

Det løses som regel med JavaScript =)

har du mulighet og kunne hjelpe meg litt ?

Thorbear · 6. september 2013

Beklager, forrige svar var nok litt kort ja =)

En løsning er å legge ut alle felter gjennom HTML, men bruke CSS (display:hidden) til å skjule alle som ikke hører til det valget som ligger først i lista.
Videre har du en javascriptfunksjon koblet til onchange på nedtrekkslisten, som endrer på hvilke felter som er skjult med CSS.

Ved hjelp av PHP kan du generere en array eller liknende i javascript som holder styr på hvilke felter som hører til hvilke valg.

tjumsen · 6. september 2013

ok .. takker for et litt mer utdjupet svar . da trur jeg kan klare det .. god helg

Thorbear · 6. september 2013

Jeg var nok litt rask i forrige post også, det er display:none, ikke hidden, blander sammen med Android =)

Ellers tok jeg meg tiden til å slenge sammen et eksempel, om du skulle trenge mer hjelp:

<?php
$data = array(
        'one' => array('title' => 'One', 'fields' => array('name', 'address')),
        'two' => array('title' => 'Two', 'fields' => array('name', 'age'))
);

$jsobject = 'var arr = {';

$select = '<select id="something" name="something" onchange="changeFields(this)">';
foreach($data as $key => $option) {
    $select .= '<option value="' . $key . '">' . $option['title'] . '</option>';
    $jsobject .= $key . ': [';
    foreach ($option['fields'] as $value) {
        $jsobject .= '"'.$value.'",';
    }
    $jsobject .= '],';
}
$jsobject .= '};';
$select .= '</select>';
?>
<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
    <?php echo $jsobject; ?>
    function changeFields(list) {
        var fieldsToHide = document.getElementsByClassName('hideable');
        for (var i = 0; i < fieldsToHide.length; i++) {
            fieldsToHide[i].style.display = "none";
        };
        var fields = arr[list.options[list.selectedIndex].value];
        for (var i = 0; i < fields.length; i++) {
            document.getElementById(fields[i]).style.display = "block";
        };
    };
    </script>
</head>

<body onload="changeFields(document.getElementBy[spoiler]meh[/spoiler]Id('something'))">
    <?php echo $select; ?>
    <div class="hideable" id="name"><label for="name">Name</label> <input name="name" type="text" /></div>
    <div class="hideable" id="address"><label for="name">Address</label> <input name="address" type="text" /></div>
    <div class="hideable" id="age"><label for="name">Age</label> <input name="age" type="text" /></div>
</body>
</html>

Logg inn

[Løst] booking skjema

Anbefalte innlegg

tjumsen

Lenke til kommentar

Videoannonse

Thorbear

Lenke til kommentar

tjumsen

Lenke til kommentar

Thorbear

Lenke til kommentar

tjumsen

Lenke til kommentar

Thorbear

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer