검색기능 queryString 문제 문의 드립니다.

4 글 보임 - 1 에서 4 까지 (총 4 중에서)

글쓴이

글

2023년 3월 10일 15:06 #71757

참가자

안녕하세요. 
Node.js, MongoDB로 2시간 만에 빠르게 웹서비스 만들기 를 수강중에 있습니다.

현재 [검색기능 만들기 1 : URL query string]을 보고있는데

window.location.replace 처리 시 상단 URL이 변경되지 않습니다.
콘솔창에는 입력한 키워드가 정상적으로 뿌려지는데 url 입력창의 값은 변화가 없습니다 ㅜ



관련한 소스는 아래와 같습니다.

■ list.ejs 파일 전체 소스
<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Bootstrap demo</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">

  <link rel="stylesheet" href="/public/main.css">
</head>

<body>

  <%- include('nav.html') %>

    <h4 class="container mt-4">서버에서 가져온 할일 리스트</h4>

    <div class="container input-group mb-2">
      <input class="form-control" id="search-input">
      <button class="input-group-append btn btn-danger" id="search">검색</button>
    </div>

    <div class="container">
      <ul class="list-group">
        <% for (var i=0; i < posts.length ; i++){ %>
          <li class="list-group-item">
            <p>글번호 :<%= posts[i]._id %>
            </p>
            <h4>할일 제목 : <%= posts[i].제목 %>
            </h4>
            <P>할일 마감날짜 : <%= posts[i].날짜 %>
            </P>
            <button class="btn btn-danger delete" data-id=<%=posts[i]._id %>>삭제</button>

          
          <% } %>
      
    </div>

    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

    <script>

      $('.delete').click(function (e) {
        var postNum = e.target.dataset.id;
        var nowClickPost = $(this);

        $.ajax({
          method: 'DELETE',
          url: '/delete',
          data: { _id: postNum }
        }).done(function (results) {
          console.log('성공했습니다.');
          nowClickPost.parent('li').fadeOut();

        }).fail(function (xhr, textStatus, errorThrown) {
          console.log(xhr, textStatus, errorThrown);
        })

})

      $('#search').click(function () {
        var searchKeyWord = $('#search-input').val();
        window.location.replace('/search?value=' + searchKeyWord)
      });

    </script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN"
      crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"
      integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3"
      crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js"
      integrity="sha384-mQ93GR66B00ZXjt0YO5KlohRA5SY2XofN4zfuZxLkoj1gXtW8ANNCe9d5Y3eG5eD"
      crossorigin="anonymous"></script>
</body>

</html>

■ server.js search get 부분 코드
 app.get('/search', (req, res)=>{
    console.log(req.query.value);
  })

2023년 3월 10일 17:27 #71773

codingapple

키 마스터

/search접속시 서버에서 페이지 보내거나 응답같은거해줍시다

2023년 3월 10일 18:13 #71785

하세철

참가자

아. 해당 부분이 빠져있는데요.
맨 아래와 같이

console 로그도 남기도 
search.ejs 파일로 랜더링도 해주고 있습니다.


app.get('/search', (req, res) => {
    var searchCondition = [
        {
            $search: {
                index: 'titleSearch',
                text: {
                    query: req.query.value,
                    path: '제목'  // 제목날짜 둘다 찾고 싶으면 ['제목', '날짜']
                }
            }
        },
        // { $project: { 제목: 1, _id: 0, score: { $meta: "searchSocre" } } }
    ]
    db.collection('post').aggregate(searchCondition).toArray((err, results) => {
        // db.collection('post').find({$text: {$search :req.query.value}}).toArray((err, results) => {
        // db.collection('post').find({제목:req.query.value}).toArray((err, results) => {
        console.log(req.query.value);
        console.log(results);
        res.render('search.ejs', { posts: results });
    })
})

2023년 3월 10일 18:13 #71786

하세철

참가자

아.. 그런데 갑자기 지금 하니까 되네요 ^^

답변 감사합니다.

글쓴이

글

4 글 보임 - 1 에서 4 까지 (총 4 중에서)

답변은 로그인 후 가능합니다.

로그인

검색기능 queryString 문제 문의 드립니다.

https://codingapple.com/wp-content/uploads/2019/06/logo2-3.png