【问题标题】:Displaying products stored in MongoDB using AJAX and JavaScript使用 AJAX 和 JavaScript 显示存储在 MongoDB 中的产品
【发布时间】:2018-04-06 10:21:05
【问题描述】:

我为客户创建了跟踪和推荐,它从搜索引擎获取数据。我正在使用 AJAX 从 MongoDB 中获取产品的数据,客户也可以搜索存储在 MongoDB 中的产品。问题是,我无法显示存储在 MongoDB 中的产品。控制台日志中没有错误,当我在搜索引擎上搜索产品时,推荐有效,但我在 MongoDB 中的产品没有显示在我的网站上。

HTML 和 AJAX

<input id="search_engine" type="text" name="search" placeholder="Search for accessories...">
<button id="search_item" onclick="loadContent()"></button>
<h2>Recommendations</h2>
<div id="RecomendationDiv"></div>
<script>
    //Create recommender object - it loads its state from local storage
    var recommender = new Recommender();

    //Display recommendation
    window.onload = showRecommendation;

    //Searches for products in database
    function loadContent() {
        var search = document.getElementById("search_engine").value;
        // Create request object 
        var request = new XMLHttpRequest();
        // Create event handler that specifies what should happen when server responds
        request.onload = function() {
            // Check HTTP status code
            if (request.status == 200) {
                // Get data from server
                var responseData = request.responseText;
                // Add data to page
                document.getElementById("product_grid").innerHTML = responseData;
            } else
                alert("Error communicating with server: " + request.status);
        }
        // Set up request with HTTP method and URL 
        request.open("POST", "php/search.php");
        request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        // Send request
        request.send("search=" + search);
        //Add the search keyword to the recommender
        recommender.addKeyword(search);
        showRecommendation();
    }

    //Display the recommendation in the document
    function showRecommendation() {
        document.getElementById("RecomendationDiv").innerHTML = 
        recommender.getTopKeyword();
    }
</script>

JavaScript

//Constructor for the recommender object
function Recommender() {
    this.keywords = {}; //Holds the keywords
    this.timeWindow = 10000; //Keywords older than this window will be deleted
    this.load();
}

//Adds a keyword to the recommender
Recommender.prototype.addKeyword = function(word) {
    //Increase count of keyword
    if (this.keywords[word] === undefined)
    this.keywords[word] = {
        count: 1,
        date: new Date().getTime()
    };
    else {
        this.keywords[word].count++;
        this.keywords[word].date = new Date().getTime();
    }

    console.log(JSON.stringify(this.keywords));

    //Save state of recommender
    this.save();
};

/* Returns the most popular keyword */
Recommender.prototype.getTopKeyword = function() {
    //Clean up old keywords
    this.deleteOldKeywords();

   //Return word with highest count
   var maxCount = 0;
   var maxKeyword = "";
   for (var word in this.keywords) {
       if (this.keywords[word].count > maxCount) {
           maxCount = this.keywords[word].count;
           maxKeyword = word;
       }
   }
   return maxKeyword;
};

/* Saves state of recommender. Currently this uses local storage, 
but it could easily be changed to save on the server */
Recommender.prototype.save = function() {
    localStorage.recommenderKeywords = JSON.stringify(this.keywords);
};

/* Loads state of recommender */
Recommender.prototype.load = function() {
    if (localStorage.recommenderKeywords === undefined)
        this.keywords = {};
    else
        this.keywords = JSON.parse(localStorage.recommenderKeywords);

    //Clean up keywords by deleting old ones
    this.deleteOldKeywords();
};

//Removes keywords that are older than the time window
Recommender.prototype.deleteOldKeywords = function() {
    var currentTimeMillis = new Date().getTime();
    for (var word in this.keywords) {
        if (currentTimeMillis - this.keywords[word].date > this.timeWindow) {
            delete this.keywords[word];
        }
    }
};

【问题讨论】:

    标签: javascript html ajax mongodb


    【解决方案1】:

    keith,您是否尝试过先用项目中的其余代码对其进行测试?

    【讨论】:

      猜你喜欢
      • 2014-12-10
      • 1970-01-01
      • 2012-04-24
      • 2022-11-02
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-03-14
      相关资源
      最近更新 更多