5

Надо отправлять Aяксом инфу из поля <input> на сервер (при этом, при нажатии на Enter, должна отправляться эта инфа) без использования <form>.

1
  • Чем вам form не угодил? К form тоже можно прикрутить аякс
    – andreymal
    21 июл 2018 в 19:36

3 ответа 3

1

Примерно так

var element = document.querySelector("input");
element.addEventListener('keydown', function(e){
  var key = e.keyCode ? e.keyCode : e.which;
  if (key == 13) {
    var request = new XMLHttpRequest();
    var formData = new FormData();
    formData.append("input", this.value)
    request.open("POST", "url");
    request.send(formData);
  }
});
<input>

1

В общем выглядеть это должно как-то так. url, headers, method , и все остальные параметры смотри в доккументациик методу fetch. некоторые из этих параметров у тебя будут другие. может не самое красивое решени..но.. что нашел, то прислал)))

function ajax(url,data,callback){
        var formData = new FormData();
        let heder = new Headers({ 'Access-Control-Allow-Origin': '*' });
        formData.append('action', JSON.stringify(data));
        fetch(url, {
            method: 'post',
            headers: heder,
            credentials: "same-origin",
            body: formData,
        }).then(validateResponse).then(function(result) {
            if(typeof callback === 'function') {
                    return callback(result.result);
            }
        });
      function validateResponse(response) {
        if(!response.ok) {
            throw Error(response.statusText);
        }
        return response.json();
    }
}

let input =  document.getElementById('text');
input.addEventListener('keydown',(event)=>{
  if(event.keyCode===13){
    ajax('http://example.com',event.target.value,()=>{});
  }
})
<input type="text" id="text"/>

0

Какой вопрос - такой ответ

Добавить к инпуту прослушивание события и используя фетч или xhr отправлять ©"ину из поля на сервер".

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.