需要从表单中获取输入，使用php处理它，具有根据答案重新加载页面的选项

Question

this is my problem.

I have a startpage website on this address: http://battlestation.rocks/

It mostly revolves around a search bar in the front page that executes commands. Presently, every command is processed with php, like so:

if (isset($_POST['searchBar'])) {
    $originalcommand = $_POST['searchBar'];
    processcommand($originalcommand);
    return;
}

With this, every command reloads the page, which is a waste as most of the times it just opens some link from the startpage. In other cases, the startpage is changed by the commands, and thus in those cases I would like the page to reload.

I've seen from other questions that you can have the page not reload with AJAX, but none of the answers I've seen send the form input to php for processing, nor do they include the option to reload if necessary.

I'm very much a hobbyist coder and have zero experience with AJAX, please don't get too technical on me. I'm obsessed with this startpage, I just need to get this working as intended. Please help!

Answer 1

If you use PHP directly then the page needs to reload. If you use AJAX then you can send it so without reloading. !-You need a new PHP file in which you process the input-! An example with jquery but works the same:

You normal site:

<form action=''>
        <input type='email' id='email' placeholder='E-Mail' required=""/>
        <input type='password' id='pwd' placeholder='Passwort' required=""/>

        <button id='go_login'>Go</button>
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
  $('#go_login').click(function() {

    var bn = $('#email').val();
    var pw = $('#pwd').val();

    $.post('newphpsite.php', {'bn': bn, 'pw': pw}, function(data) {
       alert(data); //send back echo from PHP
    });

   return false; //The form is not sent and does not reload the page.
 });
</script>

newphpsite.php :

<?php 

  $bn = $_POST['bn'];
  $pw = $_POST['pw'];

  echo $bn."".$pw;

?>

?>