Должен быть более простой способ

Question

Я пытаюсь создать приложение JQM и делаю это, получая много данных из базы данных. Когда я нажимаю на ссылку из списка календарей, созданных ajax/json, я должен получить информацию об этом событии, вызвав сервер и получив данные. Как сейчас, я делаю это в 2 этапа, как это.

Мой Аякса генерируется список событий:

$.each(groupcalendar, function (i, val) { 
    output += '<li><a href="#" data-id="' + val.mid + '" id="gotoMatch"><h2>' + val.matchformname + '</h2><p><strong>' + val.matchday + '</strong></p><p>' + val.coursename + '</p><p class="ui-li-aside"><strong>' + val.matchtime + '</strong></p></a></li>'; 
}); 

При нажатии на одну из ссылок, которые я хочу Гото страничный называется prematchdata.html и получить данные обозревает этот конкретный случай. Я делаю это с помощью первого вызова нажмите и получить EventID от данных идентификатором так:

$(document).on('click', '#gotoMatch', function() { 

    var matchid = $(this).attr("data-id"); 

    $.get("http://mypage.com/json/getmatchinfo.php?matchid="+matchid, function(data) { 

     localStorage["matchinfo"] = JSON.stringify(data); 

     $.mobile.changePage("prematchdata.html", { transition: "slide", changeHash: true}); 

    }, "json"); 

}); 

Я сохранить полученные данные в качестве LocalStorage, а затем использует эти данные в моей pageinit так:

$(document).on("pageinit", "#prematchdata", function() { 

    var matchinfo = {}; 
    matchinfo = JSON.parse(localStorage["matchinfo"]) 

    var content = '<h2>'+matchinfo["matchname"]+'</h2>'; 

    $('.infoholder').html(content); 

}); 

Это работает, хотя для меня кажется, что последние 2 шага должны быть выполнены в одном, но я не уверен, как это сделать? Кажется, что немного неправильно получить данные, сохранить локально, а затем использовать его? Невозможно это сделать без $ (document) .on ('click', '#gotoMatch', function() {});?

Надеясь на помощь и заранее спасибо :-)

Answer 1

Вы могли бы попытаться отправить его с помощью строки запроса. Когда вы используете changePage, изменить код так:

$(document).on('click', '#gotoMatch', function() { 

    var matchid = $(this).attr("data-id"); 
    $.get("http://mypage.com/json/getmatchinfo.php?matchid=" + matchid, function (data) { 
     paramData = data[0]; 
     $.mobile.changePage("prematchdata.html", { 
      transition: "slide", 
      changeHash: true, 
      data: paramData //added this extra parameter which will pass data as a query string 
     }); 
    }, "json"); 

}); 

Когда вы получаете его обратно,

$(document).on("pageinit", "#prematchdata", function() { 

    var url = $.url(document.location); 
    var name= url.param("matchname"); 

    var content = '<h2>'+ name +'</h2>'; 

    $('.infoholder').html(content); 

}); 

Другого простым способом будет использовать шаблон singlepage вместо несколько шаблона страницы , Затем вы можете просто использовать глобальную переменную для получения и установки данных.

Это то, что вы делаете прямо сейчас, более безопасно, чем этот метод строки запроса. Используя это, каждый может видеть, что вы отправляете по URL-адресу. Поэтому я советую вам продолжать использовать localStorage.For more info on this, look into this question.