当用户单击按钮时，如何以特定方式更新多个集合？

问题描述 投票：0回答：1

我有两个收藏： test.matchhistorys（用于存储之前匹配的数据） test.userdbs（用于存储玩家数据）

我有一个名为“live-tracking.ejs”的页面

这是文件的表格：

<main id="site-main">
    <div class="container">
        <div class="box-nav d-flex justify-between">
            <a onclick="nextPoint()" id="next" class="border-shadow">
                <span class="text-gradient2">Next Point <i class="fas fa-arrow-right"></i></span>
            </a>
            <a id="advancedB" onclick="showAdvanced(this.id)" class="border-shadow ad">
                <span class="text-gradient2">Advanced Stats <i class="fas fa-eye"></i></span>
            </a>
            
            <a id="currentB" onclick="showCurrent(this.id)" class="border-shadow ad">
                <span class="text-gradient2">Current Game Stats <i class="fas fa-eye"></i></span>
            </a>
            <a href="/game-over" id="GameOver" class="border-shadow">
                <span class="text-gradient2">Game Over <i class="fas fa-check"></i></span>
            </a>
        </div>
        <form id="liveTrackingForm" class="d-flex">
            <table class="table">
                <thead class="thead-dark">
                    <tr class="currentPoint">
                        <th><button type='button' onclick="sortTable(0, 0)" class="btn" id="sortButton0">Name</button></th>
                        <th><button type='button' onclick="sortTable(1, 1)" class="btn" id="sortButton1">Gender</button></th>
                        <th><button type='button' onclick="sortTable(2, 2)" class="btn" id="sortButton2">Position</button></th>
                        <th><button type='button' onclick="sortTable(3, 3)" class="btn" id="sortButton3">Goals</button></th>
                        <th><button type='button' onclick="sortTable(4, 4)" class="btn" id="sortButton4">Assists</button></th>
                        <th><button type='button' onclick="sortTable(5, 5)" class="btn" id="sortButton5">Turnovers</button></th>
                        <th><button type='button' onclick="sortTable(6, 6)" class="btn" id="sortButton6">Blocks</button></th>
                        <th><button type='button' onclick="sortTable(7, 7)" class="btn" id="sortButton7">Playing</button></th>
                    </tr>
                    <tr class="hidden current">
                        <th><button type='button' onclick="sortTable(8, 0)" class="btn" id="sortButton8">Name</button></th>
                        <th><button type='button' onclick="sortTable(9, 1)" class="btn" id="sortButton9">Gender</button></th>
                        <th><button type='button' onclick="sortTable(10, 2)" class="btn" id="sortButton10">Position</button></th>
                        <th><button type='button' onclick="sortTable(11, 3)" class="btn" id="sortButton11">Goals</button></th>
                        <th><button type='button' onclick="sortTable(12, 4)" class="btn" id="sortButton12">Assists</button></th>
                        <th><button type='button' onclick="sortTable(13, 5)" class="btn" id="sortButton13">Turnovers</button></th>
                        <th><button type='button' onclick="sortTable(14, 6)" class="btn" id="sortButton14">Blocks</button></th>
                        <th><button type='button' onclick="sortTable(15, 7)" class="btn" id="sortButton15">Points Played</button></th>
                    </tr>
                    <tr class="hidden advanced">
                        <th><button type='button' onclick="sortTable(16, 0)" class="btn" id="sortButton16">Name</button></th>
                        <th><button type='button' onclick="sortTable(17, 1)" class="btn" id="sortButton17">Gender</button></th>
                        <th><button type='button' onclick="sortTable(18, 2)" class="btn" id="sortButton18">Position</button></th>
                        <th><button type='button' onclick="sortTable(19, 3)" class="btn" id="sortButton19">Goals</button></th>
                        <th><button type='button' onclick="sortTable(20, 4)" class="btn" id="sortButton20">Assists</button></th>
                        <th><button type='button' onclick="sortTable(21, 5)" class="btn" id="sortButton21">Turnovers</button></th>
                        <th><button type='button' onclick="sortTable(22, 6)" class="btn" id="sortButton22">Blocks</button></th>
                        <th><button type='button' onclick="sortTable(23, 7)" class="btn" id="sortButton23">Points Played</button></th>
                    </tr>
                </thead>
                
                <tbody>
                    <% for(var i = 0; i < users.length; i++) { %>
                        <tr class="currentPoint" id="counter">
                            <td><%= users[i].name %></td>
                            <td><%= users[i].gender %></td>
                            <td><%= users[i].position %></td>
                            <td><input type="checkbox" onclick="goal(this)" class="goal" data-name="<%= users[i].name %>"></td>
                            <td><input type="checkbox" onclick="assist(this)" class="assist" data-name="<%= users[i].name %>"></td>

                            <% for(var j = 0; j < 2; j++) { %>
                                <td>
                                    <div>
                                        <button type="button" onclick="increment(this)">+</button>
                                        <span id="countValue_<%= i %>">0</span>
                                        <button type="button" onclick="decrement(this)">-</button>
                                    </div>
                                </td>
                            <% } %>
                            <td><input type="checkbox" onclick="updatePlayingArray(this)"></td> 
                        </tr>
                        <tr class="hidden current">
                            <td><%= users[i].name %></td>
                            <td><%= users[i].gender %></td>
                            <td><%= users[i].position %></td>
                            <td><%= users[i].cGoals %></td>
                            <td><%= users[i].cAssists %></td>
                            <td><%= users[i].cTurnovers %></td>
                            <td><%= users[i].cBlocks %></td>
                            <td><%= users[i].cPointsPlayed %></td>
                        </tr>
                        <tr class="hidden advanced">
                            <td><%= users[i].name %></td>
                            <td><%= users[i].gender %></td>
                            <td><%= users[i].position %></td>
                            <% if (Number.isNaN(users[i].goals/users[i].pointsPlayed)) { %>
                                <td>0</td>
                            <% } else { %>
                                <td><%= parseFloat(users[i].goals/users[i].pointsPlayed).toFixed(2)%></td><% } %>
                            <% if (Number.isNaN(users[i].assists/users[i].pointsPlayed)) { %>
                                <td>0</td>
                            <% } else { %>
                                <td><%= parseFloat(users[i].assists/users[i].pointsPlayed).toFixed(2)%></td><% } %>
                            <% if (Number.isNaN(users[i].turnovers/users[i].pointsPlayed)) { %>
                                <td>0</td>
                            <% } else { %>
                                <td><%= parseFloat(users[i].turnovers/users[i].pointsPlayed).toFixed(2)%></td><% } %>
                            <% if (Number.isNaN(users[i].blocks/users[i].pointsPlayed)) { %>
                                <td>0</td>
                            <% } else { %>
                                <td><%= parseFloat(users[i].blocks/users[i].pointsPlayed).toFixed(2)%></td> <% } %>
                            <td><%= users[i].pointsPlayed %></td>
                        </tr>
                        <% } %>            
                </tbody>
                <thead class="thead">
                    <tr class="hidden advanced miniHeader"><th colspan="9">Per Point Stats</th></tr>
                </thead>
                <thead class="thead">
                    <tr class="hidden current miniHeader"><th colspan="9">Current Game Stats</th></tr>
                </thead>
            </table>
        </form> 
    </div>
</main>

我构建的表有一个计数器，用户可以通过使用 X 所在的增量计数器来更新 test.userdbs 中特定玩家的统计数据。

Table     Goals     Assists     Turnovers     Blocks

User1       x          x           x             x   

User2       x          x           x             x  

User3       x          x           x             x

目前，我们正在跟踪与 team1 比赛时的统计数据。在test.matchhistory中，会有一个test.matchhistory.name = "team1"的文档

如果用户 1 的目标计数器增加，我想添加计数器的任何数字，并将其添加到用户 1 的现有目标和 test.userdbs 中的 cGoals 中。

在此文件中，我还设置了一个名为 eventLine 的二维数组。每当用户单击“下一点”按钮时，我想将此 eventLine 数组推送到 test.matchhistory -> team1 -> eventList （数组）。此外，如果 eventLine 数组中有“Goal”，则在 matchhistory.ourScore 中加 1。如果没有，则在 matchhistory.theirScore 中加 1

这是收藏品的模型

import mongoose from 'mongoose';

const matchHistorySchema = new mongoose.Schema({
    team: String,
    win: Boolean,
    ourScore: Number,
    theirScore: Number,
    date: Number,
    od: String,
    location: String,
    eventList: Array
});

const schema = new mongoose.Schema({
    name: String,
    age: String,
    number: String,
    gender: String,
    position: String,
    contact: String,
    status: String,
    note: String,
    assists: Number,
    goals: Number,
    turnovers: Number,
    blocks: Number,
    pointsPlayed: Number,
    cAssists: Number,
    cGoals: Number,
    cTurnovers: Number,
    cBlocks: Number,
    cPointsPlayed: Number
});

const MatchHistory = mongoose.model('MatchHistory', matchHistorySchema);
const Userdb = mongoose.model('userdb', schema);

export { MatchHistory, Userdb };

我的实时跟踪文件中使用的集合的变量是 selectedMatch 和 users

为了更新事件列表， 我尝试运行这个函数，当按下“下一点”时会调用该函数

function nextPoint() {
    eventLine.push("point")
    const data = {
        eventLine: eventLine,
    };

    $.ajax({
        url: '/api/updateEventList',
        method: 'POST',
        contentType: 'application/json',
        data: JSON.stringify(data),
        success: function (response) {
            console.log('Success:', response);
            // Reset the eventLine array if needed
            eventLine.length = 0;
            // Reload the page or update as needed
            window.location.reload();
        },
        error: function (error) {
            console.error('Error:', error);
        },
    });
}

然后这个 

route.put('/api/updateEventList', controller.updateEventList);

最后


export const updateEventList = async (req, res) => {
    const { eventLine } = req.body;
    
    try {
        // Find the most recent match history entry
        const mostRecentMatch = await MatchHistory.findOne().sort({ date: -1 });

        if (!mostRecentMatch) {
            return res.status(404).json({ message: 'No match history found' });
        }
        if ("point" in eventLine){
            mostRecentMatch.ourScore = mostRecentMatch.ourScore + 1;
        } else {
            mostRecentMatch.theirScore = mostRecentMatch.theirScore+1;
        }

        // Update the eventList with the new data
        mostRecentMatch.eventList.push(eventLine);

        // Save the updated match history
        const updatedMatchHistory = await mostRecentMatch.save();

        res.json({ message: 'Event list updated successfully', matchHistory: updatedMatchHistory });
    } catch (error) {
        console.error(error);
        res.status(500).json({ error: 'Internal server error' });
    }
};

但是我回来了

jquery.min.js:2     POST http://localhost:3000/api/updateEventList 404 (Not Found)
send @ jquery.min.js:2
ajax @ jquery.min.js:2
nextPoint @ live-tracking:403
onclick @ live-tracking:72
live-tracking:416 Error: {readyState: 4, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ, …}abort: ƒ (e)always: ƒ ()catch: ƒ (e)done: ƒ ()fail: ƒ ()getAllResponseHeaders: ƒ ()getResponseHeader: ƒ (e)overrideMimeType: ƒ (e)pipe: ƒ ()progress: ƒ ()promise: ƒ (e)readyState: 4responseText: "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<title>Error</title>\n</head>\n<body>\n<pre>Cannot POST /api/updateEventList</pre>\n</body>\n</html>\n"setRequestHeader: ƒ (e,t)state: ƒ ()status: 404statusCode: ƒ (e)statusText: "Not Found"then: ƒ (t,n,r)[[Prototype]]: Object
error @ live-tracking:416
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
l @ jquery.min.js:2
(anonymous) @ jquery.min.js:2
load (async)
send @ jquery.min.js:2
ajax @ jquery.min.js:2
nextPoint @ live-tracking:403
onclick @ live-tracking:72

我还没有尝试更新用户统计数据或 matchhistory.their/ourScore。

node.js ajax mongodb ejs
1个回答
0
投票

显然它会返回 

404
，因为您使用 
put
 方法定义了路线，但以 
$.ajax
方法调用 
POST

function nextPoint() {
    eventLine.push("point")
    const data = {
        eventLine: eventLine,
    };

    $.ajax({
        url: '/api/updateEventList',
        method: 'PUT',                 // Change this
        contentType: 'application/json',
        data: JSON.stringify(data),
        success: function (response) {
            console.log('Success:', response);
            // Reset the eventLine array if needed
            eventLine.length = 0;
            // Reload the page or update as needed
            window.location.reload();
        },
        error: function (error) {
            console.error('Error:', error);
        },
    });
}
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.