2 글 보임 - 1 에서 2 까지 (총 2 중에서)
-
글쓴이글
-
2024년 2월 1일 10:01 #112051
권상웅참가자검색기능 fetch로 기능 만들다가 안되네요.. server.js------------------------------------------------
app.get('/search', async (요청, 응답) => { let result = await db.collection('post').find().toArray(); let 찾은거 = await result.filter((a, i) => { return a.title == 요청.query.value; }); console.log(찾은거);
if (찾은거.length > 0) { 응답.render('search.ejs', { 글목록: 찾은거 }); } });
search.ejs---------------------------------------------------------------------
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link rel="stylesheet" href="/main.css" /> </head>
<body class="grey-bg"> <%- include('nav.ejs') %> <div class="serach-box" style="margin-top: 20px"> <input class="search" /> <button class="search-send">검색</button> </div>
<script> let search = document.querySelector('.search'); let send = document.querySelector('.search-send'); send.addEventListener('click', function () { // location.href = `/search?value=${search.value}`;
fetch(`/search?value=${search.value}`, { method: 'GET', // GET 메소드로 수정 }) .then(res => res.json())
.then(res => { document.querySelector('.white-bg').innerHTML = ''; res.forEach((a, i) => { document.querySelector( '.white-bg' ).innerHTML = `<div class="list-box"> <h4> <a href="/detail/${a._id}" style="text-decoration: none; color: black" >${a.title}</a > <a href="/edit/${a._id}" style="text-decoration: none"> ✏️</a> <span class="delete" data-id="${a._id}">🗑️</span> </h4> <p>${a.content}</p> </div>`; }); }); }); </script>
<h4 style="margin-left: 20px">검색결과</h4>
<div class="white-bg"> <% 글목록.forEach((a, i)=>{ %> <div class="list-box"> <h4> <a href="/detail/<%= a._id%>" style="text-decoration: none; color: black" ><%=a.title%></a > " style="text-decoration: none"> ✏️ <span class="delete" data-id="<%=글목록[i]._id%>">🗑️</span> </h4> <p><%=a.content%></p> </div>
<%}) %> </div> " style="margin-left: 20px">이전 ">다음
<script> let 없애기 = document.querySelectorAll('.delete'); let 없어질친구 = document.querySelectorAll('.list-box'); for (let i = 0; i < 없애기.length; i++) { 없애기[i].addEventListener('click', function (e) { fetch(`/delete?docid=${e.target.dataset.id}`, { method: 'DELETE', }) .then(result => result.text()) .then(result => { 없애기[i].parentElement.parentElement.parentElement.removeChild( 없어질친구[i] ); }); }); } </script> </body> </html> list.ejs--------------------------------------------------------------------------------
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link rel="stylesheet" href="/main.css" /> </head>
<body class="grey-bg"> <%- include('nav.ejs') %> <div class="serach-box" style="margin-top: 20px"> <input class="search" /> <button class="search-send">검색</button> </div>
<script> let search = document.querySelector('.search'); let send = document.querySelector('.search-send'); send.addEventListener('click', () => { // location.href = `/search?value=${search.value}`; fetch(`/search?value=${search.value}`, { method: 'GET', // GET 메소드로 수정 }) .then(res => res.json()) .then(res => { document.querySelector('.white-bg').innerHTML = ''; res.forEach((a, i) => { document.querySelector( '.white-bg' ).innerHTML = `<div class="list-box"> <h4> <a href="/detail/${a._id}" style="text-decoration: none; color: black" >${a.title}</a > <a href="/edit/${a._id}" style="text-decoration: none"> ✏️</a> <span class="delete" data-id="${a._id}">🗑️</span> </h4> <p>${a.content}</p> </div>`; }); }); }); </script>
<div class="white-bg"> <% 글목록.forEach((a, i)=>{ %> <div class="list-box"> <h4> <a href="/detail/<%= a._id%>" style="text-decoration: none; color: black" ><%=a.title%></a > " style="text-decoration: none"> ✏️ <span class="delete" data-id="<%=글목록[i]._id%>">🗑️</span> </h4> <p><%=a.content%></p> </div>
<%}) %> </div> " style="margin-left: 20px">이전 ">다음
<script> let 없애기 = document.querySelectorAll('.delete'); let 없어질친구 = document.querySelectorAll('.list-box'); for (let i = 0; i < 없애기.length; i++) { 없애기[i].addEventListener('click', function (e) { fetch(`/delete?docid=${e.target.dataset.id}`, { method: 'DELETE', }) .then(result => result.text()) .then(result => { 없애기[i].parentElement.parentElement.parentElement.removeChild( 없어질친구[i] ); }); }); } </script> </body> </html>
white-bg를 없앤다음에 res를 넣는 식으로 해보았는데 안되어서 여쭤봅니다.. 어떤게 문제가 있을까요? 어떤것 때문에 안되는지 너무 답답하네요,,
-
글쓴이글
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
- 답변은 로그인 후 가능합니다.