jquery probleme avec controle si formulaire vide

a marqué ce sujet comme résolu.
Auteur du sujet

Bonjour, j’ai un petit soucis avec jquery… J’ai un formulaire avec par défaut 2 champs, si l’un des 2 est vide le bouton envoyer se désactive. Cela fonctionne

Par contre j’ai aussi ajouter un bouton "+" qui permet d’ajouter des champs de texte, il fonction e aussi Mais le controle de ces champs ne marche pas, si il n’ya rien dedans le bouton envoyer est quand meme activer.

voici mon 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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<table class="form-table" id="customFields">

    <tr valign="top">
        <th scope="row"><label for="customFieldName1">Question</label></th>
        <div class="input-field col s12">
        <td>
            <input type="text" class="" id="customFieldQuestion" name="customFieldName[]" value="test" placeholder="Question"/> &nbsp;
            <input type="text" class="" id="customFieldReponse" name="customFieldValue[]" value="test" placeholder="Reponse"/> &nbsp;

        <a href="javascript:void(0);" class="remCF">Supprimer</a>
        </td>
        </div>

    </tr>

</table>

<a href="javascript:void(0);" class="btn waves-effect waves-light btn-large" id="addCF" >+</a>
<button class="btn waves-effect waves-light btn-large" form="formfaq" type="submit" id="go" name="go">
    Envoyer<i class="material-icons right">send</i>
</button>
</form>



<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-3.2.1.js"></script>


<script>
$(document).ready(function(){
    $("#addCF").click(function(){
        $("#customFields").append('<tr valign="top"><th scope="row"><label for="customFieldName1">Question</label></th><div class="input-field col s12"><td><input type="text" class="" id="customFieldQuestion" name="customFieldName[]" value="" placeholder="Question"/> &nbsp;<input type="text" class="" id="customFieldReponse" name="customFieldValue[]" value="" placeholder="Reponse"/> &nbsp;<a href="javascript:void(0);" class="remCF">Remove</a></td></div></tr>');
    });
    $("#customFields").on('click','.remCF',function(){
        $(this).parent().parent().remove();
    });
});
</script>

<script>
$(document).ready(function(){
    $('#go').attr('disabled',false);

    $('[id="customFieldQuestion"]').keyup(function(){
        if($(this).val().length !=0)
            $('#go').attr('disabled', false);            
        else
            $('#go').attr('disabled',true);
    })

    $('[id="customFieldReponse"]').keyup(function(){
        if($(this).val().length !=0)
            $('#go').attr('disabled', false);            
        else
            $('#go').attr('disabled',true);
    })
});
</script>

`

par avance merci pour votre aide

+0 -0

Ca ne résoudra pas ton problème mais pour l’id dans [id="customFieldQuestion"] on utilise "#", donc : #customFieldQuestion.

Ensuite il faut que tu vérifies chacun des éléments avant de décider de le réactiver. À ta place je ferais une fonction qui retourne false dès quel rencontre une erreur. Si tu arrives tout à la fin de la fonction tu retournes vrai. Pour tes champs textes, il suffira de boucler la vérification.

Tu ne peux pas déverrouiller un champ seulement avec une vérification dans keyup.

✈️ // 🐺 Ami des loups // 💡 LED-312 // 🐤 Twitter @A312_zds // :B // L’hiver vient // @**A-312** pour me ping

+0 -0
Vous devez être connecté pour pouvoir poster un message.
Connexion

Pas encore inscrit ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte