Запустить php скрипт из html формы с Ajax запросом - PullRequest
Новая
       0

Запустить php скрипт из html формы с Ajax запросом

0 голосов
/ 12 февраля 2020

Я пытался заставить маленький скрипт php выполнить запрос ajax. Более общая картина заключается в том, что я хочу сохранить данные в форме html в своей базе данных одним нажатием кнопки, фактически не отправляя эту форму одним нажатием. Однако, поскольку я новичок в программировании, я пытаюсь заставить принципы основы работать в первую очередь.

Для тестирования я сделал минимальный пример. В ajaxtest.hml я сделал кнопку, которая должна выполнять функцию click(). Эта функция должна выполнить запрос ajax для выполнения тестирования. php (находится в той же папке). testing. php должен просто вернуть 'Hello World'. Однако кнопка ничего не делает, и я не могу понять, в чем дело.

Мой код для ajaxtest. html: 

<html>

<meta charset="UTF-8">

<body>

  <button type="button" onclick="click()">Click Me</button>
  <p id="p"></p>
  <script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">

  function click(){
              $.ajax({
                  type: 'POST',
                  url: 'testing.php',
                  success: function(data) {
                      alert(data);
                  }
              });
            }
  </script>

</body>
</html>

и для тестирования. php: 

<?php

echo "Hello World"; ?>

Вероятно, это типичная ошибка ладьи ie, которую я здесь делаю, но джунгли разных постов на эту и подобные темы мне пока не помогли ... Любая помощь очень ценится !

Ответы [ 5 ]

0 голосов
/ 12 февраля 2020

Вы можете попытаться вызвать функцию неявно 

<html>
<meta charset="UTF-8">
<body>
    <button id="testbutton" type="button">
        Click Me
    </button>
    <p id="p"></p>
    <script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script>

        $('body').on('click', '#testbutton', function(){
            $.ajax({
                type : 'POST',
                url : 'testing.php',
                success : function(data) {
                    alert(data);
                }
            });
        });

    </script>
</body>

0 голосов
/ 12 февраля 2020

Мне кажется, что у вас есть 3 вещи, которые нужно исправить:

  1. Вам не хватает открывающего тега <script> для вашей функции, так как открывающий тег сценария у вас есть на момент для библиотеки jquery, на которую вы ссылаетесь.

  2. Кроме того, не используйте зарезервированное слово «щелчок» в качестве имени функции. Я изменил его ниже на «myfunction»

  3. Переместите определение функции в соответствующее место на вашей странице.

Если вы попробуете код ниже, он должен работать. Надеюсь, это поможет. 

        <html>
    <meta charset="UTF-8">
    <body>
    <script>
      function myclick(){
      alert('posting!');
                  $.ajax({
                      type: 'POST',
                      url: 'testing.php',
                      success: function(data) {
                          alert(data);
                      }
                  });
                }
      </script>
      <button type="button" onclick="myclick()">Click Me</button>
      <p id="p"></p>
      <script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"/>
    </body>
    </html>
0 голосов
/ 12 февраля 2020

Вам следует удалить скобки в атрибуте «onclick = click ()», в противном случае функция будет немедленно выполнена при загрузке страницы, и поэтому вы не можете видеть действие кнопки.

0 голосов
/ 12 февраля 2020

Я предлагаю такой способ: (замените его вместо кода в теге Body.) 

<button type="button" id="ajaxBtn">Click Me</button>
<p id="p"></p>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
    const btn=document.getElementById('ajaxBtn');
    btn.addEventListener('click',click);
    function click(){
        $.ajax({
            type: 'POST',
            url: 'testing.php',
            success: function(data) {
                alert(data);
            }
        });
    }
</script>
0 голосов
/ 12 февраля 2020

В вашем коде есть несколько ошибок: во-первых, это неправильный файл HTML. Каждый файл HTML должен иметь тег <head></head> и тег <body></body> внутри тега <html></html>.

Во-вторых, вы хотите загрузить свои сценарии в разделе <head>. Где вы также можете определить заголовок, метатеги, таблицы стилей и т. Д. c.

В-третьих, ваш тег <script> неверен. Вы загружаете скрипт и одновременно определяете функцию. Это должно быть два действия.

Я думаю, ваш сценарий будет выглядеть примерно так: 

        <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Title of the document</title>
<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">
    </head>

    <body>
    <button type="button" onclick="click()">Click Me</button>
    <p id="p"></p>
    </body>
      <script>   
    function click(){
                  $.ajax({
                      type: 'POST',
                      url: 'testing.php',
                      success: function(data) {
                          alert(data);
                      }
                  });
                }
      </script>

    </html>

Для получения информации о HTML см. W3schools

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...