TextBox 숫자만 입력

Ad


ASP.NET 의 TextBox 에 날짜를 입력받기 위해 Client Script를 붙혀봤습니다.

숫자만 입력을 받을때 응용해서 사용할 수 있겠군요.

keydown, fouce, blur 이벤트에서 사용할 function입니다.

<script type="text/javascript">

function checkInputDate(ctr) {
    var e = window.event;
    var txt = document.getElementById(ctr.id);

    if (e.keyCode == 8 || e.keyCode == 9 || e.keyCode == 46) {
        return true;
    }
    else if ( (e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 96 && e.keyCode <= 105) ) {
        if (txt.value.length >= 8) {
            e.returnValue = false;
            return false;
        }

        return true;
    }
    else {
        e.returnValue = false;
        return false;
    }
}

function setDateFormat(ctr) {
    var txt = document.getElementById(ctr.id);
    var val = txt.value;

    if (val.length == 8) {
        txt.value = val.substr(0, 4) + "-" + val.substr(4, 2) + "-" + val.substr(6, 2);
    }
}

function resetDateFormat(ctr) {
    var txt = document.getElementById(ctr.id);
    var val = txt.value;

    if (val.length == 10) {
        txt.value = val.replace(/-/gi, "");
        txt.select();
    }
}

function setRegNo(obj) {
    // 주민등록번호 Format
    var val = obj.value;
    if (val.length == 13) {
        obj.value = String.format("{0}-{1}", val.substr(0, 6), val.substr(6));
    }
}

function resetRegNo(obj) {
    // 주민등록번호 Unformat
    var val = obj.value;
    obj.value = val.replace(/-/gi, "");
    obj.select();
}

function checkInputNumber(ctr, canSPchar, maxlen) {
    // ctr 컨트롤
    // canSPchar 특수문자 허용
    // length 최대길이

    var e = window.event;
    var txt = document.getElementById(ctr.id);

    if (e.keyCode == 8 || e.keyCode == 9 || e.keyCode == 46 || e.keyCode == 13) {
        // 허용키 BackSpace, Tab, Delete Key, Insert, Enter
        return true;
    }
    else if (canSPchar && (e.keyCode == 189 || e.keyCode == 190 || e.keyCode == 110 || e.keyCode == 109) ) {
        //  .-
        if (txt.value.length == 0) {
            // 첫자리에 올수 없다
            e.returnValue = false;
            return false;
        }
        return true;
    }
    else if ( (e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 96 && e.keyCode <= 105) ) {
        // 숫자 허용
        if (maxlen != 0 && txt.value.length >= maxlen) {
            // 길이체크
            e.returnValue = false;
            return false;
        }
        return true;
    }
    else {
        e.returnValue = false;
        return false;
    }
}

</script>

<asp:TextBox ID="txt일자" runat="server" Width="80px" TabIndex="4" Style="text-align: center; ime-mode: disabled;" onkeydown="checkInputDate(this);" onkeypress="checkInputDate(this);" onblur="setDateFormat(this);" onfocus="resetDateFormat(this);" />

jQuery를 사용

$(document).ready(
        function(){
            $("#btnSearch").click(
                function(){
                    if($("#txtFr").val() == ""){
                        alert("조회 시작일자를 입력하세요.");
                        $("#txtFr").focus();
                        return false;
                    }
                    else if($("#txtTo").val() == ""){
                        alert("조회 종료일자를 입력하세요.");
                        $("#txtTo").focus();
                        return false;
                    }
                    else{
                        var form = $("#MyForm");
                        form.submit();
                    }
                });

            $("#txtFr,#txtTo").keydown(
                function(e){
                    if (e.keyCode == 8 || e.keyCode == 9 || e.keyCode == 46) {
                        return true;
                    }
                    else if ( (e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 96 && e.keyCode <= 105) ) {
                        if ($(this).val().length >= 10) {
                            e.returnValue = false;
                            return false;
                        }

                        return true;
                    }
                    else {
                        e.returnValue = false;
                        return false;
                    }
                });

            $("#txtFr,#txtTo").focus(
                function(){
                    var val = $(this).val();
                    $(this).val(val.replace(/-/gi, ""));
                });

            $("#txtFr,#txtTo").focusout(
                function(){
                    var val = $(this).val();
                    if (val.length == 8) {
                        $(this).val(val.substr(0, 4) + "-" + val.substr(4, 2) + "-" + val.substr(6, 2));
                    }
                });
        });