Waarom moet ik 2 keer klikken ?

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Ventilatiesysteem Productontwikkelaar HBO WO Verwa

Samengevat: Zij bieden flexibele ventilatiematerialen, geluidsdempers, rookgasafvoer producten en industrieslangen. Ben jij een technisch productontwikkelaar? Heb jij ervaring met het ontwikkelen van nieuwe producten? Vaste baan: Technisch Productontwikkelaar HBO WO €3.000 - €4.000 Zij bieden een variëteit aan flexibele ventilatiematerialen, geluiddempers, rookgasafvoer producten, industrieslangen en ventilatieslangen voor de scheepsbouw. Met slimme en innovatieve materialen zorgen wij voor een gezonde en frisse leefomgeving. Deze werkgever is een organisatie die volop in ontwikkeling is met hardwerkende collega's. Dit geeft goede ontwikkelingsmogelijkheden. De branche van dit bedrijf is Techniek en Engineering. Functie: Voor de vacature als Technisch Productontwikkelaar Ede Gld HBO WO ga

Bekijk vacature »

Yoeri Achterbergen

Yoeri Achterbergen

09/09/2014 15:57:05
Quote Anchor link
Hallo,

Ik heb een code geschreven die misschien al bestaat. Het gaat erom dat als het veld leeg is dus gelijk is aan 0 dat het veld moet gaan shaken.

Het werkt, alleen ik moet hiervoor dubbelklikken voordat het functioneerd. Kan iemand mij vertellen wat hier niet goed gaat?

Het script is als volgt:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
Code:
<doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/stylesheet.css" />
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery-ui.min.js" type="text/javascript"></script>
</head>
<body>
    
<form >
<input type="text" class="hah" id="remark1" name="remark1">
<br/>
<button onclick="valideer()" >valideer</button>
    </form>

<script type="text/javascript">

function valideer(){
    var remark=document.getElementById('remark1');
    if (remark.value.length == 0){
        $(".hah").effect('shake', 500 );
        return false;
    }
}
</script>

</body>
</html>


Deze vraag heb ik ook in een ander forum gesteld, alleen kreeg ik geen respons hierop vandaar dat ik het hier plaats.

gr. Yoeri

Link van ander forum weggehaald, PHPhulp is natuurlijk veel leuker :)[/modedit]
Gewijzigd op 09/09/2014 16:59:41 door Nick Dijkstra
 
PHP hulp

PHP hulp

28/12/2024 09:48:02
 
Frank Nietbelangrijk

Frank Nietbelangrijk

09/09/2014 17:38:16
Quote Anchor link
Het probleem is dat je formulier direct verzonden wordt en de pagina dus opnieuw ingeladen wordt. Hierdoor wordt javascript stop gezet en je effect niet meer getoond.

Je zult dus een extra attribuut aan de <button> moeten meegeven: type="button" om te voorkomen dat het formulier verstuurd wordt.

Dan kun je de if uitbreiden met een else waarbij je het formulier gaat verzenden als de validatie correct is.

Het valt me op dat je nog niet heel erg volgens de jQuery standaard programmeert dus ik heb het enigszins gewijzigd.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
<!doctype html>
<html>
<head>
<meta charset="utf-8">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
</head>
<body>
    
<form id="myForm">
    <input type="text" class="hah" id="remark1" name="remark1"><br/>
    <button type="button" id="validate" >valideer</button>
</form>

<script type="text/javascript">

$(document).ready(function() {
    $('#validate').click(function(e) {
        if($('#remark1').val().length == 0) {
            $(".hah").effect('shake', 500 );
            return false;
        } else {
            $( "#myForm" ).submit();
        }
    });
});
</script>

</body>
</html>
Gewijzigd op 09/09/2014 17:39:36 door Frank Nietbelangrijk
 
Yoeri Achterbergen

Yoeri Achterbergen

10/09/2014 08:56:22
Quote Anchor link
Beste Frank,


Dank voor de oplossing! Ik had het inderdaad niet logisch geprogrammeerd.
alleen waar staat de (e) achter function voor? het is de eerste keer dat ik dat zie.

Gr. Yoeri
 
Jop B

Jop B

10/09/2014 09:58:25
Quote Anchor link
Beste,

Hier heb ik ook nog een vraag over :)

Ik heb een formulier gemaakt met radio buttons. Als het antwoord "ja" is, word er geen functie uitgevoerd.
Is het antwoord "nee" dan word er een veld d.m.v. fade in getoond. Dit werkt helemaal na behoren. (een poll)

Wat ik graag zou willen als het invulveld actief is "antwoord=nee" dat er gekeken word of er iets is ingevuld, is dit niet dan shake het desbetreffende veld.

Nu kan ik natuurlijk voor alle vragen het script kopiëren, maar het zou handiger zijn als ik dat onder een code kan schrijven.

Dit is mijn script zonder de shake functie

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
$(document).ready(function(){
        $('input[type="radio"]').click(function(){
            if($(this).attr("value")=="problem-No"){
                $(".remark1").fadeIn(1000);
        $(".remark1").prop('required',true);
          
            }
            if($(this).attr("value")=="problem-Yes"){
                $(".remark1").fadeOut(500);
        $(".remark1").prop('required',false);
            }
            
        });


        $('input[type="radio"]').click(function(){
            if($(this).attr("value")=="improve-Yes"){
                $(".remark2").fadeIn(1000);
        $(".remark2").prop('required',true);
            }
            if($(this).attr("value")=="improve-No"){
                $(".remark2").fadeOut(500);
        $(".remark2").prop('required',false);
            }
            
        });

        $('input[type="radio"]').click(function(){
            if($(this).attr("value")=="remark-Yes"){
                $(".pollmessage").fadeIn(1000);
        $(".pollmessage").prop('required', 'true');

            }
            if($(this).attr("value")=="remark-No"){
                $(".pollmessage").fadeOut(500);
        $(".pollmessage").prop('required', false);
            }
            
        });
    });


Wie o wie kan mij op weg helpen?

Groetjes Jop

Toevoeging op 10/09/2014 11:33:44:

Toevoeging op vorige bericht

Ik werk met 3 vragen.

Als er op de button word geklikt moet er worden gekeken of de velden actief zijn en of ze zijn ingevuld. is de value gelijk aan 0 shake het / de veld / velden wat leeg zijn, ander verstuur.

wat moet ik meegegeven in het script?

het is nu namelijk zo dat als de vraag met nee word beantwoord dat er een required true word meegeven, is het ja dan is requird false.
 
Frank Nietbelangrijk

Frank Nietbelangrijk

10/09/2014 18:03:56
Quote Anchor link
Yoeri: de e staat voor event. En event staat hier voor gebeurtenis. Het is een variabele die extra informatie oplevert bij een bepaalde gebeurtenis. Bij een .click() event (als er op het element geklikt wordt met de muis) is dit niet zo interessant maar bij een .keypress() event (als er op een toets gedrukt wordt) dan heeft de event variabele de informatie in zich op welke toets er gedrukt is.

Hier een voorbeeld van stackoverflow.com van een <input> die enkel cijfers accepteert:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$(document).ready(function() {
    $("#txtboxToFilter").keydown(function (e) {
        // Allow: backspace, delete, tab, escape, enter and .
        if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
             // Allow: Ctrl+A
            (e.keyCode == 65 && e.ctrlKey === true) ||
             // Allow: home, end, left, right
            (e.keyCode >= 35 && e.keyCode <= 39)) {
                 // let it happen, don't do anything
                 return;
        }
        // Ensure that it is a number and stop the keypress
        if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
            e.preventDefault();
        }
    });
});
Gewijzigd op 10/09/2014 18:04:32 door Frank Nietbelangrijk
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.