IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Déclencher un formulaire avec un écouteur sur image


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éprouvé
    Homme Profil pro
    Ingénieur en électrotechnique retraité
    Inscrit en
    Décembre 2008
    Messages
    1 718
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 73
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Ingénieur en électrotechnique retraité

    Informations forums :
    Inscription : Décembre 2008
    Messages : 1 718
    Par défaut Déclencher un formulaire avec un écouteur sur image
    Bonjour à tous,

    J'ai un formulaire qui contient un tableau, lequel contient à son tour une image. Je voudrais soumettre le formulaire lors du clic sur l'image.
    Source:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    <form method="post" name="tabForm" action="http://sirep.proginet.local/frontend/mainFormHandler.php" class="otherForms" data-tab="mail">
    	<h4>Nouveau courrier</h4>	<input type="hidden" name="id" value="0">
    	<label for="type">Forme</label><select name='type' id=''><option value='' label='&lt; ---- &gt;'></option><option value='1'>Lettre</option><option value='2'>Télécopie</option><option value='3'>Courriel</option></select><br>
    	<label for="date_mail">Date</label><input type="text" id="date_mail" name="date_mail" value="">
    		<div id="contactCal" class="calendarMain calendarInLine"></div><br>
    	<label for="subject">Objet</label><input type="text" id="subject" name="subject" value=""><br>
    	<input type="submit" name="savElem" value="Enregistrer">
     
    	<table style="border:1px solid grey; width:65rem; margin-top:5px;">
    		<thead><tr><th>Forme</th><th>Date</th><th>Objet</th><th>Référence</th><th>Emplacement</th><td></td><td></td></tr></thead>
    		<tbody>
    			<tr>
    				<td class='noDispl'>1</td><td>Lettre</td><td>14/12/2020</td><td>Edge ne respecte pas ma feuille de style pour un élément</td><td>MP1205</td><td><a href='C://win/users/documents/courrier/070320.doc'>C://path/070320.doc</a></td><td><a href='frontend/main.php?page=1&tab=5&id=1'><img src='../images/edit.png' title='Cliquez pour éditer'></a></td><td><img src='../images/del.png' title='Cliquez pour supprimer'></td>
    			</tr>
    			<tr>
    				<td class='noDispl'>2</td><td>Télécopie</td><td>27/12/2020</td><td>aucun</td><td>xxxx</td><td><a href='.....'>.....</a></td><td><a href='frontend/main.php?page=1&tab=5&id=2'><img src='../images/edit.png' title='Cliquez pour éditer'></a></td><td><img src='../images/del.png' title='Cliquez pour supprimer'></td>
    			</tr>
    		</tbody>
    	</table>
    </form>
    Code js : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    "use strict";
     
    const
    	tabForms	= document.querySelectorAll("[name='tabForm']")
    	,delImgs	= document.querySelectorAll("[src*='del.png']")
    	;
     
    if (delImgs.length){
    	delImgs.forEach(function(curImg){
    		console.log(curImg);
    		console.log(curImg.form); // retourne undefined
    	});
    }
    Dans le code html, j'ai essayé en variante:$line->addCell(new tabCell("<input type='image' src='../images/del.png' title='".getDBText($language,57)."'>"));Dans ce cas, l'image est grossie environ 10 fois sa taille d'origine (5cm au lieu de 5mm, soit 22px). Pourquoi? Je peux bien sûr diminuer l'image en css mais j'aimerais comprendre car un bouton ne fait généralement pas cette taille.

  2. #2
    Expert confirmé
    Avatar de javatwister
    Homme Profil pro
    danseur
    Inscrit en
    Août 2003
    Messages
    3 684
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Calvados (Basse Normandie)

    Informations professionnelles :
    Activité : danseur

    Informations forums :
    Inscription : Août 2003
    Messages : 3 684
    Par défaut
    De fait, en utilisant un input image, la propriété form sera disponible; et de toute façon, le formulaire sera soumis d'office;
    Je ne comprends pas du tout le reste de ton message;

  3. #3
    Membre éprouvé
    Homme Profil pro
    Ingénieur en électrotechnique retraité
    Inscrit en
    Décembre 2008
    Messages
    1 718
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 73
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Ingénieur en électrotechnique retraité

    Informations forums :
    Inscription : Décembre 2008
    Messages : 1 718
    Par défaut
    Ah oui, j'ai été dérangé pendant l'écriture de mon message et il y a une incompréhension liée au code php au lieu du rendu.

    En résumé, le remplacement de <img src='../images/del.png' title='Cliquez pour supprimer'> par <input type='image' src='../images/del.png' title='un rexte'>")) a eu pour conséquence de grossir anormalement la taille de l'image et du bouton. L'image est passée de 5mm (22 pixels) à 5 cm. J'ai maintenant compris pourquoi: Cela est du au code CSS des balises input.
    Mon problème est donc résolu.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Avec un click sur image, faire précédente
    Par Bydouille dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 20/10/2007, 13h20
  2. [DEBUTANT] Prolèmes avec le dessin sur image
    Par richard_sraing dans le forum C#
    Réponses: 1
    Dernier message: 09/04/2007, 11h43
  3. formulaire avec champ calcules sur access
    Par tobisko dans le forum Access
    Réponses: 3
    Dernier message: 08/09/2006, 13h52
  4. Réponses: 3
    Dernier message: 16/02/2006, 16h58
  5. Formulaire avec liste basée sur une autre table
    Par sabotage dans le forum Langage SQL
    Réponses: 6
    Dernier message: 10/08/2005, 13h43

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo