IT/development

[JavaScript] validation

์•Œ ์ˆ˜ ์—†๋Š” ์‚ฌ์šฉ์ž 2023. 6. 25.
<!-- Script -->
    <script layout:fragment="script" th:inline="javascript" type="text/javascript">
        //์•„์ด๋”” ์ค‘๋ณต์ฒดํฌ ์—ฌ๋ถ€
        let idCheckYn = false;

        $(document).ready(function () {

            //ํšŒ์›๊ฐ€์ž… ์ฒ˜๋ฆฌ
            $("#regUserBtn").on("click", function () {

                if (validation()) {
                    const params = {
                        userId: $("#userId").val(),
                        userPassword: $("#userPassword").val(),
                        userName: $("#userName").val(),
                        userEmail: $("#userEmail").val()
                    };

                    $.ajax({
                        type : "post",
                        url : "/user/api/reg",
                        dataType: "json",
                        data : JSON.stringify(params),
                        contentType: 'application/json; charset=utf-8',
                        success: function (data){
                            console.log(data);
                            if(data.code === "1") {
                                alert("ํšŒ์›๊ฐ€์ž…์— ์„ฑ๊ณตํ–ˆ์Šต๋‹ˆ๋‹ค.");
                                location.href = "/user/login";
                            } else {
                                alert("ํšŒ์›๊ฐ€์ž…์— ์‹คํŒจํ–ˆ์Šต๋‹ˆ๋‹ค.");
                                $("#registerFrm")[0].reset();
                                return false;
                            }
                        },
                        error:function(e){
                            console.log(e);
                            alert("ํšŒ์›๊ฐ€์ž…์— ์‹คํŒจํ–ˆ์Šต๋‹ˆ๋‹ค.");
                            return false;
                        }
                    });
                }

            });

            //์•„์ด๋”” ์ค‘๋ณต์ฒดํฌ
            $("#idCheck").on("click", function () {

                if ($("#userId").val() === "" || $("#userId").val() === undefined || $("#userId").val() === " ") {
                    alert("์•„์ด๋””๋Š” ํ•„์ˆ˜๊ฐ’์ž…๋‹ˆ๋‹ค.");
                    $("#userId").focus();
                    return false;
                }

                $.ajax({
                    type : "post",
                    url : "/user/api/checkDuplicateId/" + $("#userId").val(),
                    success: function (data){
                        console.log(data);
                        if(data.code === "3") {
                            alert("์ค‘๋ณต๋˜๋Š” ์•„์ด๋””์ž…๋‹ˆ๋‹ค.");
                            $("#userId").val("").focus();
                            return false;
                        } else {
                            alert("๊ฐ€์ž… ๊ฐ€๋Šฅํ•œ ์•„์ด๋””์ž…๋‹ˆ๋‹ค.");
                            $("#userName").focus();
                            idCheckYn = true;
                        }
                    },
                    error:function(e){
                        console.log(e);
                        alert("์‹œ์Šคํ…œ ์—๋Ÿฌ์ž…๋‹ˆ๋‹ค.");
                        return false;
                    }
                });
            });


        });

        //์œ ํšจ์„ฑ ๊ฒ€์ฆ
        function validation() {
            //์œ ํšจ์„ฑ ๊ฒ€์ฆ ํ†ต๊ณผ์—ฌ๋ถ€
            let validationPassYn  = false;

            if ($("#userId").val() === "" || $("#userId").val() === undefined || $("#userId").val() === " ") {
                alert("์•„์ด๋””๋ฅผ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”.");
                $("#userId").focus();
                return false;
            }
            //์•„์ด๋”” ์ฒดํฌ ์™„๋ฃŒ
            if (!idCheckYn) {
                alert("์•„์ด๋”” ์ค‘๋ณต์ฒดํฌ๋ฅผ ํ•ด์ฃผ์„ธ์š”.");
                return false;
            }
            if ($("#userName").val() === "" || $("#userName").val() === undefined || $("#userName").val() === " ") {
                alert("์ด๋ฆ„์„ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”.");
                $("#userName").focus();
                return false;
            }
            if ($("#userEmail").val() === "" || $("#userEmail").val() === undefined || $("#userEmail").val() === " ") {
                alert("์ด๋ฉ”์ผ์„ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”.");
                $("#userEmail").focus();
                return false;
            }
            if ($("#userPassword").val() === "" || $("#userPassword").val() === undefined || $("#userPassword").val() === " ") {
                alert("๋น„๋ฐ€๋ฒˆํ˜ธ๋ฅผ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”.");
                $("#userPassword").focus();
                return false;
            }
            if ($("#userPasswordConfirm").val() === "" || $("#userPasswordConfirm").val() === undefined || $("#userPasswordConfirm").val() === " ") {
                alert("๋น„๋ฐ€๋ฒˆํ˜ธ ํ™•์ธ์„ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”.");
                $("#userPasswordConfirm").focus();
                return false;
            }
            //๋น„๋ฐ€๋ฒˆํ˜ธ ์ผ์น˜์—ฌ๋ถ€
            let passwordPassYn = false;
            passwordPassYn = ($("#userPassword").val() === $("#userPasswordConfirm").val()) ? true : false;

            if (!passwordPassYn) {
                alert("๋น„๋ฐ€๋ฒˆํ˜ธ๊ฐ€ ์ผ์น˜ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.");
                $("#userPassword").val("").focus();
                return false;
            }

            return validationPassYn = true;
        }


    </script>

๋Œ“๊ธ€