Formulaire multi étape + twig

par **Shake021** » 01 juin 2019, 14:03

Niquel merci ça fonctionne , je vais essaie de bien tabuler le code aussi

par **Saian** » 01 juin 2019, 12:17

Si tu as une soumissions du formulaire à chaque étape, ben il faut que tu remettes tous les champs reçu en hidden dans la partie suivante du formulaire.
Tu pourrais sinon utiliser la session pour stocker les données de chaque étape sans les transporter d'une étape à l'autre et pouvoir tout récupérer lors de la dernière.

Dans le style (avec peut être des erreurs) :

function actionPriseRdv($twig, $db) {
  /* initialise le formulaire */
  $form = array();
  $form['step'] = false;

  /* traitement de la première étape */
  if (isset($_POST['btNext'])) {
    /* récupération des données */
    $_SESSION['date'] = $_POST['date'];
    $_SESSION['method'] = $_POST['method'];

    /* définition variable de sortie */
    $form['step'] = true;
  }
  /* traitement de la deuxième étape */
  elseif (isset($_POST['btRdv'])) {
    /* récupération des données */
    $message = $_POST['message'];
    $heure = $_POST['heure'];

    /* insertion du rendez vous */
    $rdv = new rdv($db);
    $exec = $rdv->insert($_SESSION['date'], $_SESSION['method'], $heure, $message);

    /* traitement des erreurs */
    if (!$exec) {
      $form['valide'] = false;
      $form['message'] = 'Il y a eu un problème';
    }
    else {
      $form['valide'] = true;
      $form['message'] = 'Ca a fonctionné !';
    }
  }

  /* rendu de la page */
  echo $twig->render('priserdv.html.twig', array('form' => $form));
}

PS : je t'encourage vivement a bien tabuler ton code, c'est tellement plus simple à lire et ça peut permettre d'éviter des erreurs grossières. Il est intéressant de bien séparer les blocs de code aussi en fonction de ce à quoi ils servent pour une meilleur lisibilité. Par exemple il te manque pas mal de balises ouvrantes ou fermantes dans ton code twig ainsi que la balise form qui n'est pas fermée au bon endroit et les tabulations à l'arrache empêchent de bien voir où commencent et où terminent les blocs. La rigueur c'est quand même important quand on écrit du code.

{% if session.login is defined %}

  <form method="post" action="index.php?page=priserdv">

    {% if form.step == false %}

      <ul class="form-style-1">
        <li>
          <label for="datepicker">Date <span class="required">*</span></label>
          <input type="text" name="date" class="field-long" id="datepicker" required="required"/>
        </li>
        <li>
          <label for="method">Rendez vous par <span class="required">*</span></label>
          <select id="method" name="method" class="field-select" required="required">
            <option value="Skype">Skype</option>
            <option value="SurPlace">Sur place</option>
            <option value="Adomicile">A domicile</option>
          </select>
        </li>
        <li>
          <input type="submit" name="btNext" />
        </li>
      </ul>

    {% else %}

      <ul class="form-style-1">
        <li>
          <label for="heure">Horaires</label>
          <select id="heure" name="heure" class="field-select" required="required">
            <option value="1">09:00 - 10:00</option>
            <option value="2">10:00 - 11:00</option>
            <option value="3">11:00 - 12:00</option>
            <option value="4">12:00 - 13:00</option>
            <option value="5">13:00 - 14:00</option>
            <option value="6">14:00 - 15:00</option>
            <option value="7">16:00 - 17:00</option>
            <option value="8">18:00 - 19:00</option>
          </select>
        </li>
        <li>
          <label for="message">Message <span class="required">*</span></label>
          <textarea type="text" name="message" id="message" class="field-long field-textarea" required="required"></textarea>
        </li>
        <li>
          <input type="submit" name="btRdv" />
        </li>
      </ul>

    {% endif %}

  </form>

{% else %}

  Veuillez vous connecter a l'adresse suivante <a href="index.php?page=inscription">Se connecter</a>

{% endif %}

par **Shake021** » 31 mai 2019, 16:52

Booonjour !

J'ai un petit soucis avec un formulaire multi-étape en effet je n'arrive pas à récupérer le date et la method je sais donc qu'il faut utiliser le input type hidden mais je ne sais pas trop l'utiliser et ou le placer

Voila mon controleur :

function actionPriseRdv($twig, $db) {
    $form = array();
$form['step']=false;
    $rdv = new rdv($db);

$r = false;

if (isset($_POST['btNext'])) {
        $date = $_POST['date'];
        $method = $_POST['method'];
        $form['date']=$date;
        $form['method']=$method;
$form['step']=true;
$r = true;
}


if (isset($_POST['btRdv'])) {
  $form['date']=$date;
  $form['method']=$method;
        $message = $_POST['message'];
        $heure = $_POST['heure'];
        $exec = $rdv->insert($date, $method, $heure, $message);



            if (!$exec) {
                $form['valide'] = false;
                $form['message'] = 'Il y a eu un problème';
            }

             else {
                $form['valide'] = true;
                $form['message'] = 'Ca a fonctionné !';
            }
}

  echo $twig->render('priserdv.html.twig', array('form' => $form));

}

Et ma vue (la partie formulaire)

  {% if session.login is defined %}
                      <form method="post" action="index.php?page=priserdv">
                    {% if form.step == false %}


                                <ul class="form-style-1">
                                    <label>Date <span class="required">*</span></label>
                                    <input type="text" name="date" class="field-long" id="datepicker" required>
                                    </li>
                                    <li>
                                        <label>Rendez vous par <span class="required">*</span></label></label>
                                        <select name="method" class="field-select" required>
                                            <option value="Skype">Skype</option>
                                            <option value="SurPlace">Sur place</option>
                                            <option value="Adomicile">A domicile</option>
                                        </select>
                                    </li>
                                    <li>
                                        <input type="submit" name="btNext"  />
                                    </li>
                                    {% else %}
                                   <ul class="form-style-1">
                                    <li>

                                        <input type="hidden" name="method" value="{{form.method}}" />

                                        <input type="hidden"  name="date" value="{{form.date}}" />


                                        <label>Horaires</label>


                                        <select name="heure" class="field-select" required>
                                            <option value="1">09:00 - 10:00 </option>
                                            <option value="2">10:00 - 11:00</option>
                                            <option value="3">11:00 - 12:00</option>
                                            <option value="4">12:00 - 13:00</option>
                                            <option value="5">13:00 - 14:00</option>
                                            <option value="6">14:00 - 15:00</option>
                                            <option value="7">16:00 - 17:00</option>
                                            <option value="8">18:00 - 19:00</option>

                                        </select>
                                    </li>
                                    <li>
                                        <label>Message <span class="required">*</span></label>
                                        <textarea type="text" name="message" id="message" class="field-long field-textarea"></textarea>
                                    </li>
                                    <li>
                                        <input type="submit" name="btRdv"  />
                                    </li>
  </ul>
                            </form >
                            {% endif %}

                    {% else %}

                        Veuillez vous connecter a l'adresse suivante <a href ="index.php?page=inscription">Se connecter </a>

                    {% endif %}

Si quelqu'un pourrait m'expliquer comment transmettre les informations de la partie un du formulaire dans la partie deux ça serais cool merci

Formulaire multi étape + twig

Répondre

Étendre la vue Revue du sujet : Formulaire multi étape + twig

Re: Formulaire multi étape + twig

Re: Formulaire multi étape + twig

Formulaire multi étape + twig