[Javascript] voor dummies - deel 4

Index

» digital corner

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
pi_41935369
Het heeft in ieder geval geen zin om iets wat je niet laat zien (display none) ook nog eens te verbergen (visibility hidden). Het makkelijkst is om een lijstje met id's te maken waarvan je er altijd maar 1 tegelijk laat zien.

1
2
3
4
5
6
7		var divs = ['AT', 'FG', 'P', 'C'];

function showDiv(id) {
   for (var i = 0; i < divs.length; i++) {
      document.getElementById(divs[i]).style.display = (divs[i] == id ? 'block' : 'none');
   }
}


Je zou die divs ook allemaal in een andere div kunnen zetten. Dan kan je door de divs heen lopen zonder dat je de id's in een lijstje hoeft te zetten.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_41949125
1
2
3
4
5
6
7		<input type="checkbox" name="allowed[]" value="2">
<input type="checkbox" name="allowed[]" value="2">
<input type="checkbox" name="allowed[]" value="2">
      <input class="button_140" type="button" value="Toevoegen"
         onclick="javascript:
            if (!document.new_page.allowed[].checked){ popupalert('allowed'); }
            else { this.form.submit(); }">


Dit is een stukje van mijn code. Dit staat in form met name new_page.

Ik wil graag dat hij een melding geeft als geen van de allowed checked is.. het aantal allowed is variabel. Hoe kan ik dit het beste aanpakken?
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_41953488
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15		function check_boxes(field)
{
var non_checked='0';
for (i = 0; i < field.length; i++)
   if(field[i].checked = false)
 { var non_checked = '1';
 }
}
if(non_checked)
{
alert ('je hebt niks geselecteerd');
}
}

onClick="check_boxes(document.new_page.allowed[])">


Zoiets, niet gechecked trouwens
pi_41953846
Dit gaat natuurlijk niet werken:
1document.new_page.allowed[].checked


1var allowed = document.forms['new_page'].elements['allowed[]'];

Hiermee krijg je een array met al je allowed[] checkboxen. Daar moet je dan even doorheen loopen om te kijken of er een checked is.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_41954635
tenks met de combinatie kom ik in de goede richting. rest gaat wel lukken!

[edit]
1
2
3
4
5
6
7
8
9
10
11
12		   function check_boxes(){
      var non_checked2 = document.forms['new_page'].elements['allowed[]'];      
      for (i = 0; i < non_checked2.length; i++){
         if(non_checked2[i].checked == false){
            var non_checked = '1';
         }
         else {
            return true;
         }
      }
      return false;
   }


dit is hem geworden. werkt goed

[edit2]
1
2
3
4
5
6
7
8
9		   function check_boxes(){
      var non_checked2 = document.forms['new_page'].elements['allowed[]'];      
      for (i = 0; i < non_checked2.length; i++){
         if(non_checked2[i].checked == true){
            return true;
         }
      }
      return false;
   }


en zo istie zonder de dingen die dr niet in hoeven

[ Bericht 55% gewijzigd door Desdinova op 19-09-2006 16:46:33 ]
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_41954871
Edit: zie dat je zelf al wat hebt
pi_41958131
" == true" is natuurlijk overbodig.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_41970599
Hoe zorg ik ervoor dat als ik in een dropdown menu een bepaalde optie selecteer (bijvoorbeeld: "Anders, namelijk:") dat er dan een eerder disabled textfield enabled wordt.

Als je dan weer een andere optie kiest dan moet ie weer disabled worden.

Ik heb nu dit, maar hij enabled niet meer nadat hij disabled is..

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22		<script type="text/JavaScript">
<!--
function disableField(targ,selObj,restore)
{
   if (selObj != 1)
   {
      document.form1.emailaddress.disabled=true;
   }
   else
   {
      document.form1.emailaddress.disabled=false;
   }
}
//-->
</script>

    <select name="select" onchange="disableField('parent',this,0)">
      <option value="1">Zelf</option>
      <option value="0">Iedereen</option>
      <option value="0" selected="selected">Abonnees</option>
    </select>
    <input type="text" name="emailaddress"/>
pi_41974194
quote:
Op woensdag 20 september 2006 00:11 schreef Siegfried het volgende:
Hoe zorg ik ervoor dat als ik in een dropdown menu een bepaalde optie selecteer (bijvoorbeeld: "Anders, namelijk:") dat er dan een eerder disabled textfield enabled wordt.

Als je dan weer een andere optie kiest dan moet ie weer disabled worden.

Ik heb nu dit, maar hij enabled niet meer nadat hij disabled is..
[ code verwijderd ]
Je moet de waarde van de dropdown meegeven aan je disableFields() functie, en op basis daarvan gaan togglen.
  woensdag 20 september 2006 @ 08:54:40 #190
12880 CraZaay
prettig gestoord
pi_41974519
Probeer eens iets als this.value mee te sturen naar je method, ipv alleen this.
pi_41984803
1
2
3		function disableField(el) {
   document.forms['form1'].elements['emailaddress'].disabled = (el.value == '1');
}


