Forum : Comment cacher par défaut un formulaire HTML via JavaScript ?

J'ai déjà poster une question du même genre en début de journée, mais je l'ai supprimée. Je la reformule plus clairement :

Voila mon code :

function visibilite(thingId) {

    var targetElement;
    targetElement = document.getElementById(thingId) ;

    if (targetElement.style.display == "none") {
        targetElement.style.display = "" ;
    }
    else {
        targetElement.style.display = "none" ;
    }

}

Puis le lien <a> qui me permet d'afficher ou cacher le formulaire :

<a href="" onclick="javascript:visibilite('form_create'); return false;" >Afficher/cacher le formulaire de création d'une news</a>

Ma question étant : comment faire pour que lorsque je lance ma page le formulaire soit cacher par défaut ?
Actuellement quand je lance cette page, le formulaire est afficher et lorsque je clique sur le lien, il se cache, puis si je reclic, il se ré affiche.

the_sheep

Réponse acceptée

maintenant si tu veux tu peux simplifier le tout

$(document).ready(function(){

$('#form_create').hide();

$(#id_lien_qui_efface).toggle(function(){
$('#form_create').hide();
}, function(){
$('#form_create').show();
});

});

avec un peu de logique tu peux comprendre comment marche ce code...

the_sheep

met ce code au début de ton code js

var variable = document.getElementById('form_create');
variable.style.visibility = "hidden";

théoriquement ça devrait marcher...

welcoMattic

Auteur

J'ai bien mis ton morceau de code au début du mien, mais malheureusement ça ne fonctionne pas, lorsque je lance la page, le formulaire est toujours afficher .. Je ne comprend pas pourquoi

the_sheep

bizarre ...

ton site est-il en ligne ?

welcoMattic

Auteur

Project_0

Je t'en pris en prête pas attention au design, un jour un prof m'a dit (avec l'accent su sud) : "Le design(e) c'est à la fin(g) !"

Depuis je ne m'en suis pas remis ^^

HEHE le soucis c'est que c'est dans admin news ! je t'ai fait un user, sois gentil ne fait pas n'importe quoi ;) même si il n'y a rien d'important ;)

Id : userweb
Pass : 0000

the_sheep

bon ok j'ai vu que t'avais la lib jquery donc juste au début de ton script tu fait
$('#form_create').hide();

welcoMattic

Auteur

Oui, et justement question parallèle, y a t-il un moyen plus simple de faire ce genre de chose avec jQuery ?

J'ai coller ta ligne de code au début de mon script (avant function) et m^me résultat ça ne fonctionne pas ...

bertrand15

J'ai été visité un peu ton espace admin. (test de resistance, c'est moi ;)) cet espace admin te servira pour ton site ?!

tagcash

heu, effectivmement si tu a jquery tu peut joué avec sa pour cacher et afficher, mais sinon, je suis pas expert mais un display:none; en css sur l'id:form_create marcherais si je ne me trompe pas...

welcoMattic

Auteur

@bertrand15 : oui cet admin me servira plus tard, mais elle n'est pas finie, la sécurité laisse un peu à désirer là ^^

@tagcash : Bah j'ai essayer je me suis dis en css je le cache, et avec JS je lui dis : si il est cacher, affiche le, sinon cache le. Eh bah rien à faire il veut pas

the_sheep

ben oui le jquery c'est fait a la base pour simplifier le javascript.
j'ai compris d'ou venait le problème

quand tu efface le form en js le DOM est pas chergé donc il ne le prend pas en compte

$(document).ready(function(){
$('#form_create').hide();

});
colle sa au début de ton script et la c'est sur que ça va marcher

welcoMattic

Auteur

YEAH ! Enfin ça fonctionne ! j'ai chercher de mon côté, mais même sur un certain site d'apprentissage pour les z'héros (pour ne pas le citer) pas moyen de trouver une solution. Et comme je débute en JS ..

Bref merci beaucoup en tout cas !

PS : Évidement je supprime le compte d'admin créer pour l'occaz ^^

welcoMattic

Auteur

Effectivement comme à peu près tout les codes exécutés côté client j'arrive a les comprendre, mais pas à les écrire. Ca viendras ^^ peut être grâce a Grafikart, qui sait

welcoMattic

Auteur

J'ai chercher ce qu'était toggle sur le net, et apparemment on peut personnaliser les animations d'apparition et de disparition ? Si oui, avec quelle instruction ?

the_sheep

y a plusieurs fonction pour les animation (voir : http://jquery.developpeur-web2.com/documentation.php )

dans ton cas je te conseil le déroulement comme ça il n'y aura pas de saut brut donc à la place de hide() : slideUp()

et à la place de show() : slideDown()

welcoMattic

Auteur

Il faut vraiment que je me mette a voir jQuery et le javascript en général, c'est plutôt sympatoche ce qu'on peut faire avec ! Merci beaucoup le mouton ;)

the_sheep

:) oublie pas de marqué résolu (ou je sais pas quoi d'équivalent )

Comment cacher par défaut un formulaire HTML via JavaScript ?

17 réponses