[js] div en null check

Pagina: 1
Acties:

  • JaQ
  • Registratie: Juni 2001
  • Laatst online: 21-08 17:50
Ik zit me al 2 uur blind te staren op wat ik nou fout aan het doen ben, en ik kan het gewoon niet vinden... *zucht*

ik het een javascriptje gemaakt waarmee ik de visibility van div's hidden, danwel show zet:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
      var ns4 = (document.layers);
      var ie4 = (document.all && !document.getElementById);
      var ie5 = (document.all && document.getElementById);
      var ns6 = (!document.all && document.getElementById);

      function attach(id) {
        var obj
         if(ns4) {
           obj = document.layers[id]
         } else {
           if(ie4) {
             obj = document.all[id]
           } else {
              if(ie5 || ns6) {
                obj = document.getElementById(id)
              }
           }
         }
         return obj
       }

      function hide_obj(id) {
        temp_Obj = attach(id);
        if(ns4) {
          temp_Obj.visibility = "hide"
        } else {
          temp_Obj.style.visibility = "hidden"
        }
      }

      function show_obj(id) {
        temp_Obj = attach(id);
        if(ns4) {
          temp_Obj.visibility = "show"
        } else {
          temp_Obj.style.visibility = "visible"
        }
      }


Ik weet dat dit werkt, want ik gebruik dit ook in een andere pagina en daar is het geen probleem.

Vervolgens heb ik een html pagina met een form en een tweetal divs. (namelijk mijn "next" image, danwel een "X") Dat ziet er zo uit:

code:
1
2
3
4
5
6
7
8
9
10
          <div id="step1_ok" style="VISIBILITY: hidden;">
            <a href="new_ads.html" target="main">
              <img src="../image/Forward.png" width="24" height="24" 
                align="left" border="0" />
            </a>
          </div>
          <div id="step1_error" style="VISIBILITY: show;">
            <img src="../image/error.png" width="24" height="24" 
              align="left" border="0" />
          </div>


Een kleine js functie die ik include in mijn head. Deze doet een nullcheck. Zodra de verplichte velden dus zijn ingevuld, wordt de "next" button visible en de "X" onzichtbaar

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
  <head>
    <link href="../css/style.css" type="text/css" rel="stylesheet" />

    <script language="javaScript" src="../js/step.js">
    </script>

<script language="javaScript">

  function nullCheck() {
    if  ( isNull(documents.forms['tso'].elements['name'].value) ||
          isNull(documents.forms['tso'].elements['company'].value) ||
          isNull(documents.forms['tso'].elements['quota'].value)
        )
        {
          hide_obj('step1_ok'); show_obj('step1_error');
        } else {
          hide_obj('step1_error'); show_obj('step1_ok');
        }
  }

</script>

  </head>


en het bijbehorende form:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
    <form name="tso">

      <center>

      <p class="header">Timeslot owner data</p>

      <table border="0" marginheight="0" width="300" 
        cellpadding="0" cellspacing="0">
        <tr>
          <td> Name </td>
          <td> <input type="text" name="name" size=15 
                     onChange(nullCheck();) /> </td>
        </tr>
        <tr>
          <td> Company name </td>
          <td> <input type="text" name="company" size=15 
                    onChange(nullCheck();) /> </td>
        </tr>
        <tr>
          <td> Registration Number </td>
          <td> <input type="text" name="regno" size=15 /> </td>
        </tr>
        <tr>
          <td> URL </td>
          <td> <input type="text" name="url" size="25" /> </td>
        </tr>
        <tr>
          <td> Quota </td>
          <td>
            <select name="quota" onChange(nullCheck();) >
              <option value="1">0</option>
              <option value="2">10000</option>
              <option value="3">50000</option>
              <option value="4">10000</option
            </select>
            in kb's
          </td>
        </tr>
      </table>
      </center>

    </form>


