[JS] Bug vermoedelijk in for-loop

[Verwijderd]

Ik ben vandaag begonnen aan een generator voor een script dat ik al eerder geschreven heb, je moet immers iets doen om de vakantie door te komen

Ik kwam er echter al snel achter dat mijn javascript "skills" aardig wat vastgeroest zijn na bijna een jaar niet scripten

Het doel is dat de gebruiker een aantal invoert, en dat er via javascript een gelijk aantal textboxen gecreerd worden. Na wat bedenkwerk kwam ik met de oplossing de hele HTML die bijgeschreven moest worden (de HTML met de textboxen dus,) in één variabele te knallen m.b.v. een for-loop, om dit later via innerHTML ergens op de site te laten verschijnen.

Nou ben ik al nooit zo'n held geweest met loops, maar nu heb ik blijkbaar een fout gemaakt waar ik echt niet achter kan komen. Voor test doeleinden wil ik de variabele laten verschijnen in een textarea.

Hier moet bij gezegd worden dat het controleren van het aantal dat de gebruiker invoert als aantal voor textboxen op zichzelf wel werkt. function CheckImages wordt aangeroepen via een onchange eventhandler in het form genaamd Generate

JavaScript:

function CheckImages()
{
nr = document.Generate.ImgTextNo.value;
CheckboxScript = " ";
if (nr > 20)
{ alert("Sorry! The maximum amount of images allowed is 20.")
document.Generate.ImgTextNo.value = 20}

else {
   for (i=1; i<=nr; i=i+1)
   {
      Add = '<input type="imgtext'+i'" name="ImgTextNo'+i'" size="10" value="1"><br>'
      CheckboxScript = CheckboxScript + Add;
   }
document.Generate.Testbox1.value = CheckboxScript;
}
}

edit: als iemand trouwens mijn geheugen zou kunnen verfrissen over innerHTML zou ik diegene ook zeer dankbaar zijn, ik had eht idee het geheel in een divje te gooien, is dat mogelijk?

[ Voor 11% gewijzigd door Verwijderd op 04-07-2005 17:09 ]

[Sappie]

maak de variable CheckboxScript eens globaal. Ik denk dat het nl een scope probleem is. (kan me echter vergissen, maar met je script lijkt weinig mis.. op het inspringen na that is )

Komt er btw uberhaupt wel iets in de textbox te staan?

[ Voor 26% gewijzigd door Sappie op 04-07-2005 17:13 ]

[Verwijderd]

nee, de hele functie lijkt te crashen, ik zal het eens proberen met globale variabelen

edit: globaal maakt geen verschil,

[ Voor 19% gewijzigd door Verwijderd op 04-07-2005 17:17 ]

[Sappie]

gewoon een "var" voor je eerste declaratie dan he Verder ben ik ook aan t twijfelen aan mijn bewering.

D8 altijd dat er iets vaags was met de variabele scope, maar volgens mij is t toch erg simpel en was mijn bewering onjuist. Aangezien de variabele binnen de functie staat hoef je er geen var voor te zetten.

[ Voor 94% gewijzigd door Sappie op 04-07-2005 17:21 ]

[Verwijderd]

hij geeft overigens een error dat hij een ";" mist. Maar we weten allemaal hoe de errors van Internet Explorer werken

[Sappie]

Maar je mist ook wel wat ";" 's (met mn gare hoofd nog niet eerder opgevallen). Internet Explorer geeft soms nog wel wat goede debug info dus Verder kun je beter Firefox gebruiken om je javascript mee te testen, aangezien de javascript console vaak gedetailleerde foutmeldingen / waarschuwingen teruggeeft.

[ Voor 62% gewijzigd door Sappie op 04-07-2005 17:23 ]

[Verwijderd]

Verwijderd schreef op maandag 04 juli 2005 @ 17:08:

JavaScript:

if (nr > 20)
{
 alert("Sorry! The maximum amount of images allowed is 20.")
 document.Generate.ImgTextNo.value = 20
}

Begin es met puntkomma's achter die regels te zetten....

[Verwijderd]

Verwijderd schreef op maandag 04 juli 2005 @ 17:23:
[...]


Begin es met puntkomma's achter die regels te zetten....

Zoals al gezegd, het form validatie stuk werkt prima, dus daar kan het niet aan liggen
Mijn slordige scripten komt overigens doordat ik het echt al een jaar niet meer hebben kunnen doen wegens schoolwerk.

