CODEWITHSUNDEEP
javascripthtmlhttpdom
user8071576
user8071576

Reputation:

Send simple HTTP request with HTML submit button

I have added a submit button to the index.html page that resides on my server side

<form method="get" action="/start">
    <h5>Start Ad-Placer!</h5>
    <input type="submit" value="Start">
</form>

I need the button to simply send a http request to http://127.0.0.1:8484/get/start to start some process. Then once the process is done after a few seconds, I need to simply display an alert message with the response message, acknowledging it is done.

How can I do that with minimum efforts (without using JQuery or other libraries).

Upvotes: 6

Views: 41192

Answers (2)

default123
default123

Reputation: 170

You don't need javascript for this.

<form action="http://www.example.com" method="POST">
  <div>
    <label for="say">What greeting do you want to say?</label>
    <input name="say" id="say" value="Hi" />
  </div>
  <div>
    <label for="to">Who do you want to say it to?</label>
    <input name="to" id="to" value="Mom" />
  </div>
  <div>
    <button>Send my greetings</button>
  </div>
</form>

Source: https://developer.mozilla.org/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data

Upvotes: 0

thepi
thepi

Reputation: 352

If you try something like this you can send a HTTP request and then alert a response. Just change https://google.com to your URL.

<h5>Start Ad-Placer!</h5>
<input type="submit" value="Start" onclick="submit()">

<script type="text/javascript">
    function submit() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4) {
                alert(xhr.response);
            }
        }
        xhr.open('get', 'https://google.com', true);
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
        xhr.send();
    }

</script>

Upvotes: 4

Related Questions