Sujet Précédent Sujet Suivant

Incorporation de formulaire contact

Résolu/Fermé
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020 - 21 juil. 2020 à 15:15
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020 - 22 juil. 2020 à 16:27
Bonjour,

bonjour, je suis un mouton débutant voire ultra débutant, j'utilise magix webdesigner premium , un logiciel de fabrication de site WYSIWYG.
j'ai un serveur (lws) avec myphpsql, et un ftp compris dans l'hebergement, je suis entrain de faire un site déjà bien avancé :
https://www.medifactu.fr

j'ai voulu intégrer un formulaire de contact qu'on fait online via jqueryform à qui j'ai payé le café 5 dollars pour ma contribution.Une fois finalisé mon formulaire, je le télécharge et j'obtiens plein de fichiers genre ceux là:
vendor.js
vendor.css
phpmailer.php
jqueryform.com.min.js
form.lib.php
form.html
form.config.php
admin.php

j'ai réussi à intégrer le form.html dans la page témoignages mais c'est tout.
le captcha ne fonctionne pas, pas de redirection vers une page du site après avoir cliqué sur envoyer.... bref il sert à rien et pourtant il est complet, puisque j'ai tout paramétré en ligne ce formulaire avant de le télécharger
mais alors je met le php où, le js je le met où, le css j'en fais quoi? je ne sais pas m'en servir de my phpsql... j'arrive juste à intégrer des fichiers dans ma base ftp

s'il vous plait aidez-moi suis bloquée depuis plusieurs jours

Configuration: Windows / Chrome 83.0.4103.116

3 réponses

Réponse 1 / 3
jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024 4 694
21 juil. 2020 à 16:44
Bonjour,

Le fichier form.html doit contenir les "liens" vers les fichiers JS
Je suppose que tu dois placer tous les autres fichiers dans le même dossier que ton form.html

Mais tu devrais nous partager le contenu de ton fichier form.html

NB: Pour poster ton code, merci avant, de lire COMPLÉTEMENT les consignes données ici :
https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
0
Réponse 2 / 3
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020
Modifié le 21 juil. 2020 à 22:07
Merci pour ton post jordane
voici le code, j'espère que ça n'a pas d'incidence sur la sécurité :) 

<!--
Copyright 2020 JQueryForm.com
License: http://www.jqueryform.com/license.php

FormID: jqueryform-6968f2
Date: 2020-07-20 07:15:05
Generated by http://www.jqueryform.com
-->
<!DOCTYPE html>
<html lang="en">

<head>

  <meta charset="utf-8">
  <meta name="generator" content="jqueryform.com">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->

  <title>Formulaire témoignages Medifact'U :: Generated By JQueryForm.Com</title>
  
  <meta name="description" content="Formulaire pour recueillir votre avis sur la société Médifact'U">
  
  <meta name="keywords" content="Formulaire, avis, clients, écrire, recueillir,">
  
 
  

  <!-- Bootstrap -->
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" rel="stylesheet">
  <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/css/bootstrap-datepicker3.min.css" rel="stylesheet">
  

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->

  <link href="vendor.css" rel="stylesheet">

<style type="text/css">
body{
  background-color: transparent;
}

.jf-form{
  margin-top: 28px;
}

.jf-form > form{
  margin-bottom: 32px;
}

.jf-option-box{
  display: none;
  margin-left: 8px;
}

.jf-hide{
  display: none;
}

.jf-disabled {
    background-color: #eeeeee;
    opacity: 0.6;
    pointer-events: none;
}

/* 
overwrite bootstrap default margin-left, because the <label> doesn't contain the <input> element.
*/
.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
  position: absolute;
  margin-top: 4px \9;
  margin-left: 0px;
}

div.form-group{
  padding: 8px 8px 4px 8px;
}

.mainDescription{
  margin-bottom: 10px;
}

p.description{
  margin:0px;
}

.responsive img{
  width: 100%;
}

p.error, p.validation-error{
  padding: 5px;
}

p.error{
  margin-top: 10px;
  color:#a94442;
}

p.server-error{
  font-weight: bold;
}

div.thumbnail{
  position: relative;
  text-align: center;
}

div.thumbnail.selected p{
  color: #ffffff;
}

div.thumbnail .glyphicon-ok-circle{
  position: absolute;
  top: 16px;
  left: 16px;
  color: #ffffff;
  font-size: 32px;
}

.jf-copyright{color: #888888; display: inline-block; margin: 16px;display:none;}

.form-group.required .control-label:after {
    color: #dd0000;
    content: "*";
    margin-left: 6px;
}

.submit .btn.disabled, .submit .btn[disabled]{
  background: transparent;
  opacity: 0.75;
}

/* for image option with span text */
.checkbox label > span, .radio label > span{
  display: block;
}

.form-group.inline .control-label,
.form-group.col-1 .control-label,
.form-group.col-2 .control-label,
.form-group.col-3 .control-label
{
  display: block;
}

.form-group.inline div.radio,
.form-group.inline div.checkbox{
  display: inline-block;
}

.form-group.col-1 div.radio,
.form-group.col-1 div.checkbox{
  display: block;
}

.form-group.col-2 div.radio,
.form-group.col-2 div.checkbox{
  display: inline-flex;
  width: 48%;
}

.form-group.col-3 div.radio,
.form-group.col-3 div.checkbox{
  display: inline-flex;
  width: 30%;
}

.clearfix:after {
   content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

</style>


</head>

<body>


<!-- ----------------------------------------------- -->
<div class="container jf-form">
<form data-licenseKey="****************" name="jqueryform-6******" id="jqueryform-********" action='admin.php' method='post' enctype='multipart/form-data' novalidate autocomplete="on">
<input type="hidden" name="method" value="validateForm">
<input type="hidden" id="serverValidationFields" name="serverValidationFields" value="">



<div class="form-group f1 required" data-fid="f1">
  <label class="control-label" for="f1">Votre Prénom/Votre Nom</label>

<div class="input-group"><span class="input-group-addon left"><i class="glyphicon glyphicon-user"></i> </span>
<input type="text" class="form-control" id="f1" name="f1" value=""    
    data-rule-required="true" data-msg-required="Ce champs requis."  />
</div>

  
</div>




<div class="form-group f2 required" data-fid="f2">
  <label class="control-label" for="f2">Email</label>

<div class="input-group"><span class="input-group-addon left"><i class="glyphicon glyphicon-envelope"></i> </span>
<input type="email" class="form-control" id="f2" name="f2" value=""   
    data-rule-email="true" 
    data-rule-required="true"  />
</div>
  
</div>




<div class="form-group f3 required" data-fid="f3">
  <label class="control-label" for="f3">Nous écrire</label>


<input type="text" class="form-control" id="f3" name="f3" value=""    
    data-rule-required="true" data-msg-required="Ce champs est requis."  />


  
</div>




<div class="form-group f6 " data-fid="f6">
  <label class="control-label" for="f6">Envoyer un fichier</label>

<input type="file" class="form-control" id="f6" name="f6"  value=""     data-maxFileSize="5000"  data-browseLabel="sélectionner" data-showUpload="false" data-showZoom="false"/>
  
</div>





<div class='form-group recaptcha'>
  <script type="text/javascript">
   function renderReCaptcha(){
    var jfKey = '*********************************************', // when form loaded from jqueryform.com
    realKey = '**********************************************',
    theme = 'light',
    key = -1 !== location.href.indexOf('jqueryform.com/') ? jfKey : realKey;
    grecaptcha.render( document.getElementById('g-recaptcha'), {
          'sitekey' : key,
          'theme' : theme
        });
   };
  </script>
  <script src="https://www.google.com/recaptcha/api.js?hl=fr&onload=renderReCaptcha&render=explicit" async defer></script>
  <div id='g-recaptcha' class='g-recaptcha col_field' data-theme='light' data-sitekey='6LdvrLMZAAAAANxGx8OQ0nDanB4DT5HpvKpSDcFW'></div>
</div>





<div class="form-group submit f0 " data-fid="f0" style="position: relative;">
  <label class="control-label sr-only" for="f0" style="display: block;">Submit Button</label>

  <div class="progress" style="display: none; z-index: -1; position: absolute;">
    <div class="progress-bar progress-bar-striped active" role="progressbar" style="width:100%">
    </div>
  </div>

  <button type="submit" class="btn btn-primary btn-lg" style="z-index: 1;">
    Submit
  </button>

</div><div class="clearfix"></div>

<div class="submit">
  <p class="error bg-warning" style="display:none;">
    Please check the required fields.  </p>
</div>

<div class="clearfix"></div>


</form>

<a href="http://www.jqueryform.com" target="_blank" class="jf-copyright">Powered by jqueryform.com</a>
</div>

<div class="container jf-thankyou" style="display:none;" data-redirect="" data-seconds="6">
  <h3>Votre message a bien été envoyé, Merci!!
{HTTP_HOST}</h3>
</div>
<!-- ----------------------------------------------- -->


<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/js/bootstrap-datepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/locales/bootstrap-datepicker.fr.min.js"></script>
<script type="text/javascript">
 $.fn.datepicker.defaults.language = 'fr';
</script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/additional-methods.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/2.1.0/jquery.scrollTo.min.js"></script>
<script src="vendor.js" ></script>

<script src="jqueryform.com.min.js?ver=v3.0.3&id=jqueryform-6968f2" ></script>




<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.3.6/js/locales/fr.min.js"></script>
<script>
// tell jquery fileinput plugin init with selected lanaguage
fileinputLanguage = 'fr';
</script>


<script type="text/javascript">

 // start jqueryform initialization
 // --------------------------------
 JF.init( '#' + $('.jf-form > form:first-child').attr('id') );

</script>

  </body>
</html>


EDIT : Suppression des "clés"
0
jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024 4 694
21 juil. 2020 à 17:44
C'est bien ce que je te disais...
Il faut placer les différents fichiers au même endroit sur ton serveur.
0
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020 > jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024
21 juil. 2020 à 18:05
Merci Jordane pour la suppression des clés, à quoi vois tu que ce n'est pas dans le même dossier? le tout est en zip, dois je dézipper?
Et en ce qui concerne les cles, la clé reele est laquelle et la clée secrète?
0
jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024 4 694 > pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020
21 juil. 2020 à 20:21
Bien entendu que tu dois tout dezpipper....
Et placer les fichiers dans le même dossier que ton formulaire.
0
jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024 4 694 > pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020
21 juil. 2020 à 20:44
IL n'y a plus d'info "perso" dans ton code et je ne vois rien dans tes différents messages.
il est donc inutile de demander la suppression de la discussion.

Si tu vois encore des infos sensibles... je les retirerai (si tu me dis où).. mais pas de suppression complète de la discussion qui pourrait servir à d'autres ( c'est le principe du forum)
0
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020 > jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024
21 juil. 2020 à 22:06
oui j'ai vu mon nom et prénom ligne 26
bon rien de grave mais c'est la premiere fois que je poste aussi librement des informations et comme tu as vu je suis noob
oui je souhaite etre utile aussi aux autres, c'est juste que je ne peux pas avoir la main pour retirer moi même ce que j'ai mis et j'ai trouvé que cette solution, c'est rageant pour moi aussi
bon bah je dézippe :D
0
Réponse 3 / 3
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020
21 juil. 2020 à 22:36
mais du coup il sert à quoi mon espace phpmysql sur mon hebergement?
0
jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024 4 694
21 juil. 2020 à 23:24
php est un langage de programmation
mysql est un moteur de base de données

Je pense plutot que tu nous parles de PhpMyadmin qui est un logiciel ( développé en php) qui permet de manipuler ta base de données mysql.

Quoi qu'il en soit, je ne vois pas le rapport avec la présente question qui est la mise en place de ton formulaire ...
0
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020 > jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024
22 juil. 2020 à 11:46
En fait comme tu le vois je débute vraiment et je pensais qu'il fallait mettre les fichiers php dans PHPmyadmin effectivement..
Donc j'ai tout dézippé, j'ai tout mis dans un répertoire à la racine de mon hébergement
sauf que...
lorsque je valide le commentaire, il me renvoie vers la page admin.php et c'est écrit: file not found alors que dans le script du formulaire il y a un message de remerciement et au bout de 6 seconde il revient sur la page de formulaire
j'ai du louper un truc?
0
jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024 4 694 > pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020
22 juil. 2020 à 12:02
Ton formulaire, il se trouve où par rapport aux autres fichiers ?
Dans le même dossier ou ailleurs ?
D'ailleurs, comment as tu "intégré" le formulaire dans ton site actuel ?

Par exemple,
si le code html du formulaire ne se trouve pas dans le même dossier, il faut modifier un peu le code pour cibler l'emplacement des fichiers.
Par exemple 
<link href="vendor.css" rel="stylesheet">

devient : 
<link href="chemin_vers/vendor.css" rel="stylesheet">

"chemin_vers" étant le chemin vers le fichier sur ton serveur

idem pour le "FORM" il faut indique le bon chemin dans l'action 
<form data-licenseKey="****************" name="jqueryform-6******" id="jqueryform-********" action='admin.php' method='post' enctype='multipart/form-data' novalidate autocomplete="on">

devient 
<form data-licenseKey="****************" name="jqueryform-6******" id="jqueryform-********" action='chemin_vers/admin.php' method='post' enctype='multipart/form-data' novalidate autocomplete="on">


et il faut faire pareil avec les autres fichiers tels que les javascript

.
0
pronoob Messages postés 78 Date d'inscription vendredi 12 juin 2020 Statut Membre Dernière intervention 26 août 2020 > jordane45 Messages postés 38269 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 novembre 2024
22 juil. 2020 à 16:27
Ouah merci pour ces indications!
Je vais essayer aussi de m'appliquer autant que toi pour tous les futurs débutants (il doit bien il y en avoir...)qui verront ce sujet.

1) Alors j'ai reset mon ftp pour reprendre proprement l'exercice.

