[Javascript ]Dynamisch formulier validatie *

[aal]

Hoi, ik heb een probleempje waarvan ik hoop dat jullie me kunnen helpen.

Ik heb gezocht, maar geen antwoord kunnen vinden, maar ik vind het probleem dan ook een beetje lastig te omschrijven in een zoak opdracht

Het gaat om het volgende, ik maak met PHP een stel checkboxes aan afhankelijk van het aantal mensen die in de database staan. Nu worden deze mensen uit de database verwijderd als die checkboxjes aangevinkt worden dus wil ik eerst even een waarschuwinkje geven dmv. Javascript.

Het gene wat ik al heb werkt bijna perfect.

De checkboxjes:

PHP:

// Create an array with all the UID's and their names.
$results = mysql_query("SELECT * FROM tbl_users") or die ("Er is iets fout gegaan: ".mysql_error());
while ($users = mysql_fetch_array($results, MYSQL_ASSOC))
{
   echo "<tr>\n";
   echo "<td align='center'>\n";
   echo "<input type='checkbox' name=\"delete[]\" value='".$users['ID']."'>\n"; 
   echo "</td>\n";
}

de validatie:

code:

function confirmSubmit(form)
{
   for (var i=0; i<form.elements['delete[]'].length; i++)
   {
      if (form.elements['delete[]'][i].checked)
      {
       var agree=confirm("WAARSCHUWING: De gebruikers die u aangevinkt heeft zullen PERMANENT verwijderd worden. Weet u zeker dat u door wilt gaan?");
      if (agree)
        return true;
      else
        return false;
      }
   }
}

Dit werkt perfect als er 2 of meer checkboxen zijn. als er daarin tegen maar 1 gebruiker in de database staat en er dus ook maar 1 checkbox is, gaat het hier:

code:

for (var i=0; i<form.elements['delete[]'].length; i++)

fout omdat form.elements['delete[]'].length 'undefined' is als er maar 1 checkbox is

Iemand enige suggesties hoe ik dit ook werkend kan krijgen als er maar 1 checkbox is? Het probleem is namelijk vooral die [] in de variabele naam waardoor JS steeds op zijn bek gaat.

edit:

haakje vergeten ...

en die <form> tag weggehaald...

[ Voor 22% gewijzigd door aal op 26-07-2004 14:34 ]

[gorgi_19]

Zie P&W FAQ - HTML / javascript /css, etc...

>> Webdesign & Graphics

[André]

Dan maak je toch eerst een if statement waarin je kijkt of length 'undefined' is of een getal?

JavaScript:

function confirmSubmit(form)
{
  if (form.elements['delete[]'].length == 'undefined') 
  {
    if (form.elements['delete[]'].checked)
    {
      var agree=confirm("WAARSCHUWING");
      if (agree)
        return true;
      else
        return false;
    }
  }
  else
  {
    for (var i=0; i<form.elements['delete[]'].length; i++)
    {
      if (form.elements['delete[]'][i].checked)
      {
         var agree=confirm("WAARSCHUWING");
        if (agree)
          return true;
        else
          return false;
      }
    }
  }
}

[ Voor 113% gewijzigd door André op 26-07-2004 14:36 ]

[Shadowman]

erhm je maakt voor iedere user die je verwijdert een nieuwe form aan? Eenmaal is toch voldoende?

[aal]

ja klopt.. dit is niet mijn preciese code, ik had alleen die form tags er ff voor de duidelijkheid bijgezet..


niet echt snugger

@André

code:

if (form.elements['delete[]'].length == "undefined")
  {
      alert ("hee!!! er is maar 1 checkbox!!");
   }

werkt helaas niet.. Ik denk niet dat er echt 'undefined' oid in komt te staan, maar dat dat eerder een nette foutmelding van JS zelf is

[ Voor 52% gewijzigd door aal op 26-07-2004 14:40 ]

[Verwijderd]

Als er maar 1 element van die lijst is, is form.elements['delete[]'] waarschijnlijk een object, in plaats van een lijst/verzameling.

Je zou het met een typecheck kunnen proberen. Ik ken niet genoeg van Javascript om je de precieze code te geven, maar het zou er ongeveer zo uit komen zien :-

code:

function confirmSubmit(form)
{
  var ck = forms.elements['delete[]'];
  var anysel = false;

  if (is_object(ck)) {
    anysel = ck.checked;
  }
  else
    for (var i=0; i<ck.length; i++) {
      if (ck[i].checked) {
        anysel = true;
        break;
      }
    }

  if (anysel) {
    return confirm("Warning: You're on the path of no return!");
  }
  else 
    return false;
}

Aangenomen dat is_object true teruggeeft als het om een object gaat, en dat hij dat niet doet bij een list. Of je zult hier een ingebouwde functie voor moeten zoeken, of je zult 'm zelf moeten definiëren.

[ Voor 4% gewijzigd door Verwijderd op 26-07-2004 14:38 ]

[aal]

Hmms volgens mij kent javascript is_object niet...

ik krijg er iig een foutmelding over in firebird.

[André]

Dan draai je de if-statement toch om:

code:

if (form.elements['delete[]'].length > 0)
{
  alert ("Meerdere checkboxen");
}
else
{
  alert ("1 checkbox");
}

[Verwijderd]

Wel lezen wat ik zeg hè...

Verwijderd schreef op 26 juli 2004 @ 14:37:
Je zou het met een typecheck kunnen proberen. Ik ken niet genoeg van Javascript om je de precieze code te geven, maar het zou er ongeveer zo uit komen zien :-

[...]

Aangenomen dat is_object true teruggeeft als het om een object gaat, en dat hij dat niet doet bij een list. Of je zult hier een ingebouwde functie voor moeten zoeken, of je zult 'm zelf moeten definiëren.

m.a.w: is_object is de ontbrekende schakel, daarvoor moet je zelf nog even moeite doen.

[Verwijderd]

André schreef op 26 juli 2004 @ 14:53:
Dan draai je de if-statement toch om:

code:

if (form.elements['delete[]'].length > 0)
{
  alert ("Meerdere checkboxen");
}
else
{
  alert ("1 checkbox");
}

Volgens mij is het probleem dat het .length attribuut niet bestaat als de expressie niet evalueert naar een lijst (wat het geval is als er maar 1 element met die naam is).

Deze code zal dan ook niet werken, omdat die nog steeds van het .length attribuut afhangt.

[aal]

Het probleem is dat ik dan nog steeds moet weten of ie aangevinked is.

want als ik op submit druk doet ie ook andere dingen, en hij moet dus alleen die melding geven als iemand in de lijst verwijderd wordt. Het gaat me dus niet om het aantal checkboxen maar of er 1 gechecked is.

Maar ik denk dat ik op de goede weg ben.. als het werkt zal ik zo even mijn code posten.

allemaal alvast bedankt!

[André]

Verwijderd schreef op 26 juli 2004 @ 14:56:
[...]


Volgens mij is het probleem dat het .length attribuut niet bestaat als de expressie niet evalueert naar een lijst (wat het geval is als er maar 1 element met die naam is).

Deze code zal dan ook niet werken, omdat die nog steeds van het .length attribuut afhangt.

Hmm, als length nu niet bestaat is hij ook niet groter dan 0 dus zal hij naar de else springen.

[Verwijderd]

André schreef op 26 juli 2004 @ 14:57:
[...]

Hmm, als length nu niet bestaat is hij ook niet groter dan 0 dus zal hij naar de else springen.

Nee, dan krijg je een scriptfout en gaat het hele script op zijn bek.

[Bosmonster]

Misschien de truc om even een boolean toe te voegen aan het Array-prototype? Al weet ik niet zeker of de elements-array van dit prototype gebruik maakt.

code:

Array.prototype.isArray = function () {return true;}

Of zoiets En dan checken op elements.isArray

En dan niet checken op == true uiteraard wat te vaak gedaan wordt, maar gewoon

if (elements.isArray) { ...

Maar goed.. hetzelfde zou moeten werken voor length

if (elements.length) { ...

[edit]
Of moest je dan ook false toe voegen aan die paar andere prototypes?

[ Voor 37% gewijzigd door Bosmonster op 26-07-2004 15:05 ]

[André]

Verwijderd schreef op 26 juli 2004 @ 14:59:
[...]


Nee, dan krijg je een scriptfout en gaat het hele script op zijn bek.

Dan is een try() catch() oplossing wel handig

[aal]

Ik heb het! vooral dankzij de suggestie van OneOfBorg!

Hier is mijn oplossing het zal wel niet de schoonheidsprijs verdienen maar ben allang blij dat het werkt (heb nogal een beetje een hekel aan JS)

code:

function confirmSubmit(form, src)
{
    var throw_warning = false;
    var ck = form.elements['delete[]'];
    
    
    if (ck.checked) 
    {
        throw_warning = true;
    }
    
    // Check every checkbox if it's checked. When this is the case, issue a warning.
    for (var i=0; i<form.elements['delete[]'].length; i++)
    {
        if (form.elements['delete[]'][i].checked)
        {
            throw_warning = true;
        }
    }
        
    if(throw_warning)
    {
        var agree=confirm("WAARSCHUWING");
        if (agree)
            return true;
        else
            return false;
    }
}

Heel erg bedankt voor de moeite allemaal!

[Verwijderd]

Ik vraag me af of dat cross-browser compatible is...

[aal]

Hmm het werkt hier met firebird en met IE..

[Bosmonster]

Verwijderd schreef op 26 juli 2004 @ 15:12:
Ik vraag me af of dat cross-browser compatible is...

Wat zou er niet browsercompatible zijn aan deze code dan?

[Verwijderd]

Bosmonster schreef op 26 juli 2004 @ 16:06:
[...]


Wat zou er niet browsercompatible zijn aan deze code dan?

Het is met ck.checked hetzelfde als met ck.length... de ene bestaat niet als de andere wel bestaat (en andersom, dus). Als er op het attribuut gechecked wordt terwijl het niet bestaat (wat in 1 van de 2 gevallen altijd gebeurt), dan is dat een fout en crasht het script.

Althans, het script zou moeten crashen. Nou kan het zijn dat bijvoorbeeld Internet Explorer denkt van 'aaach, laat maar gaan die fout', en het statement gewoon overslaat, maar ik verwacht niet dat Open Soers browsers daar hetzelfde over denken. Die zijn vaak wat strikter.

Maar aangezien het al getest is in een OS browser, had ik het blijkbaar mis.

[ Voor 3% gewijzigd door Verwijderd op 26-07-2004 16:12 ]

[crisp]

er zit een fundamenteel verschil tussen:

code:

if (foo.bar) { }

en

code:

if (foo.bar < something) { }

iig had je ook mbv typeof kunnen kijken of .length undefined was:

JavaScript:

if (typeof form.elements['delete[]'].length == 'undefined') { }

[Bosmonster]

[knip]

Dat was een reactie op heel iemand anders dus..

[ Voor 110% gewijzigd door Bosmonster op 26-07-2004 21:16 ]