[textarea] 텍스트박스 크기조절 및 html 옵션을 편하게... > 그누4 팁자료실

그누4 팁자료실

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요.
나누면 즐거움이 커집니다.

[textarea] 텍스트박스 크기조절 및 html 옵션을 편하게... 정보

[textarea] 텍스트박스 크기조절 및 html 옵션을 편하게...

본문

텍스트박스를 사용시에 대부분 글쓰기 타입을 지정해서 사용을 합니다.
예) text  html  text+html(자동줄바꿈)
이런 형식으로 해서 밑에 텍스를 박스를 넣습니다.
그리고 좀더 편리하게 하려면 라벨을 넣습니다.
또한 텍스트박스의 rows 를 조정해주는 부분도 넣습니다.
->이게 일일이 하기가 상당히 귀찮아서 몇 자 적어봤습니다.
(아래에서 자바스크립트 펑션은 기존 그누보드에도 있으니 그걸 활용해도 됩니다.)
첨부된 그림은 적용했을때 출력되는 textarea 입니다.

1. 자바스크립트 펑션 추가
// 텍스트박스 크기조절
// 인수 값 : 텍스트박스 ID, rows 값, 기본 rows 값
function mtext(id, row, de_row){
if(document.getElementById(id).rows > de_row){
document.getElementById(id).rows -= row;
}
}
function ptext(id, row){
document.getElementById(id).rows += row;
}

2. php 펑션추가
// 텍스트 입력박스 글쓰기 타입 및 크기조절 리턴(사용하는 곳이 많으므로 일괄처리)
// 인수 값 : textarea id, 크기조절 단위, 기본 크기(rows), 라디오박스 name, 라디오박스 체크확인 값
function textarea_add($ta_id, $size, $de_row, $ra_name, $ra_value=''){

// 라디오박스 id 및 label 은 자동생성
$radio_id1 = substr(uniqid(time()), 0, 20);
$radio_id2 = substr(uniqid(time()), 0, 20);
$radio_id3 = substr(uniqid(time()), 0, 20);
$checked1 = $checked2 = '';
if($ra_value && $ra_value == 1){
$checked1 = 'checked';
}else if($ra_value && $ra_value == 2){
$checked2 = 'checked';
}
return <<<POST
<table width="100%" cellpadding=0 cellspacing=0>
<tr>
<td height=25>
<input type="radio" name="{$ra_name}" value=0 id="{$radio_id1}" checked><label for="{$radio_id1}">TEXT</label>&nbsp;
<input type="radio" name="{$ra_name}" value=1 id="{$radio_id2}" {$checked1}><label for="{$radio_id2}">HTML</label>&nbsp;
<input type="radio" name="{$ra_name}" value=2 id="{$radio_id3}" {$checked2}><label for="{$radio_id3}">TEXT+HTML(자동 줄바꿈)</label>
</td>
<td width="10%" align="center">
<a href="javascript:;" onclick="ptext('{$ta_id}', {$size});"><b>▼</b></a>&nbsp;<a href="javascript:;" onclick="mtext('{$ta_id}', {$size}, {$de_row});"><b>▲</b></a>
</td>
</tr>
</table>
POST;
}

// 사용시
// 인수 값 : textarea id, 크기조절 단위, 기본 크기(rows), 라디오박스 name, 라디오박스 체크확인 값
<?=textarea_add('put_content', 6, 6, 'put_html')?>
<textarea name="put_content" id="put_content" rows=6 style="width:98%;"></textarea>
추천
0

댓글 4개

펑션사용이므로 딱히 수정할 파일이 있는건 아닙니다.
우선
1. 자바스크립트 펑션은 js/common.js 의 하단쪽에 붙여넣고,
2. php 펑션은 lib/common.lib.php 의 하단쪽에 붙여 넣습니다.
그런다음 사용하고자 하는 곳에서 위 예시대로 펑션을 호출하여 사용하면 됩니다.
디자인적인 스타일은 적절히 수정하시면 됩니다.

# 요즘은 대부분이 위지웍 에디터를 사용하기 때문에 잘 사용하지 않죠..;;
전체 3,313 |RSS
그누4 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT