Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #33565 > unrolled thread

Getting text with AJAX

Back to article view | Back to comp.lang.javascript

Contents

  Getting text with AJAX bit-naughty@hotmail.com - 2017-07-01 02:49 -0700
    Re: Getting text with AJAX Luuk <luuk@invalid.lan> - 2017-07-01 11:56 +0200
    Re: Getting text with AJAX Ben Bacarisse <ben.usenet@bsb.me.uk> - 2017-07-01 12:10 +0100
    Re: Getting text with AJAX JJ <jj4public@vfemail.net> - 2017-07-01 21:35 +0700
    Re: Getting text with AJAX JR <jrfaqcom@gmail.com> - 2017-07-02 13:37 -0300

#33565 — Getting text with AJAX

...OK, so assume there's some text on the screen, like a headline, or topic, say. When it's clicked, the actual text has to be got (from the server), and shown. 
What would the coding look like? 
(assume the text itself is on a MySQL db on the server, with some kind of "id" to it, which will be fetched by a PHP script - ie. www.site.com/gettext.php?articleid=210).

[toc] | [next] | [standalone]

#33566

On 01-07-17 11:49, bit-naughty@hotmail.com wrote:
> ...OK, so assume there's some text on the screen, like a headline, or topic, say. When it's clicked, the actual text has to be got (from the server), and shown.
> What would the coding look like?
> (assume the text itself is on a MySQL db on the server, with some kind of "id" to it, which will be fetched by a PHP script - ie. www.site.com/gettext.php?articleid=210).
> 

this seems to be a PHP question, so it would be better to ask in a 
newsgroup about PHP

[toc] | [prev] | [next] | [standalone]

#33567

bit-naughty@hotmail.com writes:

> ...OK, so assume there's some text on the screen, like a headline, or
> topic, say. When it's clicked, the actual text has to be got (from the
> server), and shown.
> What would the coding look like? 
> (assume the text itself is on a MySQL db on the server, with some kind
> of "id" to it, which will be fetched by a PHP script -
> ie. www.site.com/gettext.php?articleid=210).

One possible outline:

1. The document could associate the ID with the headline using a data-*
attribute:

  <h1 data-article-id=210>Usenet not dead despite rumours</h1>

2. An click event handler is then associated with every headline.  I
usually do this on load:

  window.addEventListener('load', function () {
      var headlines = document.querySelectorAll('h1[data-article-id]');
      for (var i = 0; i < headlines.length; i++)
          headlines[i].addEventListener('click', ...);
  }, false);

3. That event handler constructs the required URL either by extracting
the ID from the event object (say via the target attribute).

4. It then creates an XMLHTTPRequest for that resource whose 'load'
handler will do whatever you want with the result.

It's all a bit vague because there are so many ways to handle the
details and very little in your question to guide an answer.

-- 
Ben.

[toc] | [prev] | [next] | [standalone]

#33568

On Sat, 1 Jul 2017 02:49:24 -0700 (PDT), bit-naughty@hotmail.com wrote:
> ....OK, so assume there's some text on the screen, like a headline, or topic, say. When it's clicked, the actual text has to be got (from the server), and shown. 
> What would the coding look like? 
> (assume the text itself is on a MySQL db on the server, with some kind of "id" to it, which will be fetched by a PHP script - ie. www.site.com/gettext.php?articleid=210).

Use XMLHttpRequest. e.g. for that example URL...

  function fetchArticle(articleID) {
    var xhr = new XMLHttpRequest();
    xhr.addEventListener("error", function() {
      console.log("fetchArticle() failed with HTTP code " + xhr.status + ". " + xhr.statusText);
    });
    xhr.addEventListener("load", function() {
      var eleArticleContainer = document.getElementById("articleContainer");
      eleArticleContainer.textContent = xhr.responseText;
      /*
      Use below code if the article text is HTML formatted.
      eleArticleContainer.innerHTML = xhr.responseText;
      */
    });
    xhr.open("GET", "https://www.site.com/gettext.php?articleid=" + articleID);
    xhr.send();
  }
  //usage e.g.
  fetchArticle(250);

[toc] | [prev] | [next] | [standalone]

#33569

On 01-07-2017 06:49, bit-naughty@hotmail.com wrote:
> ...OK, so assume there's some text on the screen, like a headline, or
> topic, say. When it's clicked, the actual text has to be got (from
> the server), and shown. What would the coding look like? (assume the
> text itself is on a MySQL db on the server, with some kind of "id" to
> it, which will be fetched by a PHP script - ie.
> www.site.com/gettext.php?articleid=210).
> 

The client side code for the click event handler might be something like 
this:

var div = document.getElementById('div_id');
var xhr = new XMLHttpRequest();
xhr.open('GET', 'gettext.php?articleid=210');
xhr.onload = function () { // Request has successfully completed.
   if (xhr.status === 200) {
     div.innerHTML = xhr.responseText;
   }
};
xhr.send();

-- 
Joao Rodrigues

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web