3. Load external content into Onsen

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Load external content into Onsen

  • R

    Hello.
    I’m trying to load the content of an external file (located in a webserver) into an Onsen UI app. I’m using onsenui - v2.10.8 - 2019-04-01.

    This is my page code:

    <ons-page id="eventos">
  <script>
    // events list loader
    var xhttp = new XMLHttpRequest();
    var url = "http://manosdemadre.org/app/eventos.txt";
    
    xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        // Typical action to be performed when the document is ready:
        document.getElementById("noticias").innerHTML = xhttp.responseText;
      }
    };
    xhttp.open("GET", url, true);
    xhttp.send();
  </script>

  <img src="img/eventos.jpg" width="100%" height="auto" alt="eventos" />
  
  <div class="page-content">
    <div class="title">¿Qué hacemos?</div>

    <p>Los eventos que se realizan son espacios de encuentro dedicados a la oración de reparación por las faltas, pecados y desagravios cometidos contra el Sagrado Corazón de Jesús, contra el Inmaculado Corazón de María y, especialmente, contra la Sagrada Eucaristía.</p>

    <div class="block">
      <ons-list>
        <ons-list-header>Próximos eventos</ons-list-header>
        <div id="noticias">
        </div>
      </ons-list>
    </div>
  </div>
</ons-page>

    The page doesn’t load anything on Android 9 but it works fine on older versions.

    Could you please help me with this issue? Is there a better way to accomplish my needs?

    Thank you for all your help.

    Best Regards,

    Rafael.

    0
  • M

    @rafaguilarsol said in Load external content into Onsen:

    Hello.
    I’m trying to load the content of an external file (located in a webserver) into an Onsen UI app. I’m using onsenui - v2.10.8 - 2019-04-01.
    This is my page code:
    <ons-page id=“eventos”>
    <script>
    // events list loader
    var xhttp = new XMLHttpRequest();
    var url = “http://manosdemadre.org/app/eventos.txt”;

    xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    // Typical action to be performed when the document is ready:
    document.getElementById("noticias").innerHTML = xhttp.responseText;
  }
};
xhttp.open("GET", url, true);
xhttp.send();

    </script>

    <img src=“img/eventos.jpg” width=“100%” height=“auto” alt=“eventos” />

    <div class=“page-content”>
    <div class=“title”>¿Qué hacemos?</div>

    <p>Los eventos que se realizan son espacios de encuentro dedicados a la oración de reparación por las faltas, pecados y desagravios cometidos contra el Sagrado Corazón de Jesús, contra el Inmaculado Corazón de María y, especialmente, contra la Sagrada Eucaristía.</p>

<div class="block">
  <ons-list>
    <ons-list-header>Próximos eventos</ons-list-header>
    <div id="noticias">
    </div>
  </ons-list>
</div>

    </div>
    </ons-page>

    Check cross-origin policies.

    0

  • Try https domain.

    0