Код?... Это просто!
php js Jquery JsPhp blog
ТЕГИ:
php (100)
js (87)
php date (19)
online (14)
html (14)
js slice (13)
js array (11)
encode (11)
js date (10)
php array (10)
hash (10)
info (7)
dosite (7)
php img (7)
jsphp (6)
Показать еще :

Отправим js post

"js post". Как отправить post в javascript. Разберем на пальцах, пошагово отправку данных на сервер. Получим ответ от сервера. Выведем полученный результат на экран! Если у вас не получилось собрать весь код "js post", то вы можете скачать готовый код в архиве.

Отправим js post на сервер.

  1. Отступление.
  2. Что будем делать?.
  3. Форма для js post.
  4. Javascript код для js post.
  5. Php код для js post.
  6. Скачать код для js post.

Смотри еще загрузка файла на сервер.

  1. Отступление

    Прежде чем начать моё повествование, хочу сказать о теме "js post " вообще и в частности!

    О теме js post вообще и в частности!

    Вы должны понимать, что любая тема касающаяся программирования и любого языка(здесь будет использоваться javascript и php) вариативна!

    Что такое вариативна?

    Вариативна - это когда можно выполнить некое действие несколькими способами! И даже в самих функциях, методах возможны варианты! Например данные в "js post" можно отправлять: 1). строкой 2). объектом 3).файлом 4). смешанный из выше перечисленных 3.

    Зачем нужно отступление?

    Я не пытаюсь объять необъятное!

    Потому, что если, перечислять все варианты, то на это уйдет не просто много времени, а очень много времени!

    Вы, начав изучать такой "талмуд", скорее всего просто не дочитаете его до конца, поскольку логику начинающего я ещё помню : "мне нужен максимально простой и понятный текст и код, чтобы он работал!".

    Поэтому... возьмем самый простой код и пример, чтобы он работал!

    Что будем делать?

    Отправим из 2 полей ввода два числа на сервер с помощью "js post".

    На сервере сложим эти два числа и выведем с помощью "echo".

    Получим ответ от сервера и выведем его на страницу.

  2. Форма для js post.

    Если вы поленились читать вступление, то:

    Создадим простой пример отправки "js post" - максимально просто, насколько это возможно!

    Если вам потребуется больше теории, то вы всегда сможете её наёти в интернете.

    Форма для отправки js post.

    Для того, чтобы отправить "js post" вам потребуется форма:

    В форме будет два поля input с типом number.

    Одно поле кнопка button.

    В которую поместим вызов функции "post" с помощью onclick.

    Соберем весь код формы для отправки js post.

    <input type="number" name="a" id="id_1"><br>

    <input type="number" name="b" id="id_2"><br>

    <button onclick="post()">Сумма</button>

    <p>Сумма равна: <span id="summa"></span></p>

    Выведем весь код формы для отправки js post.

    Выведем весь код формы для отправки js post прямо здесь:



    Сумма равна:

  3. Javascript код для js post.

    Для того, чтобы отправить данные с помощью "js post" вам понадобится код javascript:

    Напишем функцию "post".

    Внутри создадим новую "FormData".

    С помощью "append" добавляем новый ключ со значением из value каждого поля.

    Создаем новый XMLHttpRequest.

    С помощью "open" задаём основные параметры запроса.

    С помощью send отправляем данные на сервер.

    Вызываем обработчик события onreadystatechange, который вызывается всякий раз, когда изменяется состояние свойства readyState.

    Проверяем readyState.

    Если всё ок, то с помощью innerHTML выводим результат в строку "Сумма".

    Соберем весь javascript код для js post.

    function post()

    {

    const data = new FormData()

    data.append('num_1', id_1.value)

    data.append('num_2', id_2.value)

    var xhr = new XMLHttpRequest();

    xhr.open('POST', 'php.php' , true);

    xhr.send(data);

    xhr.onreadystatechange = function()

    {

    if (xhr.readyState == 4)

    {

    if(xhr.status == 200)

    {

    summa.innerHTML = xhr.responseText;

    }

    }

    }

    }

  4. Php код для js post.

    Ну и последний код на сервере в файле "Php", что будем делать?..

    Чтобы не присылали всякую фигню, проверим - это число или нет...:

    Если это число, то два поля складываем и выводим с помощью echo.

    Иначе "Пришлите число".

    Php код для js post.

    Соберем весь код и поместим в пример.

    <?

    if(is_numeric ($_POST['num_1']) and is_numeric ($_POST['num_2'])) echo $_POST['num_1'] + $_POST['num_2'];

    else echo 'Пришлите число';

  5. Скачать код для js post.

    Если по какой-то причине вы не смогли воплотить код в реальность, то у вас есть возможность скачать готовый архив zip с выше приведенным примером.

    Где скачать код для js post.

    С вас чашка кофе и забирайте код здесь.



Теги:

js post

js https post

js post data

js post запрос

js http post

js отправить post

js send post

post json js

node js post запросы

js post php

js отправить post запрос

js отправка post

js post form

method post js

js send post request

js получить post

js отправка post запроса

метод post js

js http request post

js xmlhttprequest post

формы js post

jsphp.ru есть здесь:
Полезные ссылки:
ruweb
Я писал немного о ruweb.net!
Помочь проекту JsPhp.ru

Что можно сделать!?

Поделиться ссылкой! C друзьями или врагами!


Помочь проекту JSPHP.RU: Помочь проекту JSPHP.RU прокомментировать :

Скоро...


Мои Проекты :

Скоро...



О хостинге :

Скоро...


© jsphp.ru 2023 - 2024 , Аминев Марат. Контакты
Страница загружена за : 0.011495 секунд.