|
|
|
15-12-13
|
조회 2,528
|
|
|
|
15-12-13
|
조회 2,943
|
|
|
|
15-12-11
|
조회 2,605
|
|
|
|
15-12-11
|
조회 2,565
|
|
|
|
15-12-11
|
조회 2,569
|
|
|
|
15-12-10
|
조회 2,527
|
|
|
|
15-12-10
|
조회 2,586
|
|
|
|
15-12-10
|
조회 2,559
|
|
|
|
15-12-03
|
조회 3,203
|
|
|
|
15-12-03
|
조회 2,718
|
|
|
|
15-11-25
|
조회 2,799
|
|
|
|
15-11-09
|
조회 3,209
|
|
|
|
15-11-04
|
조회 2,971
|
|
|
|
15-06-09
|
조회 4,094
|
|
|
|
15-05-06
|
조회 5,092
|
|
|
|
15-03-28
|
조회 4,576
|
|
|
|
14-12-05
|
조회 4,999
|
|
|
|
14-10-25
|
조회 5,096
|
|
|
|
14-10-13
|
조회 4,272
|
|
|
|
14-10-03
|
조회 6,262
|
|
|
|
14-09-19
|
조회 4,963
|
|
|
|
14-09-18
|
조회 4,050
|
|
|
|
14-09-13
|
조회 4,615
|
|
|
|
14-09-03
|
조회 5,602
|
|
|
|
14-08-26
|
조회 4,208
|
|
|
|
14-08-26
|
조회 4,013
|
|
|
|
14-08-26
|
조회 3,977
|
|
|
|
14-08-11
|
조회 6,506
|
|
|
|
14-08-06
|
조회 4,126
|
|
|
|
14-08-06
|
조회 3,724
|
|
|
|
14-08-06
|
조회 3,936
|
|
|
|
14-08-01
|
조회 6,306
|
|
|
|
14-08-01
|
조회 3,843
|
|
|
|
14-07-30
|
조회 4,442
|
|
|
|
14-06-28
|
조회 5,165
|
|
|
|
14-06-28
|
조회 4,437
|
|
|
|
14-05-11
|
조회 4,591
|
|
|
|
14-05-09
|
조회 4,950
|
|
|
|
14-05-09
|
조회 7,713
|
|
|
|
14-04-30
|
조회 4,333
|
|
|
|
14-04-27
|
조회 4,195
|
|
|
|
14-04-25
|
조회 4,897
|
|
|
|
14-04-21
|
조회 3,876
|
|
|
|
14-04-21
|
조회 5,005
|
|
|
|
14-04-10
|
조회 4,603
|
|
|
|
14-04-01
|
조회 6,158
|
|
|
|
14-03-03
|
조회 3,533
|
|
|
 예뜨락
|
14-02-25
|
조회 5,921
|
|
|
예뜨락
|
14-02-14
|
조회 5,195
|
|
|
예뜨락
|
14-02-13
|
조회 4,953
|
|
|
|
14-01-03
|
조회 4,445
|
|
|
예뜨락
|
13-12-06
|
조회 3,767
|
|
|
예뜨락
|
13-11-22
|
조회 5,522
|
|
|
|
13-11-18
|
조회 4,028
|
|
|
|
13-10-02
|
조회 4,447
|
|
|
|
13-10-02
|
조회 3,696
|
|
|
|
13-10-02
|
조회 3,962
|
|
|
|
13-10-02
|
조회 3,817
|
|
|
|
13-10-02
|
조회 4,183
|
|
|
|
13-09-16
|
조회 8,032
|
|
|
|
13-09-16
|
조회 5,397
|
|
|
|
13-08-18
|
조회 5,427
|
|
|
|
13-07-11
|
조회 4,111
|
|
|
|
13-07-10
|
조회 4,694
|
|
|
|
13-07-09
|
조회 4,732
|
|
|
|
13-07-09
|
조회 4,988
|
|
|
|
13-07-04
|
조회 4,487
|
|
|
|
13-07-04
|
조회 4,125
|
|
|
|
13-07-04
|
조회 4,238
|
|
|
|
13-07-01
|
조회 4,726
|
|
|
|
13-07-01
|
조회 4,558
|
|
|
|
13-07-01
|
조회 6,832
|
|
|
|
13-06-23
|
조회 4,380
|
|
|
|
13-06-05
|
조회 3,627
|
|
|
|
13-05-29
|
조회 4,868
|
|
|
|
13-05-10
|
조회 4,276
|
|
|
|
13-04-05
|
조회 4,896
|
|
|
|
13-04-05
|
조회 6,585
|
|
|
|
13-04-05
|
조회 1.1만
|
|
|
|
13-04-05
|
조회 7,179
|
|
|
|
13-04-05
|
조회 6,566
|
|
|
|
13-03-31
|
조회 5,836
|
|
|
|
13-03-31
|
조회 4,165
|
|
|
|
13-03-28
|
조회 4,523
|
|
|
|
13-03-28
|
조회 6,721
|
|
|
|
13-03-28
|
조회 9,203
|
|
|
|
13-03-28
|
조회 4,336
|
|
|
|
13-03-24
|
조회 3,952
|
|
|
|
13-03-21
|
조회 4,628
|
|
|
|
13-03-21
|
조회 1.8만
|
|
|
|
13-03-14
|
조회 3,937
|
|
|
|
13-03-10
|
조회 4,746
|
|
|
|
13-03-10
|
조회 4,506
|
|
|
|
13-03-10
|
조회 4,206
|
|
|
|
13-03-08
|
조회 5,262
|
|
|
|
13-03-08
|
조회 4,369
|
|
|
|
13-03-03
|
조회 5,025
|
|
|
|
13-03-03
|
조회 7,478
|
|
|
|
13-03-03
|
조회 4,219
|
|
|
|
13-03-03
|
조회 1.1만
|
댓글 16개
모든 radio 를 체크하도록 요구하지 않는 것은 name 값을 동일하게 부여하지 않으셨기 때문입니다.
required 는 크롬 예약어가 아닌 HTML 표준입니다.
<form onsubmit="return check_form(this)">
<label><input type="radio" name="mb_11" value="3" required>1</label>
<label><input type="radio" name="mb_11" value="3" required>2</label>
<label><input type="radio" name="mb_11" value="3" required>3</label>
<input type="submit" value="전송">
</form>
<script src="wrest.js">
wrest.js
var forms = document.getEelemntsByTagName("form");
for(var in in forms)
{
forms[i].onsubmit = ....
}
일반적으로 required 를 attr 로 넣어 주면 자동으로 필수 입력값을 체크해주기를 원했으나
checkbox 나 radio 에 attr를 required 를 주었을 경우에는
onsubmit이 실행되기 전에 브라우저에서 먼저 required 를 체크해서
모든 radio 가 체크 되기를 강제 당하기 때문에,
무조건 폼이 전송되지 못한다는 겁니다.
결국
var check_form = function(f)
{
// radio에 값이 입력됫는지 체크
// checkbox에 값이 입력됬는지 체크
return true;
}
로직을 다시 재성생 해야 줘야 된다는게 요지 입니다.
<label> <input type="radio" name="wr_11" value="male" required>남성</label>
<br>
취미 <label> <input type="checkbox" name="wr_12[]" value="1" required>농구</label>
<label> <input type="checkbox" name="wr_12[]" value="2" required>축구</label>
이경우 성별은 남성과 여성중에 하나를 선택해야 하고
취미는 자신이 하는 것들만 선택해야 하는데,
required 가 들어갈 경우 그리고 브라우저가 크롬인 경우
radio box 임에도 불구하고 남성과 여성 모두 선택하라는 메시지가 뜨고
checbox 는 모든 필드가 체크되어야 한다는 메시지가 뜹니다.
그리고 checkbox 에 name 을 wr_12[] 로 주시면 배열로 값이 넘어갑니다.
<ul>
<li>
성별 : <label><input type="radio" name="sex[member]" value="1" required>여성</label> <label><input type="radio" name="sex[member]" value="2" required>남성</label>
</li>
<li>
취미 : <label><input type="checkbox" name="sex2[]" value="1" required>여성</label> <label><input type="checkbox" name="sex2[]" value="2" required>남성</label>
</li>
</ul>
<input type="submit" value="submit">
</form>
크롬에서 해보니
radio 박스는 제대로 되는군요
익스 8. 사파리에서는 문제가 되지 않는데,
크롬에서만 checkbox 에서 문제가 생깁니다.
//추가적으로
name ="wr_12[]" 로 한것은 말씀하신대로 배열로 받기위해서 입니다.
그러나
name ="wr_12[]" 했다해서 값이 반드시 배열로 넘어가지 않습니다.
2개 이상 체크했을때만 배열로 넘어갑니다.
http://gangsaland.com/bbs/write.php?bo_table=job
wrest.js 대신에
form.js 를 사용하도록 변경되었으며,
required 는 needed로 변경된 상태입니다.
checkbox 에 개별적으로 required 를 주면, 같은 name 을 가진게 몇개이건 (배열이건 아니건) required 속성을 가진 항목은 모두 check 해야 넘어 가는게 맞습니다. 따라서 취미를 무조건 하나 이상 다중 선택할 수 있도록 원하신다면 별도 script 로 유효성 검사를 하셔야 하는게 맞습니다. 그누보드 기본 배포 코드에는 checkbox 의 required 관련 코드는 포함되어 있지 않습니다.
따라서 지금처럼 needed 라고 바꾸신 것은 잘 하신 일입니다만, 비표준 속성이기 때문에 class="needed" 로 넣어주시고, 이 값으로 원하는 검사를 수행하시는게 더 좋을 것 같습니다.
위의 배열로 넘어간다는 것은 제가 상황에 대한 이해를 잘못 하고 부연설명한 것입니다.
해당 wrest.js 를 form.js 로 교체 햇을때
크롬을 제외한 모든 브라우저에서는 정상적으로 checkbox, radio, select 박스의 유효성을 검사하는데,
크롬에서만 checkbox 에서 문제를 일으켜서 (즉 required 옵션을 크롬에서만 인식을 하는것 같습니다.)
required 가 html 표준 코딩이라면 다른 옵션명으로 교체하는게 맞지 않나 싶어서 말씀 드렸습니다.
의견 감사합니다. 좋은 하루 되세요. ^^
required 라는 option 대신에 다른 option 이름으로 변경됬으면 합니다.
http://www.sir.co.kr/bbs/board.php?bo_table=g4_skin&wr_id=107930
이게도움이 되실련지요
html5 에서 지원됩니다.
그래서 html5 가 나오기 전에 웹표준과 맞지 않아 고생한 기억이 있네요.
xhtml -> required="required"
radio는 어차피 한 개의 필드에 checked를 해 두면 필수 선택이 되는데 required가 필요할까 싶은 생각이 들었습니다.
그건 제 생각이고 천국나무님 댓글이 3초의 시간차를 두고 똑같이 등록이 됐는데 냑에서 종종 있나봐요. 어제도 다른 회원님 댓글이 중복 등록 되는 걸 봤는데...