Skip to content Skip to sidebar Skip to footer

How To Continuously Populate Html Textbox From Curl Api

I have a HTML textbox which I would like to populate with data received from an API call using curl command. The curl API that I'm using, continuously returns/livestreams data in t

Solution 1:

You can just update the value by making a GET request, and make the function repeat itself at some specified interval. Also onclick on button already adds an event listener, thus the code would go something like this.

<html><body><textarearows='14'id="value"placeholder="anything you want here"></textarea><buttonclass="get_values"onclick="startUpdate(event)">GET</button><script>// to set an update interval at every 2 sec(2000ms)functionstartUpdate(e) {
  // e. preventDefault();// calling instantlyupdateTextArea();
  // and setting intervalwindow.setInterval(updateTextArea, 2000);
}

// defining global variable, to display dynamic updatewindow.counter = 1functionupdateTextArea() {
  let url = "https://jsonplaceholder.typicode.com/todos/" + window.counter; // test url// assuming data is json, if it is text use response.text()fetch(url)
    .then(response => response.json())
    .then(data => {
      let textArea = document.getElementById("value");
      // parsing the JSON value to string
      textArea.value = JSON.stringify(data);
    })
  window.counter = window.counter + 1; // increment counter
}
</script></body></html>

Edit: To pass event you should pass the keyword event in onclick function call.

Post a Comment for "How To Continuously Populate Html Textbox From Curl Api"