Om de een of andere reden werkt e.e.a. dus niet. Mijn javascript debugger uit mijn browser(s) (zowel galeon als Firebrd) geven geen output. Die vinden het allemaal goed. Kan iemand mij vertellen wat ik verkeerd doe (of waar ik overheen zit te lezen)

Egoist: A person of low taste, more interested in themselves than in me


  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

ik mis nog een functie en wel de isNull functie, hoe ziet die eruit? (note dat een lege string !== null)
En is NS4/IE4 ondersteuning echt van belang? Je code zou zoveel eenvoudiger worden als dat niet noodzakelijk is.

[ Voor 10% gewijzigd door crisp op 05-09-2003 00:43 ]

Intentionally left blank


  • JaQ
  • Registratie: Juni 2001
  • Laatst online: 21-08 17:50
crisp schreef op 05 September 2003 @ 00:39:
ik mis nog een functie en wel de isNull functie, hoe ziet die eruit? (note dat een lege string !== null)
En is NS4/IE4 ondersteuning echt van belang? Je code zou zoveel eenvoudiger worden als dat niet noodzakelijk is.
Je zit me toch niet te vertellen dat JS de isNull test niet kent? (ja, ik ben een javascript n00b, ben al heel trots dat ik die <div> switch werkt).

Ik zou dus gewoon een test moeten doen die vergelijkt =="" ?? (als ik je goed begrijp?)

Egoist: A person of low taste, more interested in themselves than in me


  • Woudloper
  • Registratie: November 2001
  • Niet online

Woudloper

« - _ - »

DrFankenstoner :: je kan de oversteuning voor NS4 laten vallen, dat scheelt weer een extra stukje code :P

edit:
|:( dom, had het commentaar van crisp niet goed gelezen. Ik val in de herhaling

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

DrFrankenstoner schreef op 05 September 2003 @ 00:51:
[...]
Je zit me toch niet te vertellen dat JS de isNull test niet kent? (ja, ik ben een javascript n00b, ben al heel trots dat ik die
switch werkt).
JavaScript:
1
alert(typeof(window.isNull)); // 'undefined'

nee, die methode bestaat dus niet, hoewel je 'm wel zelf zou kunnen maken:
JavaScript:
1
2
3
function isNull(val) {
  return (val===null); // strict type!
}
Ik zou dus gewoon een test moeten doen die vergelijkt =="" ?? (als ik je goed begrijp?)
Ja, je kan idd gewoon met een lege string vergelijken, of in de functie isNull hierboven ook true teruggeven bij een lege string :)

edit: de reden dat je hier niet de verwachte foutmelding op krijgt ligt hierin:
HTML:
1
<select name="quota" onChange(nullCheck();) >

event handlers toekennen doe je nl zo:
HTML:
1
<select name="quota" onChange="nullCheck()">

[ Voor 16% gewijzigd door crisp op 05-09-2003 08:54 ]

Intentionally left blank


  • Bosmonster
  • Registratie: Juni 2001
  • Laatst online: 19-08 22:14

Bosmonster

*zucht*

kleinigheidje:

var ns4 = (document.layers);

Daar zou ik ff het volgende van maken (zelfde voor andere checks)

var ns4 = (document.layers) ? true : false;

Want nu doe je niks anders dan die hele layers-array kopieren ipv een boolean overhouden die aangeeft of die bestaat of niet ;)

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

of nog mooier:

JavaScript:
1
var ns4 = (typeof document.layers == 'undefined') ? false : true;


ik zal nog wel eens een stukje schrijven over strict warnings

Intentionally left blank


Verwijderd

PSsst. Crisp! undefinded?

[ Voor 14% gewijzigd door Verwijderd op 05-09-2003 11:07 ]


  • JaQ
  • Registratie: Juni 2001
  • Laatst online: 21-08 17:50
okay.. het aanroepen van de check deed ik inderdaad op compleet de verkeerde manier |:( wel erg dom eigenlijk, maar goed. dat doe ik nu dus netjes met
code:
1
<input type=text name="name" onChange="nullCheck()" />


De nullcheck functie heb ik hierin veranderd:

code:
1
2
3
4
5
6
7
8
9
10
function nullCheck() {
    if  ( documents.forms['tso'].elements['name'].value=="" ||
          documents.forms['tso'].elements['company'].value=="" || 
          documents.forms['tso'].elements['quota'].value=="")
    {
          hide_obj('step1_ok'); show_obj('step1_error');
    } else {
          hide_obj('step1_error'); show_obj('step1_ok');
    }
  }


Dit zou al beter moeten werken, maar om een of andere reden doet het dat nog niet. Als ik alleen test of het name veld leeg is, werkt het ook niet en krijg ik ook geen errors in de javascript console van Firebird (die ik overigens erg brak vind, maar goed)

Ik weet zeker dat de hide_obj en show_obj functies werken. (die gebruik ik in een andere pagina ook, maar dan in een onClick event) dus die wil ik voorlopig even met rust laten. De browsercheck kan er uit als ik het goed begrijp, maar aangezien mijn javascript kennis niet zo hoog is, ga ik niets repareren wat niet kapot is ;) (dat kan altijd nog)

Het wordt dus tijd om die nullCheck functie verder te gaan debuggen (want scriptrequests doen is volgens mij niet de bedoeling ;) )

Egoist: A person of low taste, more interested in themselves than in me


  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

zet bovenin je nullCheck functie eens een alert om te kijken of 'ie wel aangeroepen wordt.
Ik weet niet of Firebird een andere JS console heeft dan Mozilla, maar de JS console van Mozilla vind ik altijd erg duidelijk en handig.

Intentionally left blank


  • JaQ
  • Registratie: Juni 2001
  • Laatst online: 21-08 17:50
ik heb m al gevonden.. het is document.forms[bla bla bla.. en dus niet documents.forms etc. etc.

Op zich is de javascript van Firebird dezelfde als die van Mozilla, maar Firebird wil wel continue de pagina uit cache pakken (en dat moet je m ff afleren)

Ok, in ieder geval erg bedankt allemaal!

Egoist: A person of low taste, more interested in themselves than in me


Verwijderd

Ook hier slotje erop dus !!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

DrFrankenstoner schreef op 05 September 2003 @ 11:40:
ik heb m al gevonden.. het is document.forms[bla bla bla.. en dus niet documents.forms etc. etc.

Op zich is de javascript van Firebird dezelfde als die van Mozilla, maar Firebird wil wel continue de pagina uit cache pakken (en dat moet je m ff afleren)

Ok, in ieder geval erg bedankt allemaal!
Dan krijg je toch een error in je console?
Maar dat soort stomme dingen zie je idd snel over het hoofd (ik ook dus ;) )

Intentionally left blank


  • JaQ
  • Registratie: Juni 2001
  • Laatst online: 21-08 17:50
crisp schreef op 05 September 2003 @ 11:42:
[...]

Dan krijg je toch een error in je console?
Maar dat soort stomme dingen zie je idd snel over het hoofd (ik ook dus ;) )
nope.. kreeg dus geen error (pas toen ik de value in een alert naar buiten gooide zag ik m.). Beetje vervelend, maar zoveel doe ik niet met javascript. Form validation gebeurd maar voor een klein gedeelte in Javascript. De rest in php en daarna wordt de data ook nog gevalideerd door de pl/pgsql functies die ik gebruik voor database acties (Dikke class met db functionaliteit in php dus, maar dat krijg je al snel als je een app hebt met 80+ tabellen)

Egoist: A person of low taste, more interested in themselves than in me


Verwijderd

Sorry, ik was te snel met mijn slotje

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

Verwijderd schreef op 05 September 2003 @ 11:59:
Sorry, ik was te snel met mijn slotje
idd, en laat dit soort opmerkingen achterwege aub...

Intentionally left blank

Pagina: 1