dcsimg
www.webdeveloper.com
Page 2 of 2 FirstFirst 12
Results 16 to 26 of 26

Thread: how to use javascript in html to read txt file and display it ?

  1. #16
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by midgetracer View Post
    I am using the code that 'rnd me' submitted, but am having issues hard inputting the address into it. I'm building a situational awareness page at work that runs off of our local drive. Currently we just iframe a few .txt files from the Space Weather Prediction Center, but I would like to readastext them and write them so I could modify the text with css. I do not need to use the input=file as the address never changes, but I'm having a heck of time getting to work... any thoughts?
    you can only use this code on local files selected via <input type=file>.
    it will NOT work for URLs.

    try using the free YQL webservice to convert the page to JSON-packed base64, and unpack the data on the client.
    this solution needs window.atob(), which comes with at least chrome and ff.
    for other browsers, download a base64 DECODE routine, and name the function "atob". that should make it work everywhere.


    Code:
    window.nwsCB=function(data){
      var fileContent=(atob(data.query.results.url.split(",")[1]));
      alert(  fileContent  );
    }
    
    function addScript(u){ var sc2=document.createElement('script'); sc2.src=u;  document.getElementsByTagName('*')[1].appendChild(sc2) }
    
    addScript("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20data.uri%20where%20url%3D%22http%3A%2F%2Fwww.swpc.noaa.gov%2Fftpdir%2Findices%2Fevents%2Fevents.txt%22&format=json&diagnostics=true&callback=nwsCB");
    see the YQL console for making new URLs to use with addScript if you want to grab other pages.

  2. #17
    Join Date
    Mar 2013
    Posts
    6
    Hi,
    i tried ur example code and it worked.. i need some modification in dat..rite nw u r giving the user to browse for a file and based on the selected file the operation is performed.. but i want my script to always read from the same file..der is no option to browse for the file.when the page loads this function shud be called automatically and the hardcoded file shud be read. can u help me out with this please..
    Thanks,

  3. #18
    Join Date
    Mar 2013
    Posts
    10
    Changing the style of an HTML element

    x=document.getElementById("demo") //Find the element
    x.style.color="#ff0000"; //Change the style

  4. #19
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by rahul1990 View Post
    Hi,
    i want my script to always read from the same file..der is no option to browse for the file.when the page loads this function shud be called automatically and the hardcoded file shud be read
    that is not allowed by any browser.

    if you have the file on your server, next to an html file, then you can use simple ajax to grab the file's contents. search for a basic ajax demo for that code.

  5. #20
    Join Date
    Mar 2013
    Posts
    6
    hi rnd me,

    Thanks for the reply.. actually i have urgent req for it.. i will tell u the full scenrio..if der is another way plz tell me dat..
    i am using unix server.my html script is located in /var/www/etc/html path and the file containing the names is also stored in the same place.. i want to read this file n store all the names in an dropdown combo box in my html page.. i got a code which reads frm an array and stores in dropdown box..i mixed dat code with ur code which reads each line frm the file n stores in the array..bt i need that the same file is read everytime wich contains the name wich has to be displayed in combo box..
    If u have any code plz send me..i need it urgently..

    in brief

    1) read content of the file
    2) store the content into array
    3) read the array n store the content into combobox in html.

    Thanks

  6. #21
    Join Date
    Sep 2013
    Posts
    1
    Hate to hijack the this thread but am hoping you guys could help..

    is there ay ways to download a vcard from a url using javascript or JSON so i can add it onto my website?

  7. #22
    Join Date
    Feb 2009
    Location
    UK
    Posts
    144
    sorry to add a negative note but

    all told, HTML is supported on about 9/10 devices, and that final ten percent should be converted over the next couple of years to about 2%.

    In my area (and surrounding counties) the library systems used by the most naive users (and savvy testers like me) still uses IE8 on a crippled XP downloaded fresh for each user. Think 1000's of users (make that 10,000's)

    What this means to those whose websites are for all and sundry - 2% is a meaningless statistic. The surfer will blame you if it doesn't work.

    KNOW your audience!

    And this is @ Jan7 2015. Blame the bankers & the recession (make that depression).

    what I forgot to point out in the context of the OP was:

    what I do to "read a file" (not write) is to construct (from Excel/VBA) a separate .js file that does little else than hold data - like:
    Code:
    var fred=new Array;
    var bill=new Array;
    fred="blah blah blah";
    bill = "ho hum";
    Code:
    <script language="JavaScript1.0" type="text/JavaScript" src="data.js"></script>
    <script language="JavaScript1.0" type="text/JavaScript" src="code.js"></script>
    works for me on any browser and that file is complex enough to fill 82K with a lexicon. http://stroudvoices.co.uk/search-by-subject

    sometimes the simplest solution is the best.

  8. #23
    Join Date
    Feb 2015
    Posts
    3
    Hi,

    I used the code below from Ayse, the code is great and I implemented on my website.
    The idea is that the news section will be updated daily in the morning using txt file by the person without html knowledge or access to the website root folder.
    However I wonder whether you can help me with the problem.
    I`m trying to change the code in order to load the content of the text file after the site is open not when the button is pressed like is now.
    I played with the code but messed up completely and give up after that, maybe you can help sort that out.
    I will highly appreciate your help

    At the moment button is placed on the site, when pressed text from the file is loaded on page but I like to change this so the text is loaded just after the page will open.

    <html>
    <head>
    <meta charset="utf-8">
    <script type="text/javascript">

    var nesne ;
    if(navigator.appName.search('Microsoft')>-1) { nesne = new ActiveXObject('MSXML2.XMLHTTP'); }
    else { nesne = new XMLHttpRequest(); }

    function newsSection() {
    nesne.open('get', 'dailyNews.txt', true);
    nesne.onreadystatechange= cevap;
    nesne.send(null);
    }

    function cevap() {
    if(nesne.readyState==4) {
    var el = document.getElementById('news');
    el.innerHTML = nesne.responseText;
    }
    }

    </script>
    </head>
    <body>
    <input type="button" value="dailyNews.txt" onclick="newsSection()">

    <div id="news"></div>

    </body>
    </html>

  9. #24
    Join Date
    Feb 2015
    Posts
    3
    Hi,

    I think I found the solution, easy but for some reason did not work for me before.

    I replaced

    <input type="button" value="dailyNews.txt" onclick="newsSection()">

    with

    window.onload = newsSection;

    Thank you,

  10. #25
    Join Date
    Feb 2015
    Posts
    3
    Hi,

    I have one more problem.
    On my site I have two news board setions Left and Right and pictue slider in the middle, currently the code below works great but ho do I change it in order to load to the right section from separate file.
    I tried to copied the code and just change the variables but for some reason is not loaded and only section from the first script is updated.

    Can you help ?


    Left section - NewsLeft.txt
    Right section - NewsRight.txt


    <script type="text/javascript">

    var nesne ;
    if(navigator.appName.search('Microsoft')>-1) { nesne = new ActiveXObject('MSXML2.XMLHTTP'); }
    else { nesne = new XMLHttpRequest(); }

    function newsLeft() {
    nesne.open('get', 'NewsLeft.txt', true);
    nesne.onreadystatechange= cevap;
    nesne.send(null);
    }

    function cevap() {
    if(nesne.readyState==4) {
    var el = document.getElementById('wordsLeft'); <!-- Id="news" in Section Left -->
    el.innerHTML = nesne.responseText;
    }
    }
    window.onload = newsLeft;
    </script>

    Thank you !

  11. #26
    Join Date
    Sep 2007
    Posts
    323
    Code:
      
    <html>
    <head>
    <meta charset="utf-8">
    <style type="text/css">
    #bil{ font-size: 40px; background-color:#b11; color:white;}
    #sun { font-size: 40px; background-color:#562; color:blue;}
    </style>
    <script type="text/javascript">
    // http://www.webdeveloper.com/forum/showthread.php?261923-how-to-use-javascript-in-html-to-read-txt-file-and-display-it/page2
    
    // http://www.w3schools.com/ajax/ajax_xmlhttprequest_create.asp
    // http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_first
    
    
    // localhost/yolla.htm
    // This code is working  on Firefox 37.02,  internet explorer 11, Opera 29.0,  Chrome 42....
    
    function yolla(dosya,ad) {
    var nesne ;
    if(navigator.appName.search('Microsoft')>-1) { nesne = new ActiveXObject('MSXML2.XMLHTTP'); } 
    else { nesne = new XMLHttpRequest(); }
    
    nesne.ad=ad;
    nesne.open('get', dosya, true); 
    nesne.onreadystatechange= cevap;
    nesne.send(null);
    }
    
    function cevap() {
    if(this.readyState==4) {
    var el = document.getElementById(this.ad);
    el.innerHTML = this.responseText;
    }
    }
    
    
    // not working  in internet explorer 11
    // window.onload = yolla('bilgi.txt','bil');   
    // window.onload =  yolla('arz.txt','sun') ;
    
    
    </script>
    </head>
    <body>
    <input type="button" value="bilgi.txt dosyadaki yazıyı buraya al"  onclick="yolla('bilgi.txt','bil')">
    
    <input type="button" value="arz.txt dosyadaki yazıyı buraya al"  onclick="yolla('arz.txt','sun')">
    <div id="bil"></div>
    
    <div id="sun"></div>
    </body>
    </html>
    yolla.htm
    bilgi.txt
    arz.txt
    Bismillahirrahmanirrahîm
    Hamd, Âlemlerin Rabbi, Rahmân, Rahîm, hesap ve ceza gününün (ahiret gününün) maliki Allah'a mahsustur. (Allahım!) Yalnız sana ibadet ederiz ve yalnız senden yardım dileriz. Bizi doğru yola, kendilerine nimet verdiklerinin yoluna ilet; gazaba uğrayanların ve sapıklarınkine değil.

Thread Information

Users Browsing this Thread

There are currently 2 users browsing this thread. (0 members and 2 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles