GET Request, используя форму и кнопку

Question

Итак, в настоящее время у меня есть простая форма, которая отправляет sendchat.php сообщение, которое человек хочет напечатать .. Проблема в том, что я действительно не хочу использовать iframes, чтобы заставить его работать БЕЗ обновления. Может ли кто-нибудь указать мне правильный код на то, как сделать форму submit в BACKGROUND, что означает отсутствие перехода на другую страницу или обновление.

<form target="chat" action="sendchat.php" method="GET"> 
    <input type="text" class="form-control" id="message" maxlength="255" name="message" type="submit" placeholder="Enter your message or use !help for help."><br> 
    <div class="col-xs-6 text-right"> 
     <button type="submit button" class="btn bg-teal-400 btn-labeled btn-labeled-right"><b><i class="icon-circle-right2"></i></b> Send Message</button> 
    </div> 
    </form> 

<style> .iframe { display: none; border-color: rgba(225, 225, 225, 0); border-width: 0px; } </style> 
     <iframe style="" name="chat" width="0px" height="0px" id="chat" onload="clearTextarea();"></iframe> 

Answer 1

Вы можете использовать ajax для получения данных после нажатия кнопки без обновления страницы.

<form target="chat" action="sendchat.php" method="GET"> 
<input type="text" class="form-control" id="message" maxlength="255" name="message" placeholder="Enter your message or use !help for help."><br> 
<div class="col-xs-6 text-right"> 
    <button type="button" class="btn bg-teal-400 btn-labeled btn-labeled-right"><b><i class="icon-circle-right2" onclick="save_chat()"></i></b> Send Message</button> 
</div> 
</form> 
function save_chat(){ 
$.ajax({ 
    type: 'POST', 
    url: 'sendchat', 
    data: {'message': $('input[name="message"]').val()}, 
    success: function (data) 
    { 
     //do nothing 
    }, 
    error: function (xhr, ajaxOptions, thrownError) 
    { 
     alert(xhr.status); 
     alert(thrownError); 
}); 
}