Hulp nodig met stukje javascript

[Nipje]

Ik heb even een klein beetje hulp nodig voor een website die ik aan het maken ben. Ik ben nog niet zo lang bezig met javascript en moet het tog gaan gebruiken nu, het zit zo :

ik ben een webstie aan het maken waar mensen recepten op kunnen toevoegen, en nog veel meer natuurlijk maar het draait nu om de recepten.

Als je klikt op Recepten toevoegen krijg je eerst een dropdownbox met hoeveel Ingrediënten het recept bevat, en op basis van de selectie in die dropdownbox moet het systeem de invoervelden aan maken, net zo veel als dat je geselecteerd hebt in die dropdown box. ik weet alleen niet helemaal hoe ik het moet doen, en hoop dat iemand me ff kan helpen

[Creepy]

Zou je misschien Waar hoort mijn topic? eens door willen kijken? Dan had je gezien dat javascript in Webdesign, Markup & Clientside Scripting hoort. Daarnaast willen we in elk geval weten wat je zelf hebt geprobeerd en wat daar niet mee lukte. Alleen melden dat het niet lukt is niet voldoende. Je hebt waarschijnlijk zelf al wel iets van een idee om te proberen: dus wat lukte daar dan niet mee? Kreeg je foutmeldingen? Zo ja welke? etc.

move -> Webdesign, Markup & Clientside Scripting

En zou je een topic-report kunnen maken met een iets betere beschrijving van je probleem? Het zegt nu niks over je daadwerkelijke probleem zelf.

[ Voor 11% gewijzigd door Creepy op 28-11-2007 11:38 ]

[Nipje]

wat ik zelf heb geprobeerd, tja ik weet wel een beetje van javascipt, maar ben er nog niet zo ver in. Ik weet dat ik "onchange="makeInputBoxes(this.options[this.selectedIndex].value)" in de select tag moet zetten, en dat ik op basis daarvan een functie moet maken

function makeInputBoxes(number){

documen.write('<input type="text" name="ingredient">"
}

Maar ik weet even niet hoe ik in die functie die velden aan kan laten maken op basis van je selectie, zo ver ben ik dus

[H004]

JavaScript:

<script>
function makeInputBoxes(number){
        var aantal = parseInt(number);
        var output = '';        
        var veld = '<input type="text" name="iets" id="iets" />\n';
        for (i=0;i<aantal;i++) {
                output += veld;
        }
        document.getElementById('nieuw').innerHTML = output;
}
</script>

HTML:

<div id="nieuw"></div>

Misschien dat je dit verder kan uitbouwen?

[Nipje]

hmm het is dus gewoon een for loop, maar hoe noteer ik die juist ? ik heb het nu zo :

var number=0
for (number=0;--------<=---------;i++)
{
document.write(invoerveld)
}

het stuk waar de streepjes staan ind e loop zelf weet ik even niet wat ik in moet vullen

[Janoz]

http://www.w3schools.com/js/js_loop_for.asp

[H004]

JavaScript:

<script>
function makeInputBoxes(number, ingredient){
        var aantal = parseInt(number);
        var output = '';
        var veld = '<input type="text" name="'+ingredient+'" value="'+ingredient+'" id="iets" />\n';
            
        for (i=0;i<aantal;i++) {
                output += veld;
        }       
        oude_inhoud = document.getElementById('nieuw').innerHTML;
        oude_inhoud += output;      
        document.getElementById('nieuw').innerHTML = oude_inhoud;
}
</script>

HTML:

<select name="test" onchange="makeInputBoxes('1', this.options[this.selectedIndex].value)">
    <option value="">Kies een ingredient</option>
    <option value="appel">appel</option>
    <option value="banaan">banaan</option>
    <option value="peer">peer</option>
</select>

<div id="nieuw"></div>

Asje

edit: eigenlijk heb je die for-loop helemaal niet nodig, tenzij je meerder inputvelden tegelijk erbij wil plaatsen. Nu plaats je er eigenlijk maar 1 veld bij, dus kan je de loop gewoon weglaten.

[ Voor 11% gewijzigd door H004 op 28-11-2007 12:18 ]

[RM-rf]

allereerst, vergeet de 'document.write'... dat werkt enkel op het moment dat de pagina zelfs gerendert wordt...
als je element na een gebruikersactie wilt aanpassen moet je via DOM werken, newElm = document.createElement("input"); parentElm.appendChild( newElm) ;
(via google zijn daar wel genoeg voorbeelden van te vinden)

verder het uitvinden welke optie er in een selectmenu geselecteerd is, doe je via
document.forms["formnaam"].elements["elementnaam"]

waarbij je bij een SELECT dan de properties .selectedIndex kunt toepassen:
vb:

code:

var elm = document.forms["formnaam"].elements["elementnaam"]
var  waarde = elm.options[ elm.selectedIndex ].value

[Nipje]

hmm, maar de bedoeling is dat de dropdownbox nummers bevat met hoeveel velden je wilt aanmaken, en dan kan de gebruiker zelf die velden vullen met de ingrediënten

edit @ H004

Dat is ongeveer wat ik bedoel, alleen je moet geen ingrediënten kunnen kiezen in die dropdownbox, maar een nummer met hoeveel invoer velden je aan wil maken onder elkaar, en daar kan de gebruiker dan zelf de ingrediënten in vullen

[ Voor 43% gewijzigd door Nipje op 28-11-2007 12:33 ]

[H004]

Nipje schreef op woensdag 28 november 2007 @ 12:30:
hmm, maar de bedoeling is dat de dropdownbox nummers bevat met hoeveel velden je wilt aanmaken, en dan kan de gebruiker zelf die velden vullen met de ingrediënten

edit @ H004

Dat is ongeveer wat ik bedoel, alleen je moet geen ingrediënten kunnen kiezen in die dropdownbox, maar een nummer met hoeveel invoer velden je aan wil maken onder elkaar, en daar kan de gebruiker dan zelf de ingrediënten in vullen

Nou, dan kan je er dus wel uitkomen door beide voorbeelden te combineren. Alle ingredienten heb je, dus dat moet wel lukken. Succes.

[Nipje]

bedankt voor de hulp !

[Nipje]

Nou staan er dus 2000 ingredienten in die dropdown box, maar het kan tog ook gewoon met een zoekfunctie die onchange meteen weergeeft waar je op zoekt ?

[RM-rf]

Wat je kennelijk zoekt lijkt me handiger om uit te voeren als een soort van 'Ajax Auto-completion'
waarvan er duizenden voorbeeldjes te vinden zijn op het net, zoek op 'ajax auto completion' of 'ajax auto suggest'.

http://wiseguysonly.com/2...letion-for-the-impatient/

[Nipje]

zoiets zal ik wel zoekn ja, gewoon een invoerveld met OnKeyUp, en dan gewoon alle resultaten laat zien

[BtM909]

Dus, als je zelf geen enkele regel echte JS hier neerzet, dan kan je niet van ons verwachten dat we iets kant en klaar gaan opleveren

Tijd om dit topic te sluiten. Je kan het beste rustig al je stappen opschrijven en per stap gaan zoeken met Google. Succes met zoeken!