Erstellen Sie eine HTML-Tabelle aus text-Datei mithilfe von Javascript?

Ich weiß gar nicht, ob mein Projekt ist möglich. Nach einem Blick herum für ein paar Stunden und lese auf anderen Stack-Überlauf Fragen, meine Hoffnungen langsam schwinden, aber es wird nicht aufhören mich zu Fragen!

Mein Projekt: erstellen Sie eine einfache HTML-Tabelle kategorisieren unser Verkaufsteam Telefon-Aktivität für meine Vorgesetzte. Momentan habe ich etwas benötigen, ziehen Sie die Daten-Werte aus einer Datei und verwenden Sie diese Werte in die Tabelle.

Mein Problem: Kann Javascript auch? Ich weiß, es liest cookies auf der client-Seite computer sein, aber es liest eine Datei im gleichen Verzeichnis wie die Webseite? (Wenn die Webseite ist auf dem server im Unternehmen?)

Meine Fortschritte: ich werde aktualisieren, wie ich mehr Informationen zu finden.

Update: Viele von Euch neugierig sind, wie die Datei gespeichert ist. Es ist eine statische Webseite (table.html) auf unserem fileserver. Die text-Datei (data.txt) werden im gleichen Verzeichnis.

  • Ja, ich habe gelesen, dass der Versuch, eine Datei zugreifen, die über Javascript kann dazu führen, verwirrenden Fehler-codes. Problem ist, dass PHP nicht installiert ist, auf dem Datei-server, also brauche ich etwas, das client-Seite. Ihre Computer nicht habe Python installiert, also kein cgi gibt. 🙁
  • Sie können nur durchführbar, wenn die Daten-Datei ist öffentlich
  • Wenn die Datei auf dem server, Sie können die Inhalte Lesen durch den Einsatz von AJAX. Es ist besser, speichern Sie Ihre Daten im JSON-format und nur parse es nach dem aufstehen den Inhalt.
  • Dies kann helfen: stackoverflow.com/questions/1981815/jquery-read-a-text-file
  • Ich bin nicht vertraut mit AJAX, aber ich werde das prüfen.
  • Wenn Sie erwägen, jQuery, Hier ist ein gutes tutorial: sitepoint.com/ajax-jquery und nehmen Sie einen Blick auf: api.jquery.com/jQuery.ajax

