Отображение входных данных формы в соответствии с предыдущими ответами nodejs

#javascript #node.js #express

Вопрос:

Я на самом деле пытаюсь создать веб-приложение, и я довольно новичок.

Я использую nodejs и express для серверной части, и я не знаю, как отобразить некоторые входные данные формы в соответствии с ответом, который я дал в предыдущем вводе.

Например, если я поставлю флажок, я хотел бы отобразить другую форму.

Сначала я создал свою статическую страницу, используя классический html и js, и я мог бы получить необходимый результат, установив флажок, а затем изменив стиль ввода с » нет » на «блокировать».

Например, в моем html-файле :

 <div class="form-check form-switch my-2 col-md-2">
      <input class="form-check-input" type="checkbox" id="SwitchCheckLicence">
      <label class="form-check-label fw-bold" for="SwitchCheckLicence">Licence payed?</label>
</div>

<div class="form-group col-md-6 fw-bold" id="Paiement" style="display:none;">
      <label for="inputPaiement" >Prix : </label>
      <select class="form-select" onchange="yesnoCheck(this);">
      <option selected>Choisir un moyen de paiement</option>
      <option value="CB">Carte Bancaire</option>
      <option value="Cheque">Chèque</option>
      <option value="Espece">Espèce</option>
      </select>
</div>
 

И в моем файле js :

 var licencePayed = document.getElementById('SwitchCheckLicence');
var Paiement_div = document.getElementById('Paiement');
var showHiddenDiv = function(){
    if(licencePayee.checked) {
    Paiement_div.style['display'] = 'block';
   }
licencePayee.onclick = showHiddenDiv;
showHiddenDiv()
 

Но теперь, когда я отрисовываю страницы на стороне сервера, есть ли способ получить тот же результат и иметь форму, которая может динамически адаптироваться ?

Скажите мне, если вам нужно больше точности, спасибо за вашу помощь

Комментарии:

1. Привет @Veezia, как вы пытаетесь отобразить его на стороне сервера? Рендеринг на стороне сервера должен отображать первую форму, а javascript должен «увлажнить» форму и добавить реактивность

2. Но в вашем html нет ничего действительно динамичного, чтобы в любом случае даже визуализироваться на стороне сервера

3. Спасибо за ваш ответ @Acidic9. Ну, я использую EJS для визуализации своих страниц, если это то, что вы хотите знать. Если я хорошо понимаю, я должен отображать с помощью EJS только первый ввод, а затем добавлять остальные с помощью javascript ? Но как я могу знать, что пользователь закончил с первым вводом, не прося его нажать кнопку или что-то еще ?

4. Да, это звучит правильно. Вы можете включить весь html, но просто установите 2-ю форму так, чтобы она изначально не отображалась, и покажите ее с помощью JavaScript. И что касается вашего второго вопроса, вы могли бы попытаться сделать что-то умное, например, когда они размывают ввод с помощью события размытия, но я думаю, что наличие кнопки-это нормально

5. Тогда это почти то же самое, что я сделал в своем html. Но поскольку я не могу получить доступ к DOM, я не могу изменить стиль отображения с помощью javascript