Как отобразить значение ввода на jquery?

У меня есть 2 формы: форма1 и форма2. форма2 скрыта, и когда я нажимаю кнопку проверки, форма1 исчезает и появляется форма2. form1 содержит input1. Когда я нажимаю кнопку проверки, я хочу, чтобы значение input1 помещалось после «name:» в форме2.

<div id='form1'>
     <div class = "form-group col-md-4 col-md-offset-4">
        <label>number day 1</label>
       <input type = "text" id='input1' class = "form-control" placeholder = "name">
       <span id='error'>Input can not blank</span>
     </div> 
           <table class = "table table-bordered">
   <tr>
      <td>aa</td>
      <td>bb</td>
      <td>cc</td>
      <td>dd</td>
   </tr>
   <tr>
      <td>ee</td>
      <td>ff</td>
      <td>gg</td>
      <td>hh</td>
   </tr>

</table>

 <div class = "form-group col-md-offset-5 ">
    <button id = "hide" class = "btn btn-success " type = "submit">valider</button>
  </div>
</div>
<!------table2 ------>
  <div id='form2'>
    <h4>name : </h4>
     <table class = "table table-bordered">
     <tr>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
     </tr>
     <tr>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
     </tr>
    </table>
  </div>

код jquery:

 $(document).ready(function(){
    $("#hide").click(function(){
  let value = $('#input1').val();

  if (value = ""){
     $('#error').show();
  }else{
      $("#form1").hide();
       $("#form2").show();


   }
    });

  });

Ваш код должен работать нормально. Я просто не вижу «NameInput1» в вашем коде во второй форме. Но вы бы просто снова установили это поле с помощью .val().

Grant Noe 17.06.2019 19:59

Пишу так но не работает :name:("#input1"). val(), вы можете написать полный код для решения проблемы, пожалуйста

Najib Marzouk 17.06.2019 20:09
Как конвертировать HTML в PDF с помощью jsPDF
Как конвертировать HTML в PDF с помощью jsPDF
В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.
0
2
18
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Если я правильно понимаю, вы пропустили часть, где вы отправляете имя в другую форму, верно? Если это проблема, поскольку у вас нет ввода во второй форме, просто добавьте <span id = "thename"></span> с идентификатором, чтобы вы могли выбрать его и дать ему имя из первой формы. Оттуда отправьте значение имени в диапазон с помощью jQuery.

$('#thename').text(value);

$(document).ready(function() {
  $("#hide").click(function() {
    let value = $('#input1').val();
    $('#thename').text(value);

    if (value = "") {
      $('#error').show();
    } else {
      $("#form1").hide();
      $("#form2").show();


    }
  });

});
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href = "https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel = "stylesheet" integrity = "sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin = "anonymous">
<div id='form1'>
  <div class = "form-group col-md-4 col-md-offset-4">
    <label>number day 1</label>
    <input type = "text" id='input1' class = "form-control" placeholder = "name">
    <span id='error'>Input can not blank</span>
  </div>
  <table class = "table table-bordered">
    <tr>
      <td>aa</td>
      <td>bb</td>
      <td>cc</td>
      <td>dd</td>
    </tr>
    <tr>
      <td>ee</td>
      <td>ff</td>
      <td>gg</td>
      <td>hh</td>
    </tr>

  </table>

  <div class = "form-group col-md-offset-5 ">
    <button id = "hide" class = "btn btn-success " type = "submit">valider</button>
  </div>
</div>
<!------table2 ------>
<div id='form2'>
  <h4>name : <span id = "thename"></span></h4>
  <table class = "table table-bordered">
    <tr>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
    </tr>
    <tr>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
    </tr>
  </table>
</div>

Другие вопросы по теме