InformationsquelleAutor Jacob Bridges | 2013-08-12
  1. 1

    Ich habe vor kurzem ein Projekt, wo fast hätte ich die genauen Bedingungen, wie Sie sich selbst (der einzige Unterschied ist, dass Anwender ausschließlich den IE nutzen).

    Landete ich mit JQuery $.ajax() Funktion, und zog die Daten aus einer XML-Datei.

    Diese Lösung erfordert die Verwendung von Microsoft Access oder Excel. Ich benutzte, wie schon in der 2003-version, aber die späteren Versionen gut funktionieren.

    Meine Daten in einer Tabelle in Access (in Excel habe ich eine Liste). Sobald Sie erstellt haben Ihre Tabelle in Access; es ist ehrlich so einfach wie schlagen 'Export', speichern als XML und dann spielen, um mit Ihrem "ajax ()" - Funktion (http://api.jquery.com/jQuery.ajax/) zu manipulieren die Daten, die Sie wollen ausgegeben werden, und dann CSS/HTML für das layout Ihrer Seite.

    Ich würde empfehlen, den Zugriff, da es weniger hastle, dass es auch zum exportieren von XML in der richtigen Weise, aber Excel tut es einfach gut, mit ein wenig mehr basteln.

    Hier die Schritte mit ms-access:

    Erstellt eine Tabelle in der access - & export als XML -

    Erstellen Sie eine HTML-Tabelle aus text-Datei mithilfe von Javascript?

    Der generierte XML-Code sieht dann so aus:

    <?xml version="1.0" encoding="UTF-8"?>
<dataroot xmlns:od="urn:schemas-microsoft-com:officedata" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  xsi:noNamespaceSchemaLocation="Calls.xsd" generated="2013-08-12T19:35:13">
<Calls>
    <CallID>1</CallID>
    <Advisor>Jenna</Advisor>
    <AHT>125</AHT>
    <Wrap>13</Wrap>
    <Idle>6</Idle>
</Calls>
<Calls>
    <CallID>3</CallID>
    <Advisor>Edward</Advisor>
    <AHT>90</AHT>
    <Wrap>2</Wrap>
    <Idle>4</Idle>
</Calls>
<Calls>
    <CallID>2</CallID>
    <Advisor>Matt</Advisor>
    <AHT>246</AHT>
    <Wrap>11</Wrap>
    <Idle>5</Idle>
</Calls>

    Beispiel HTML -

    <table id="doclib">
    <tr><th>Name</th><th>AHT</th><th>Wrap</th><th>Idle</th></tr>
</table>

    jQuery:

    $(document).ready(function(){
$.ajax({
    type: "GET",
    url: "Calls.xml",
    dataType: "xml",
    success: function(xml) {
        $(xml).find('Calls').each(function(){
            var advisor = $(this).find('Advisor').text(),
                aht = $(this).find('AHT').text(),
                wrap = $(this).find('Wrap').text(),
                idle = $(this).find('Idle').text(),
                td = "<td>",
                tdc = "</td>";
            $('#doclib').append("<tr>" + 
                td + advisor + tdc + td + aht + tdc + td + wrap + tdc + td + idle + tdc + "</tr>")  
            });
        }
    });
});
    InformationsquelleAutor Matt
  2. 0

    JavaScript nicht automatisch Lesen von Dateien aus Sicherheitsgründen.

    Haben Sie zwei Möglichkeiten:

    • Wenn Sie sich verlassen können IE genutzt wird, könnten Sie einige ausgefallene ActiveX-Zeug.

    • Verwenden Sie ein backend, die entweder ständig pushs von Daten an die JS-client oder stellt die Daten über pull-requests.

    • "Fancy ActiveX-Zeug? Klingt spannend, können Sie erläutern, ein wenig mehr?
    • Meine Programmier-Erfahrungen mit ActiveX ist sehr klein (eigentlich keine). Aber schau mal hier: powerobjects.com/blog/2008/09/02/69, Der code scheint nicht ganz in Ordnung.
    InformationsquelleAutor ComFreek
  3. 0

    Dies könnte funktionieren, wenn Sie einen server haben, wie bauen mit Node.js, PHP, ...etc.

    JavaScript-Dateien Lesen kann, die mit der Ajax-Protokoll, aber das bedeutet, dass Sie einen server benötigen.

    Ansonsten Ihre Anfragen gehen über den file://Protokoll nicht unterstützt Ajax.

    • Die table.html Datei hochgeladen wird, ein "server"..es ist eigentlich shared storage. Soweit Ajax geht..das ist mir neu. Wenn Sie irgendwelche hilfreichen links können Sie diese kommentieren? Ich werde suchen gehen.
    InformationsquelleAutor m_vdbeek
  4. 0

    Können Sie versuchen, suchen in der FileReader:
    https://developer.mozilla.org/en-US/docs/Web/API/FileReader

    The FileReader object lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer

    Ich habe noch nie persönlich bekommen, um richtig funktionieren, aber es soll in der Lage sein, zu ermöglichen, diese Art der Sache.

    • Danke, ich werde in diesem Blick..obwohl es so aussieht, als ob FileReader müssen installiert werden, auf dem client-PC. ich habe nicht diese Privilegien.
    InformationsquelleAutor
  5. 0

    Versuchen mit XMLHttpRequest oder ActiveXObject im IE 5 oder IE 6.

    Hier finden Sie eine Erklärung:

    http://www.w3schools.com/xml/xml_http.asp

    Oder versuchen Sie dieses Beispiel:

    http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_first

    • Mein Vorgesetzter nutzt Firefox ausschließlich..und er hasst den IE. Also, ich habe zu biegen, um seine Vorlieben, wissen Sie? Danke für die Antwort aber!
    InformationsquelleAutor fagace
  6. 0

    Es klingt wie Sie nur wollen, um den Inhalt einer statischen Datei von Ihrem server; ist das richtig? Wenn es das ist, was Sie tun müssen, haben Sie Glück. Das ist sehr einfach.

    load('textTable.txt', function(err, text) {
    buildTable(text);
});

function load(url, callback) {  
    var xhr = new XMLHttpRequest();  

    xhr.onreadystatechange = function() {
        if (xhr.readyState < 4) return;

        if (xhr.status !== 200) {  
            return callback('HTTP Status ' + xhr.status);
        }  

        if (xhr.readyState === 4) {  
            callback(null, xhr.responseText);  
        }             
    };

    xhr.open('GET', url, true);  
    xhr.send('');  
}

    Wenn Sie gehen mit qwest, es wird in etwa so Aussehen:

    qwest.get('textTable.txt').success(function(text) {
    buildTable(text);
});

    Mit jQuery:

    jQuery.get('textTable.txt', function(text) {
    buildTable(text);
});
    • Ich glaube nicht, er hat ein server nur eine statische Seite.
    • Eine statische Seite auf dem server. als er erwähnt.
    • Vielen Dank für das posten der Codes, aber nicht XMLHttpRequest() nur auf IE?
    • Nope, es funktioniert in allen modernen Browsern. Ich würde nicht mit diesem allzu einfachen Beispiel-code im real-life. Look at github.com/pyrsmk/qwest. Es werden Fehler behandelt, die viel besser und funktioniert in allen Browsern.
    • Ist es das, was Sie tun musste? Macht diese Arbeit für Sie?
    • Ehrlich, ich bin immer noch am Lesen der github-Dokumentation. Javascript ist ziemlich neu für mich, und das ging direkt über meinem Kopf. Aber wenn es die Lösung, ich werde zu aktualisieren meinem Q&A entsprechend.

    InformationsquelleAutor Trevor Dixon
Schreibe einen Kommentar