2) J'ai donc intégré le formulaire dans le logiciel au moyen d'une forme quelconque à laquelle j'ai intégré du code html dans le body(form.html), ce qui, en actualisant en local donne ça en visu logicielle :




3)Ensuite, je me rend dans mon FTP et j'envoie mon fichier décompressé à la racine, sans dossier, comme ceci:



4) Je met à jour ma base de données via logiciel, je me rend sur la page où se trouve le formulaire, oh miracle, le questionnaire fonctionne (mode happy), je reçois bien le texto de confirmation etc etc... sauf que le bouton envoyé est doublé ...et le logo de jqueryform est présent alors que j'ai payé et intégré le code dans la balise correspondante, je n'avais pas ce soucis avant :



Et le code d'achat intégré correctement dans le "form.html"



En tout cas merci j'arrive à presque-résolu grâce à ton accompagnement!
0

Discussions similaires

Contacter le "bon coin"
babet56 -
SUDEST13 -

28 réponses
Contact LEBONCOIN
myalysee -
MPMP10 -

3 réponses
contacter leboncoin
cloclo6v -
INES 56 -

50 réponses
Whatsapp: différences entre bloquer et supprimer contact
Fjsoz -
Paul49140 -

1 réponse
Site chaud contact
joseph -
Afrikarnak -

43 réponses