Abgerufene Daten werden nicht auf einer neuen Seite angezeigt (JavaScript/HTML)

Question

Ich versuche, die aus der Abfrage abgerufenen Daten auf einer anderen Seite anzuzeigen, die Daten werden jedoch nicht auf einer neuen Seite angezeigt.

Die Tabelle wurde mit den Daten korrekt auf der gleichen Seite wie die Suche angezeigt, aber wenn ich versuchte, Dinge zu ändern, so dass die Daten auf einer neuen Seite angezeigt werden, funktioniert es nicht.

Ich benutze JQuery mobile, also ist es eine einseitige Struktur (alle Seiten unter index.html) und ich habe alle meine Javascript in einer separaten Datei.

Kann jemand das Problem hier sehen?

Daten abrufen Funktion:

function fetchEvent() 
      { 
      db = window.openDatabase("SoccerEarth", "2.0", "SoccerEarthDB", 2*1024*1024); 
      db.transaction(foundEvent, errorCB); 
     } 

      function foundEvent(tx) 
      { 
      var TitleT = document.getElementById("texttitle").value; 
      tx.executeSql("SELECT * FROM SoccerEvents WHERE Title LIKE '%" + TitleT + "%'", [], renderEvent); 
         } 

function renderEvent(tx, response) { 
    /* var div = document.getElementById("responsediv"); */ 
    var temp = "<table border=\"1\"><tr><th>Title</th><th>Location</th><th>NoPeople</th><th>Date</th><th>Description</th></tr>"; 

    for (var i = 0; i < response.rows.length; i++) { 
     temp += "<tr><td>" + response.rows.item(i).Title + "</td><td>" + response.rows.item(i).Location + "</td><td>" + response.rows.item(i).NoPeople + "</td><td>" + response.rows.item(i).Date + "</td><td>" + response.rows.item(i).Description + "</td></tr>"; 
     /* div.innerHTML = temp; */ 
    } 
    var page6 = window.open("#page20", "mywin", ''); 
    page6. dataFromParent = temp; 
    page6.render(); 
} 
    var dataFromParent; 
    function render() { 
     $('datadisplay').innerHTML(dataFromParent); 
    } 

HTML (Seite 6):

<div data-role="page" id="page20" data-theme="d"> 

    <div data-role="content"> 
     <div id="datadisplay"> 
     </div> 
    </div> 
</div> 

Answer 1

for (var i = 0; i < response.rows.length; i++) { 
     temp += "<tr><td>" + response.rows.item(i).Title + "</td><td>" + response.rows.item(i).Location + "</td><td>" + response.rows.item(i).NoPeople + "</td><td>" + response.rows.item(i).Date + "</td><td>" + response.rows.item(i).Description + "</td></tr>"; 
     /* div.innerHTML = temp; */ 
    } 

Ok, also wollen u eine andere Seite um Ihre Daten zu zeigen, wenn u auf eine andere Seite verschieben Antwortobjekt, das Ihre Daten verloren hat. Ich würde dir empfehlen, eine ganz neue Seite zu machen. Etwas in dieser Linie.

var formElements = "<table id='resulttable' data-role='table' data-mode='reflow' class='ui-responsive table-stroke table-stripe'><thead><tr><th>Title</th><th>Location</th><th>NoPeople</th><th>Date</th><th>Description</th></tr></thead><tbody>"; 
         for (var i = 0; i < response.rows.length; i++) { 
          formElements += "<tr><td>" + response.rows.item(i).Title + "</td><td>" + response.rows.item(i).Location +"</td><td>" + response.rows.item(i).NoPeople + "</td><td>" + response.rows.item(i).Date +"</td><td>" + response.rows.item(i).Description + "<a href='map.html' rel='external' data-ajax='false' data-role='button' data-mini='true'>View on Map</a></td></tr>"; 
         } 

       formElements+="</tbody></table>"; 
       $('#page_body').append('<div data-role="page" data-theme="d" id="' + page_id + '"><div data-role="content">' + formElements + '<a href="#page4" data-role="button" data-mini="true">Return</a></div></div>'); 
       $.mobile.initializePage(); 
       $.mobile.changePage("#" + page_id); 

page_id ist spezifisch ID der dynamischen Seite, die u

Sie könnten Jetzt müssen einige Anpassung machen nach you.But der Logik einstellen wird man eine ganze div von Grund auf alles machen und es anhängen. Jetzt müssen Sie eine Funktion FORWARD() schreiben, die Ihre Logik für Navigation und BACK haben würde, die Ihre Logik für die BACK-Funktionalität haben würde. Hoffe es hilft.