2015. 3. 24. 16:16ㆍIT/HTML
PHP input 설정
Input text
<th>투자지역</th>
<td colspan="3">
<?
// 인자값 설명 ("input name", "input value", "필수 : req, 필수아님 : '' ", "input claass 명");
echo get_input("투자지역", "wr_4", $write[wr_4])
?>
</td>
Input radio
<?
// 인자값 설명 ("항목명", "인풋네임", "array value", "인풋값", "radio사이에 구분값", "input class 명");
$arr_radio = array("동업","지분","전환사체","우선상환","일반대출","별도협의");
echo get_radio("투자지역", "wr_5", $arr_radio, $write[wr_5]);
?>
Input checkbox
<?
// 인자값 설명 ("항목명", "인풋네임", "array value", "인풋값", "checkbox 사이에 구분값", "input class 명");
$arr_checkbox = array("10,000","20,000","30,000","40,000","50,000","60,000");
echo get_checkbox("투자요금", "wr_6", $arr_checkbox, $write[wr_6]);
?>
<td>
<?
// 인자값 설명 ("input name", "input value", "필수 : req, 필수아님 : '' ", "select claass 명", "input class 명");
echo get_hp("wr_1", $write[wr_1]);
?>
</td>
Input 일반전화
<th>전화번호</th>
<td>
<?
// 인자값 설명 ("input name", "input value", "필수 : req, 필수아님 : '' ", "select claass 명", "input class 명");
echo get_tel("wr_2", $write[wr_2]);
?>
</td>
Input 이메일
<th>이메일</th>
<td colspan="3">
<?
// 인자값 설명 ("input name", "input value", "필수 : req, 필수아님 : ''", "select claass 명", "input class 명");
echo get_email("wr_email", $write[wr_email]);
?>
<input type="text" class='inputbox email' maxlength=100 name="wr_email" title="이메일" value="<?=$email?>">
</td>
Input 주소
<th>주소</th>
<td colspan="3">
<?
// 인자값 설명 ("input name", "input value", "필수 : req, 필수아님 : ''", "input class 명");
add_javascript(G5_POSTCODE_JS, 0); //다음 주소 js
echo get_addr("wr_3", $write[wr_3]);
?>
</td>
자주쓰는 색상표
인풋 박스
텍스트버튼
<input type="text" name="wr_1" value="<?=$write[wr_1]?>" style="width:110px;" class="inputbox" required itemname="성함">
라디오버튼
<input type="radio" name="wr_23" value="군필"> 군필
<input type="radio" name="wr_23" value="미필"> 미필
<input type="radio" name="wr_23" value="해당사항없음"> 해당사항없음
<script>$('input:radio[name=wr_23]:input[value="<?=$write[wr_23]?>"]').attr("checked", true);</script>
체크박스
<label><input type="checkbox" name="ca_id3[]" value="템플릿" > 템플릿</label>
<label><input type="checkbox" name="ca_id3[]" value="편집이미지"> 편집이미지</label>
<label><input type="checkbox" name="ca_id3[]" value="무료이미지"> 무료이미지</label>
<?
if(is_array($_GET[ca_id2])){
$str_ca_id2 = implode(",",$_GET[ca_id2]);
}
?>
<script>
var str_ca_id3 = "<?=$str_ca_id3?>";
$("input:checkbox[name='ca_id3[]']").each(function(index){
if(str_ca_id3.indexOf($(this).val()) > -1){
$(this).attr("checked", true);
}
});
</script>
</ul>
셀렉트박스
<select name="wr_2" id="wr_2">
<option value="">[선택]</option>
<?for($j = 2014; $j < (date("Y")+3); $j++){?>
<option value="<?=$j?>"><?=$j?></option>
<?}?>
</select>
<script>$("#wr_2").val("<?=$write[wr_2]?>")</script>
체크박스 및 라디오 폼 유효성 검사
테이블 박스1
<style>
table.tb_order {width:100%; border-collapse:collapse; padding:0; margin:0;}
table.tb_order th, table.tb_order td {padding:10px; border:1px solid #d7d7d7; text-align:left;}
table.tb_order th {
padding: 10px 0 10px 20px;
width: 15%;
text-align: left;
border-bottom: 1px solid #d9d9d9;
background: #f7f7f7;
}
.must {
margin: 0 3px 0 0;
color: #e60013;
}
table tr.tb_bg_1 td {background:#f8f8f8;}
table tr.tb_bg_2 td {background:#f7fdff;}
table.tb_order tr td p {text-align:left;}
input.go_abtn {width:100px; text-align:center; margin:20px auto 0 auto; display:block; background:#555; color:#fff; padding:10px 20px; font-size:15px; font-family:Malgun Gothic; font-weight:bold;}
.inputbox {height:12px; padding:5px; margin-top:3px; margin-bottom:3px; border:1px solid #ccc;line-height:12px;width:120px;}
</style>
<p style="margin-top:20px;"><strong title="필수입력" class="must">*</strong>표시는 필수 입력내용입니다.</p>
<table class="tb_order">
<colgroup>
<col width="162px">
<col>
</colgroup>
<tr>
<th><strong title="필수입력" class="must">*</strong>고객명</th>
<td><input class="inputbox" type="text" name="wr_name" required itemname="고객명"></td>
</tr>
<tr>
<th><strong title="필수입력" class="must">*</strong>휴대폰</th>
<td>
<input type="hidden" name="wr_6" id="wr_6">
<input type="text" class="inputbox" name="wr_6_1" id="wr_6_1" maxlength="4" style="width:40px;" required itemname="고객명"> -
<input type="text" class="inputbox" name="wr_6_2" id="wr_6_2" maxlength="4" style="width:40px;" required itemname="고객명"> -
<input type="text" class="inputbox" name="wr_6_3" id="wr_6_3" maxlength="4" style="width:40px;" required itemname="고객명">
</td>
<tr>
<th>일반전화</th>
<td>
<input type="hidden" name="wr_9" id="wr_9">
<input type="text" class="inputbox" name="wr_9_1" id="wr_9_1" maxlength="4" style="width:40px;"> -
<input type="text" class="inputbox" name="wr_9_2" id="wr_9_2" maxlength="4" style="width:40px;"> -
<input type="text" class="inputbox" name="wr_9_3" id="wr_9_3" maxlength="4" style="width:40px;">
</td>
</tr>
<tr>
<th>이메일</th>
<td><input class="inputbox" type="text" name="wr_email" style="width:250px;"></td>
</tr>
<tr>
<th><strong title="필수입력" class="must">*</strong>고객명주소</th>
<td>
<input class="inputbox" style="width:30px;" required itemname="주소" type=text name='wr_1' id='wr_1' size=4 maxlength=3 readonly itemname='우편번호 앞자리' value='<?=$write[wr_1]?>'>
-
<input class="inputbox" required itemname="주소" style="width:30px;" type=text name='wr_2' id='wr_2' size=4 maxlength=3 readonly itemname='우편번호 뒷자리' value='<?=$write[wr_2]?>'>
<a href="#null" onclick="window.open('<?=$g4[path]?>/bbs/zip.php?frm_name=fwrite&frm_zip1=wr_1&frm_zip2=wr_2&frm_addr1=wr_3&frm_addr2=wr_4&frm_jibeon=wr_5','pop_juso','width=620,height=800,scrollbars=yes')" id="reg_zip_find"><img width="91" height="20" src="/skin/member/no-member-admin/img/post_search_btn.gif" border=0 align=absmiddle></a>
<input type="hidden" name="wr_5" value="<?=$write[wr_5]?>" />
<div style="padding:3px 0;">
<input class="inputbox" style="width:300px;" required itemname="주소" type=text name='wr_3' id='wr_3' size=60 readonly itemname='주소' value='<?=$write[wr_3]?>'>
</div>
<div style="padding:3px 0;">
<input class="inputbox w300" style="width:300px;" required itemname="주소" type=text name='wr_4' id='wr_4' size=60 itemname='상세주소' value='<?=$write[wr_4]?>'> "번지"이하 아파트명
</div><span id="wr_5"></span>
</td>
</tr>
<tr>
<th>컴퓨터수리</th>
<td><input type="radio" name="wr_7" value="컴퓨터수리" <?if($write[wr_7]=="컴퓨터수리"){?> checked <?}?>> 컴퓨터수리
<input type="radio" name="wr_7" value="데이터복구" <?if($write[wr_7]=="데이터복구"){?> checked <?}?>> 데이터복구
<input type="radio" name="wr_7" value="노트북수리" <?if($write[wr_7]=="노트북수리"){?> checked <?}?>> 노트북수리
<input type="radio" name="wr_7" value="모니터수리" <?if($write[wr_7]=="모니터수리"){?> checked <?}?>> 모니터수리
<input type="radio" name="wr_7" value="네트워크" <?if($write[wr_7]=="네트워크"){?> checked <?}?>> 네트워크
<input type="radio" name="wr_7" value="유지보수" <?if($write[wr_7]=="유지보수"){?> checked <?}?>> 유지보수</td>
</tr>
<tr>
<th>신청내용(고장증상)</th>
<td><textarea name="wr_content" style="width:100%; height:150px;"></textarea></td>
</tr>
</table>
<input type="submit" class="go_abtn" value="신청하기">
테이블 박스2
<!-- table -->
<style>
/*s_table*/
.s_chart_01 {width:100%; margin:0; padding:0; border-collapse:collapse; border:1px solid #edf1f1; border-top:2px solid #739490; line-height:120%;}
.s_chart_01 th {padding:6px 10px; font-size:12px; color:#60807e; border:1px solid #e3eded; text-align:center; background:#f9fafa;}
.s_chart_01 td {padding:6px 10px; font-size:12px; color:#808080; border:1px solid #e3eded; background:#fff;}
.s_chart_01 td.cc1 {text-align:center; padding:6px 0;}
.s_chart_01 td.cc2 {text-align:center; font-size:12px; font-weight:bold; color:#60807e;}
.s_chart_01 th.bottom0 { border-bottom:0px; }
</style>
<table class="s_chart_01">
<colgroup>
<col width=""></col>
<col width=""></col>
<col width=""></col>
<col width=""></col>
</colgroup>
<tr>
<th>구분</th>
<th>2013 수능성적</th>
<th>2014 수능성적</th>
<th>성적향상점수</th>
</tr>
<tr>
<td style="text-align:center;">인문</td>
<td style="text-align:center;">208.8</td>
<td style="text-align:center;">250.0</td>
<td style="text-align:center;">41.5</td>
</tr>
<tr>
<td style="text-align:center;">자연</td>
<td style="text-align:center;">212.4</td>
<td style="text-align:center;">254.5</td>
<td style="text-align:center;">42.1</td>
</tr>
</table>
<!-- /table -->
// input
<style>
.guest_table{border-collapse:collapse;padding:0; border-spacing:0px; border-spacing:0;table-layout:fixed; width:100%; background:#FFF;border:1px solid #DDD; margin-top:10px;}
.guest_table th{text-align:left; padding-left:20px; font:normal 9pt/30px gulim; border-bottom:1px solid #DDD;}
.guest_table td{text-align:left; border-bottom:1px solid #DDD; padding:4px 15px 4px 4px;}
.inputbox{height:12px; padding:4px; border:1px solid #aaa; border-right:1px solid #EEE; width:100%; border-bottom:1px solid #EEE;line-height:12px;}
.selectbox{height:22px; padding:2px; border:1px solid #aaa; border-right:1px solid #EEE; border-bottom:1px solid #EEE}
<table class="guest_table">
<colgroup>
<col width="120px" />
<col width="160px" />
<col width="120px" />
<col />
</colgroup>
<tr>
<th>학생이름</th>
<td><input class='inputbox' maxlength=20 name=wr_subject id="wr_subject" itemname="이름" required value="<?=$write[wr_subject]?>"></td>
<th>패스워드</th>
<td><input class='inputbox' name=wr_1 id="wr_1" itemname="패스워드" required value="<?=$write[wr_1]?>" style="width:80px;" maxlength="4"> ※4자리 입력</td>
</tr>
<tr ><?// 잘안쓴다는 의견땜에 주석처리함, 이메일 필요시 display block으로...?>
<th>날짜</th>
<td colspan="3">
<select name="wr_2" id="wr_2">
<option value="">[선택]</option>
<?for($j = 2014; $j < (date("Y")+3); $j++){?>
<option value="<?=$j?>"><?=$j?></option>
<?}?>
</select>
<script>$("#wr_2").val("<?=$write[wr_2]?>")</script>
</td>
</tr>
</table>
'IT > HTML' 카테고리의 다른 글
동영상 Yutube 제목 및 상태바 노출 여부, showinfo, controls (0) | 2015.03.24 |
---|---|
새창 팝업창 소스 (0) | 2015.03.24 |
C#으로 짠 정렬 알고리즘 (선택,삽입,버블,퀵) (sort) (0) | 2015.03.24 |