hanker

Kendo - kendo TextBox (4) (JQuery - enable) 입력 안내 본문

JavaScript/Kendo

Kendo - kendo TextBox (4) (JQuery - enable) 입력 안내

hanker 2024. 9. 19. 21:06
반응형

이전 글에 이어 오늘은 enable 에 대해서 작성하려고 한다.

 

이 옵션은 textbox 뿐 아니라 거의 모든 kendo UI 들이 다 쓰고있다.

사용법도 마찬가지로 같으니 응용해서 사용해도 무관하다.

 

 

적용된 화면을 보면

입력할수 없게 비활성화 되있는걸 확인할 수 있다.

 

 

코드를 보자.

<html>
<head>
    <title>Title</title>
</head>

<body>
    <h2>Hello, Hanker~!</h2>

    <input type="password" name="name" id="textbox" class="textbox" style="width: 300px;" value=""/>
    <input type="text" name="name" id="textboxB" class="textbox" style="width: 300px;" value=""/>

</body>

<script>
    $(".textbox").kendoTextBox({
        enable: false
    });
</script>
</html>

 

역시 간단하게 설정이 가능하다.

 

다른 방법으로 disabled 처리가 가능한데, 전체적으로 kendo를 입혀 놓고 특정 textbox만 disabled 처리하는 방법이다.

 

 

<html>
<head>
    <title>Title</title>
</head>

<body>
    <h2>Hello, Hanker~!</h2>

    <input type="password" name="name" id="textbox" class="textbox" style="width: 300px;" value=""/>
    <input type="text" name="name" id="textboxB" class="textbox" style="width: 300px;" value=""/>

</body>

<script>
    $(".textbox").kendoTextBox();

    $("#textboxB").data("kendoTextBox").enable(false);
</script>
</html>

이런식으로도 처리가 가능하다.

 

결과.

 

 

끝.

 

 

https://docs.telerik.com/kendo-ui/api/javascript/ui/textbox/methods/enable

 

enable - API Reference - Kendo UI TextBox - Kendo UI for jQuery

 

docs.telerik.com

 

반응형
저작자표시

'JavaScript > Kendo' 카테고리의 다른 글

Kendo - KendoGrid (Jquery) 그리드(테이블) CSS 수정 UI (2)  (0) 2024.09.22
Kendo - KendoGrid (Jquery) 그리드(테이블) 생성 UI (1)  (1) 2024.09.21
Kendo - kendo TextBox (3) (JQuery - placeholder) 입력 안내  (0) 2024.09.18
Kendo - kendo TextBox (2) (JQuery - clear button) 내용 삭제  (0) 2024.09.18
Kendo - Kendo TextBox (1) (JQuery)  (1) 2024.09.16
'JavaScript/Kendo' Related Articles more