Overigens nu even netjes overal ";" achter gezet waar dat behoort voor zover ik weet, en nogsteeds geen succes

Firefox ga ik trouwens eens proberen, bedankt voor de tip

[ Voor 21% gewijzigd door Verwijderd op 04-07-2005 17:30 ]

[crisp]

zo is het ook meteen beter leesbaar:

JavaScript:

function CheckImages()
{
    // je kan overigens beter via het 'this' keyword alvast een handle
    // naar deze functie meegeven; scheelt weer lookups

    var form = document.forms['Generate'];
    var nr = parseInt(form.elements['ImgTextNo'].value, 10);

    if (nr > 20)
    {
        alert('Sorry! The maximum amount of images allowed is 20.');
        form.elements['ImgTextNo'].value = '20';
    }
    else
    {
        var CheckboxScript = ' ', Add;
        for (var i = 1; i <= nr; i++)
        {
            Add = '<input type="imgtext'+i'" name="ImgTextNo'+i'" size="10" value="1"><br>';
            CheckboxScript += Add;
        }

        form.elements['Testbox1'].value = CheckboxScript;
    }
}

[ Voor 5% gewijzigd door crisp op 04-07-2005 17:44 ]

[Verwijderd]

crisp schreef op maandag 04 juli 2005 @ 17:41:
zo is het ook meteen beter leesbaar:

JavaScript:

/

Dank je wel ik krijg echter nogsteeds dezelfde error.
In Firefox lijkt hij het helemaal op te geven, niks werkt, maar ik krijg geen error.

[Verwijderd]

Toch maar even het volledige script dan, inclusief HTML erbij. Wie weet maakt het iets uit.
Ik hoop trouwens dat ik de verwijzing via "this" goed heb gedaan, ben ik niet zo familiar mee.

code:

<form name="Generate">
<input type="text" name="ImgTextNo" size="10" value="1" onchange="CheckImages(this);">
<p><textarea rows="2" name="Testbox1" cols="20"></textarea></p>
</form>
<script language="javascript">
function CheckImages(imgtxt)
{

    var form = document.forms['Generate'];
    var nr = parseInt(imgtxt.value, 10);
    var CheckboxScript = ' ';

    if (nr > 20)
    {
        alert('Sorry! The maximum amount of images allowed is 20.');
        imgtxt.value = '20';
    }
    else
    {
        var Add;
        for (var i = 1; i <= nr; i++)
        {
                 Add = '<input type="imgtext'+i'" name="ImgTextNo'+i'" size="10" value="1"><br>';
            CheckboxScript += Add;
        }

        form.elements['Testbox1'].value = CheckboxScript;
    }
}
</script>

[crisp]

HTML:

<form action="#" id="Generate">
<input type="text" name="ImgTextNo" size="10" value="1" onchange="CheckImages(this);">
<p><textarea rows="2" name="Testbox1" cols="20"></textarea></p>
</form>
<script language="javascript">
function CheckImages(imgtxt)
{
    var form = imgtxt.form;
    var nr = parseInt(imgtxt.value, 10);
    var CheckboxScript = ' ';

    if (nr > 20)
    {
        alert('Sorry! The maximum amount of images allowed is 20.');
        imgtxt.value = '20';
    }
    else
    {
        var Add;
        for (var i = 1; i <= nr; i++)
        {
            Add = '<input type="imgtext'+i+'" name="ImgTextNo'+i+'" size="10" value="1"><br>';
            CheckboxScript += Add;
        }

        form.elements['Testbox1'].value = CheckboxScript;
    }
}
</script>

zoek de verschillen
overigens is onchange hier niet zo handig; je kan er misschien beter een button achter zetten met een onclick actie.

[Verwijderd]

ik ben absoluut zwakbegaafd...
Achja, de fouten zijn vaak de kleinste dingetjes, danku
Wat betreft de onchange heb je volledig gelijk, maar dit is allemaal nog maar een testje, dat komt nog wel goed

[crisp]

de fout zat dus in de regel met Add = ... - daar mistten een paar plusjes; de rest is optimalisatie en validatie (een form moet een action hebben, en name bestaat niet meer voor form-elementen in HTML 4).

[ Voor 35% gewijzigd door crisp op 04-07-2005 19:08 ]