Node.js - Twitter Clone Coding // posting send button 활성화 시키기

mixins.pug

mixin createPostForm(userLoggedIn)
    .postFormContainer 
        .userImageContainer 
            img(src=userLoggedIn.profilePic, alt="User's profile picture")
        .textareaContainer 
            textarea#postTextarea(placeholder="What's happening?")
            .buttonsContainer 
                button#submitPostButton(disabled="") Post 

main-layout.pug

include ../mixins/mixins


doctype html
html(lang="en")
    head
        meta(charset="UTF-8")
        meta(http-equiv="X-UA-Compatible", content="IE=edge")
        meta(name="viewport", content="width=device-width, initial-scale=1.0")
        title #{pageTitle}
        link(rel='stylesheet', href='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css', integrity='sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh', crossorigin='anonymous')
        link(rel="stylesheet", href="/css/main.css")
        


    body 
        .wrapper
            .row 
                nav.col-2
                    a.blue(href="/")
                        i.fas.fa-dove 
                    a(href="/")
                        i.fas.fa-home 
                    a(href="/search")
                        i.fas.fa-search 
                    a(href="/notifications")
                        i.fas.fa-bell 
                    a(href="/messages")
                        i.fas.fa-envelope 
                    a(href="/profile")
                        i.fas.fa-user 
                    a(href="/logout")
                        i.fas.fa-sign-out-alt 

                .mainSectionContainer.col-10.col-md-8.col-lg-6
                    .titleContainer 
                        h1 #{pageTitle}
                    block content 

                .d-none.d-md-block.col-md-2.col-lg-4





        
        script(src='https://kit.fontawesome.com/49111f24b5.js' crossorigin='anonymous')
        script(src='https://code.jquery.com/jquery-3.6.0.min.js', integrity='sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=', crossorigin='anonymous')
        script(src='https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js', integrity='sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo', crossorigin='anonymous')
        script(src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js', integrity='sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6', crossorigin='anonymous')


        script(src="/js/common.js")

common.js

// $(document).ready(()=>{//from main-layout.png!!!
//     //alert("hola"); //파일에 js 연결 잘 됐는지 확인
// })


//버튼 활성화 시키기
$("#postTextarea").keyup(event =>{//여기서 파라미터가 1개면 () 필요없이 그냥 사용가능
    var textbox = $(event.target);
    var value=textbox.val().trim();
    //console.log(value);

    var submitButton = $("#submitPostButton");//# 중요해

    //==랑 ===차이점 @@@
    if(submitButton.lengh == 0) return alert("No submit button found");

    if (value==""){
        submitButton.prop("disabled", true);
        return;
    }
    submitButton.prop("disabled", false);


})

//작성한 글 저장
$("#submitPostButton").click(()=>{
    var button = $(event.target);
    var textbox = $("#postTextarea");

    var data={
        //object
        content:textbox.val()
    }

    //ajax만들기(request, which will send the data to the server without us having to reload the page)
    $.post("/api/post", data, (postData, status, xhr) => { //()=>{} : callback 함수
    // 여기에서 data를 "/api/post"로 요청 req 하고 끝나면  ()=>{} 함수로 돌아오겠다, callback 해라는 이야기 
    

    })

})