Отправить кнопку остаться в форме после нажатия - PullRequest
Новая
       38

Отправить кнопку остаться в форме после нажатия

0 голосов
/ 20 сентября 2019

введите описание изображения здесь Я хочу остаться в режиме формы после нажатия на кнопку отправки У меня есть панель навигации с кнопками: 

<div class="bar blueGrey">
  <button class="bar-item button tablink orange" onclick="openNavBarChoise(event,'HomePage')">Home</button>
  <button class="bar-item button tablink" onclick="openNavBarChoise(event,'CVsPage')">CV</button>
  <button class="bar-item button tablink" onclick="openNavBarChoise(event,'ContactPage')">Contact</button>
</div>

Javascriptкод: 

function openNavBarChoise(evt, choiceName) {
  var i, x, tablinks;
  x = document.getElementsByClassName('choice');
  for (i = 0; i < x.length; i++) {
    x[i].style.display = 'none';
  }
  tablinks = document.getElementsByClassName('tablink');
  for (i = 0; i < x.length; i++) {
    tablinks[i].className = tablinks[i].className.replace(' orange', '');
  }
  document.getElementById(choiceName).style.display = 'block';
  evt.currentTarget.className += ' orange';
}

когда кто-то нажимает на кнопку «Контакт», переходите к форме обратной связи. Я хочу остаться в этой форме после нажатия на кнопку , но этот код возвращается на HomePage. 

<!--/*************** Begin Contact Page ***************/-->
<div id="ContactPage" class="container border choice" style="display:none">
  <div class="panelChristos00">
      <div class="ImgFPanel">
          <img class="ImgPP" id="imgJob" src="Icons\contactSupport.png" alt="contactSupport" width="80px">
      </div>

      <div id="ergasia" class="firstLine">
          <h2>Form</h2>
      </div>

      <div class="container">


          <form id="form0" method="post" >

              <div class="requiredM00">
                  <p style="color:red"><?php echo $requiredMessage;?></p><p style="color:blue"><?php echo $completeMessage;?></p>
              </div>
              <label for="name">Name <span class="error" style="color:red">*<?php echo $nameErr;?></span></label>
              <input type="text" name="name" value="<?php echo $name;?>">

              <label for="email">Email <span class="error" style="color:red">* <?php echo $emailErr;?></span></label>
              <input type="text" name="email" value="<?php echo $email;?>">

              <label for="phone">Phone <span class="error" style="color:blue"> <?php echo $phoneErr;?></span></label>
              <input type="text" name="phone" value="<?php echo $phone;?>">

              <label for="subject">Message <span class="error" style="color:red">*<?php echo $subjectErr;?></span></label>
              <textarea id="subject" name="subject" style="height:200px"    ><?php echo $subject; ?></textarea>

              <input type="submit" value="Send">
          </form>
      </div>
  </div>
</div>

Ответы [ 3 ]

0 голосов
/ 20 сентября 2019

Вы хотите остаться в контактной форме и все еще отправить форму, верно?чтобы сделать это, вам нужно использовать ajax.

Прикрепите обработчик события (при отправке) к форме и предотвратите событие по умолчанию, чтобы предотвратить его поведение по умолчанию (например, возвращение на домашнюю страницу) 

var form_el = document.getElementById("form0");

form_el.addEventListener("submit", function(e) {
    e.preventDefault(); // this will prevent the page from going back to homepage

    var form  = new FormData(this);

    var XHR = new XMLHttpRequest();

    XHR.open("POST", "server.php", true);

    // response handler
    XHR.onload = function () {
     // do something with the response
      if (xhr.status === 200) {
        var userInfo = JSON.parse(xhr.responseText);
      }
    };

    XHR.send(form);
});
0 голосов
/ 20 сентября 2019

вы можете сделать это, вы попадете на новую вкладку, как вы хотели 

 <form action="your file name">
        <input type="text">
        <input onclick="e.preventDefault()" type="submit" formtarget="_blank">
 </form>
0 голосов
/ 20 сентября 2019

по умолчанию кнопка отправки формы отправляет форму себе, чтобы прекратить использование evt.preventdefault () в кнопке отправки формы

...