选择第1页上的item2将返回第2页上的item1

I am dynamically creating rows and tables from a database to display a list of read-only items. When one of these items is clicked, the page should reload to a different window and display the relevant results related to the clicked item.

我从数据库动态创建行和表以显示只读项列表。单击其中一个项目时,页面应重新加载到其他窗口并显示与所单击项目相关的相关结果。

I have 99% of this working, however when I click the first row (let's say "item1" the next window reflects undefined. When I click the second row ("item2") the window reflects the results of item1. When I click the third row ("item3") the window reflects the results of item2.

我有99%的工作,但是当我点击第一行时(让我们说“item1”,下一个窗口反映未定义。当我点击第二行(“item2”)时,窗口反映了item1的结果。当我点击第三行(“item3”)窗口反映了item2的结果。

The most I understand is that I may not be storing the variables correctly.

我最了解的是我可能没有正确存储变量。

My closest guess is this may be a solution for queryString, however I am not sure how or where to implement it.

我最接近的猜测是这可能是queryString的解决方案,但我不确定如何或在何处实现它。

I have provided all relevant code commented for the sake of anyone else who may have this problem.

为了可能遇到此问题的其他人,我提供了所有相关代码。

var customApp = function(){

// Establish Variables
var salonName
var salonDomainLink
var salonAddress
var salonPhoneNumber
var salonSelection

// Queries Salons class
var query1 = new Parse.Query("Salons");
query1.find({
    success: function(results) {

    // Changes search results from JSON Object to ?something readable?
        var searchResults = JSON.parse(JSON.stringify(results))

        // Loops through every result and creates variables with each specific result
        for ( var i in searchResults) {
            salonName = searchResults[i].name;
            salonDomainLink = searchResults[i].domainLink;

            // Creates a new row for each item in table
            var newrow = $('<tr>').text('').appendTo('#searchTable');

            // Adds a cell for each salonName in row
            var nameCell = $('<td>').text(salonName).appendTo(newrow);

            // Adds an id of the salon name + 'Id' to each row
            var cellId = nameCell.attr("id", salonName.replace(/\s+/g, '') + "Id")

            // Changes class of each cell
            nameCell.addClass("text-left font-w600 text-primary");
        }

        // Passes clicked salon name to a variable for use on another page
        $('#searchTable tr td').click(function(){

            // Acquires text value of the specific td of tr
            salonSelection = $(this)[0].childNodes[0].nodeValue

            // Saves the variable to local storage (can be retrieved with "localStorage.salonSelection")
            delete localStorage.salonSelection;
            window.localStorage.salonSelection = salonSelection;
            window.location = 'base_pages_schedule_1.html';
        });
    },
    error: function(error) {
        alert("Error: " + error.code + " " + error.message + ". Please contact Support.");
    }
});

query1.equalTo("name", localStorage.salonSelection);
query1.find({
    success: function(results) {
        var searchResults = JSON.parse(JSON.stringify(results))
        // Loops through every result and creates variables with each specific result
        for ( var i in searchResults) {
            window.localStorage.salonName = searchResults[i].name;
            window.localStorage.salonDomainLink = searchResults[i].domainLink;
            window.localStorage.salonAddress = searchResults[i].address;
            window.localStorage.salonPhoneNumber = searchResults[i].phoneNumber;
        }
    },
    error: function(error) {
        alert("Error: " + error.code + " " + error.message + ". Please contact Support.");
    }
});
$('#salon-name').text(localStorage.salonName);
$('#salon-address').text(localStorage.salonAddress);
$('#salon-phone-number').text(localStorage.salonPhoneNumber):};

1 个解决方案

#1

query.find() is asynchronous so it won't set new values until after you set the text() in the dom

query.find()是异步的,所以在你在dom中设置text()之前它不会设置新的值

Move the dom updates into your find() success callback

将dom更新移动到find()成功回调中

query1.find({
    success: function(results) {
        var searchResults = JSON.parse(JSON.stringify(results))
        // process results

        // then update dom
        $('#salon-name').text(localStorage.salonName);

    },
    error: function(error) {
        alert("Error: " + error.code + " " + error.message + ". Please contact Support.");
    }
});

Also note that your for loop is rewriting a new value to the storage keys on each iteration of the loop so only the last one gets stored. Not sure what your storage objectives are here

另请注意,for循环在循环的每次迭代中都会重写一个新值到存储键,因此只存储最后一个。不确定您的存储目标是什么

#1