En dan aanroepen met onchange="disableField(this)"
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_42007794
Ik wil em eigenlijk graag aanroepen met de naam van het textfield, die ik dan als variable kan gebruiken binnen de functie.. Maar dat krijg ik maar niet werkend:

1
2
3
4
5
6
7
8
9		function disableField(field)
{
      document.form1.+field.value+.disabled=true;
}

function enableField(field)
{
      document.form1.+field.value+.disabled=true;
}


1
2
3
4
5
6
7
8
9		<p>Verzend-adres: 
    <select name="select">
      <option onclick="javascript:disableField(sender-adress)">info@domein.nl</option>
      <option onclick="javascript:disableField(sender-adress)">noreply@domein.nl</option>
      <option onclick="javascript:disableField(sender-adress)">nieuwsbrief@domein.nl</option>
      <option onclick="javascript:enableField(sender-adress)">Anders..</option>
    </select>
    <input type="text" name="sender-address"/>
  </p>


Op deze manier moet het toch ook kunnen? Vast niet met de code die ik geschreven heb, maar ik ben dan ook nog niet zo thuis in Javascript..
pi_42007924
.value moet zoiezo weg want disabled is geen value
verder kunnen de plusjes ook weg want . is al plus

denk ik
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_42008044
plus dat je op een option geen onClick kan doen.

Je moet de value doorgeven in de onclick functie. Pas in je javascript ga je diezelfde value vergelijken en op basis daarvan ga je togglen.

[ Bericht 63% gewijzigd door #ANONIEM op 21-09-2006 09:56:13 ]
pi_42008066
Nou, ik had het eerder werkend met onClick.
Maar dat was slechts voor 1 textfiedl. Nu wilde ik hem herbruikbaar maken..
pi_42008078
quote:
Op donderdag 21 september 2006 09:56 schreef Siegfried het volgende:
Nou, ik had het eerder werkend met onClick.
Maar dat was slechts voor 1 textfiedl. Nu wilde ik hem herbruikbaar maken..
Ja, en dat kan met de code van SuperRembo!
pi_42008148
quote:
Op donderdag 21 september 2006 09:57 schreef Scorpie het volgende:

[..]

Ja, en dat kan met de code van SuperRembo!
Hoe dan?
Want het form en element staan er vast in..

Hoe maak ik dat variabel?
pi_42009957
je zou onchange kunnen gebruiken in je select, met als value this.value. moet je wel je options een value meegeven
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_42010094
quote:
Op donderdag 21 september 2006 10:01 schreef Siegfried het volgende:

[..]

Hoe dan?
Want het form en element staan er vast in..

Hoe maak ik dat variabel?
element kan je meegeven, form kan je vast ook wel wat mee verzinnen, mits je maar google gebruikt...
pi_42010539
quote:
Op donderdag 21 september 2006 11:23 schreef Scorpie het volgende:

[..]

element kan je meegeven, form kan je vast ook wel wat mee verzinnen, mits je maar google gebruikt...
Denk niet dat ik niet google en niet zelf probeer, maar als je niet waar op te zoeken of wat te proberen dan vind je bar weinig kan ik je vertellen
pi_42011485
quote:
Op donderdag 21 september 2006 11:40 schreef Siegfried het volgende:

[..]

Denk niet dat ik niet google en niet zelf probeer, maar als je niet waar op te zoeken of wat te proberen dan vind je bar weinig kan ik je vertellen
http://www.google.nl/search?hl=nl&q=javascript+disable+field&meta=

Google; Javascript disable fields.

Duizenden hits.
pi_42013137
quote:
Op donderdag 21 september 2006 12:15 schreef Scorpie het volgende:

[..]

http://www.google.nl/search?hl=nl&q=javascript+disable+field&meta=

Google; Javascript disable fields.

Duizenden hits.
das niet echt een relevante search he hoeveel items zou je af moeten gaan om te vinden wat hij zoekt? en je kan wel op elke vraag gaan roepen dat ze moeten googlen. vooral in het begin is het beter om mensen met wat extra uitleg te helpen zodat ze weten wat ze aan het doen zijn ipv zomaar scripts overnemen van een voorbeeld, dan hebben ze de volgende keer hetzelfde probleem. nofi
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_42015994
quote:
Op donderdag 21 september 2006 12:15 schreef Scorpie het volgende:

[..]

http://www.google.nl/search?hl=nl&q=javascript+disable+field&meta=

Google; Javascript disable fields.

Duizenden hits.
Hoe ik velden moet disablen weet ik wel, maar hoe ik dit dynamisch krijg; dat was de vraag.

@Desdinova: Thanks, zo denk ik er ook over.
Op andere gebieden ben ik ook niet te beroerd om mensen te helpen.
pi_42016666
*Zucht* Nou vooruit dan maar

Even wat code gejat van mijn werk:

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		/**
 * disableFields is used to disable the form fields.
 * example: checkThis(this, 'fieldName',resetValue)
 *
 * @param thisField = the Object that calls the function, for reference.
 * @param fieldNames String defining the field that needs to be disabled
 * @param reset Boolean indicating wether or not the fieldName value should be set before disabling.
 * @param defaultValue value to which the fieldname should be set before disabling.
 * @author Scorpie
 */
function disableFields(thisField,fieldNames,reset,defaultValue,formName,index)
{
  // split fieldNames into an array for further processing
   var fieldNames_array = fieldNames.split(",");

  if(thisField.checked==true)
  {
   for(i=0;i<fieldNames_array.length;i++){
   
       // this method is used so that in the future we can easily extend it with other field types for reuse.
      if(reset == true){
       if(document.getElementById(fieldNames_array[i]).getAttribute("type") == "select-one"){
            
         // default value to which the option select box should point at when disabling. 
         // -1 is default, indicating that it will jump back to its original value.
       document.getElementsByName(fieldNames_array[i])[index].selectedIndex = -1;
       document.getElementsByName(fieldNames_array[i])[index].setAttribute("value","");
       }
      }
    document.getElementsByName(fieldNames_array[i])[index].disabled = true;
    }
  } else {
     for(i=0;i<fieldNames_array.length;i++){
      document.getElementsByName(fieldNames_array[i])[index].disabled = false;
      document.getElementsByName(fieldNames_array[i])[index].setAttribute("value","");
   }
  }
}


en als aanroep bijvoorbeeld:

disableFields(this,'type1,type2',true,'-1','type3',"+index+")";

Dit is de wat uitgebreidere versie waarin je meerdere velden kan disablen met een comma separated string te gebruiken.

[ Bericht 1% gewijzigd door WyriHaximus op 07-04-2010 10:23:44 ]
pi_42018278
ben trots op je scorpie
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_42018454
quote:
Op donderdag 21 september 2006 16:25 schreef Desdinova het volgende:
ben trots op je scorpie
pi_42022126
1
2		document.getElementsByName(fieldNames_array[i])[index].selectedIndex = -1;
document.getElementsByName(fieldNames_array[i])[index].setAttribute("value","");

Dit is niet bepaald optimaal. getElementsByName is blijkbaar een user defined function, daar zal ook aardig wat overhead in zitten. Deze functie wordt twee keer aangeroepen met dezelfde parameter, dat betekend dat er een keer onnodig door de DOM wordt gezocht.
Ook vreemd dat setAttribute wordt gebruikt om de value te zetten, waarom zou je dat niet gewoon via de value property doen?

Geen lekker scriptje.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_42022294
quote:
Op donderdag 21 september 2006 18:32 schreef SuperRembo het volgende:

[ code verwijderd ]

Dit is niet bepaald optimaal. getElementsByName is blijkbaar een user defined function, daar zal ook aardig wat overhead in zitten. Deze functie wordt twee keer aangeroepen met dezelfde parameter, dat betekend dat er een keer onnodig door de DOM wordt gezocht.
Ook vreemd dat setAttribute wordt gebruikt om de value te zetten, waarom zou je dat niet gewoon via de value property doen?

Geen lekker scriptje.
getElementsByName is GEEN user defined function, maar gewoon onderdeel van Javascript.

http://msdn.microsoft.com(...)etelementsbyname.asp

getElementsByName is dus niks anders dan getElementByName, maar dan met het verschil dat er meerdere objecten worden teruggegeven bij de aanroep, dit omdat wij op onze pagina`s meerdere selectboxen (in dit geval ) gebruiken met dezelfde naam.

Het klopt als je zegt dat er twee keer een call wordt gedaan naar deze functie, aangezien je twee attributen van deze elementen wil zetten: het attribuut "disabled' en het attribuut 'selectedIndex'. Volgens mij kan dit niet anders, alhoewel ik het mis kan hebben.


Daarnaast geef je wel een mooie opmerking met "geen lekker scriptje", maar een alternatief posten doe je niet?

[ Bericht 8% gewijzigd door #ANONIEM op 21-09-2006 18:40:42 ]
pi_42022328
@ Scorpie: Thanks! Ik ga eens kijken of ik het aan de praat krijg

@ SuperRembo: Maar hoe krijg ik mijn enkel regelig scriptje dan werkend, want dat zou toch moeten kunnen neem ik aan?
pi_42030283
quote:
Op donderdag 21 september 2006 18:38 schreef Scorpie het volgende:
getElementsByName is GEEN user defined function, maar gewoon onderdeel van Javascript.
Ah, foutje van mij. Maar waarom wordt dan alleen het element met die ene index gedisabled? Vaag.
quote:
Het klopt als je zegt dat er twee keer een call wordt gedaan naar deze functie, aangezien je twee attributen van deze elementen wil zetten: het attribuut "disabled' en het attribuut 'selectedIndex'. Volgens mij kan dit niet anders, alhoewel ik het mis kan hebben.
Wat dacht je er van om een variabele te gebruiken?
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[Javascript] voor dummies - deel 4
Index

» digital corner

Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')