2010-03-29 2 views
0

확인란이나 라디오 단추 중 하나가있는 경우 종종 기타을 선택해야합니다. 이 체크 박스 또는 라디오 버튼은 매우 자주 사용자가이 내용을 작성해야하는 텍스트 상자와 함께 표시됩니다. 기타입니다.깨끗하고 액세스 가능한 기타 옵션 (확인란 및 텍스트 상자)

이 설정은 일반적으로 어떻게 처리됩니까? 어떤 종류의 마크 업을 사용합니까? 귀하의 확인 과정에서 귀하는 무엇을 요구합니까? 자바 스크립트를 사용합니까? 예 :

  • 어떻게 양식에 액세스 할 수있게합니까? 당신은 사용하고 어떻게 라벨 태그를 사용합니까?
  • 일부 자바 스크립트로 어떤 식 으로든 확인란과 텍스트 상자를 연결합니까? 예를 들어, 확인란을 선택하면 텍스트 상자를 활성화합니까? 텍스트 상자가 채워 지거나 지워지면 확인란을 자동으로 선택 또는 선택 취소합니까?
  • 확인란을 선택했지만 텍스트 상자가 채워져 있지 않거나 텍스트 상자가 채워져 있지만 확인란이 선택되어 있지 않으면 오류 메시지와 함께 유효성 검사를 실패합니까? 아니면 그냥 채워지지 않고 체크하지 않았다고 생각합니까?

즉,에서, 최선의 방법이 문제를 처리하므로, 어떠한 조언과 예 환영 C ")

답변

0
일반적으로

내가 동적 양식이있을 때, 나는 동적 입력을 삽입을합니다. 아주 확실 jQuery의 경우 사용자가 다른 옵션을 사용하기를 원한다면 .remove() -ed를 사용할 수 있도록 .append('<input...') 또는 다른 유사한 기능을 사용하여 실제로 요소를 삽입하고 ID (또는 클래스에 따라 다름)를 사용합니다. 유효성 검사는 입력 버튼의 onClick을 통해 처리됩니다. 내가 기분이 좋으면 AJAX 경로를 건너 뛰고 <form>을 건너 뜁니다.

나는 검증을 실패하게 만들 것이다. 그들은 "기타"를 원하며 "기타"가 무엇인지 알고 싶습니다. 기타가 무엇인지 신경 쓰지 않는다면, 입력 상자에 신경 쓰지 마세요.

편집 : 다음과 같이 보일 수 있습니다.

$('input[type="radio"]').click(function() { 

    if($(this).next().attr('name') != 'other' && $(this).attr('name') == 'other_input') { 
     $(this).after('<textarea name="other"></textarea>'); 
    } else { 
     $('textarea[name="other"]').remove(); 
    } 
} 

click

가 클릭되는 모든 라디오에 반응하는 것이며, if는 클릭에 반응에만 '기타'라디오 버튼입니다 있는지 확인, 존재하지 않는 경우는 반응 만 것 이미 텍스트 영역 이후에 (그래서 당신은 여러 textarea propogations을 얻을하지 않습니다).

사물의 처리면에서 처음에 다른 것이 확인되었는지 확인하고 텍스트 영역의 입력을 가져 오는 경우 유효성을 검사해야합니다. 아마도 서버 측 유효성 검사를 사용해야합니다.

희망이 시작됩니다.

+0

기타 입력란이 jQuery를 사용하여 기타 확인란이나 라디오 버튼에 "연결"되어 있습니까? – Svish

+0

이름 대신 값에서'other'를 찾기가 어렵습니까? 확인란과 라디오 상자의 경우 동일한 그룹에 속할 때 이름이 동일하기 때문입니다. – Svish

+0

물론입니다. 실제로 나는 이렇게했을 것입니다. 그랬듯이 나는 눈을 멀게하고 작동 할 수있는 코드를 타이핑했다. '&& $ (this) .val() == 'other')'와 같이 보일 것입니다. 이 시점에서 '기타'라디오 버튼은 POST 처리시 텍스트 필드가 있음을 알 수있는 방법 일뿐입니다. '기타'는 다른 고유 한 또는 실제 값이 없기 때문입니다. – dclowd9901

0

나는 보통이 같은 레이블에 내 라디오 버튼을 둘러싸 : 사용자가 텍스트를 클릭 할 수 있습니다

<label><input type=radio value=xyz name=stjames>Saint James</label> 

이 방법은 버튼을 트리거 할 수 있습니다.

행동 방법을 결정할 때, 나는 보통 자신이 "그 때 사용자가 예상했던 것 ..."이라고 말하면 종종 나에게 대답을줍니다. 따라서 텍스트 상자를 클릭하거나 초점을 맞추면 해당 라디오가 켜집니다. 텍스트 상자를 사용하지 않으면이 기능이 작동하지 않습니다!

() US () UK  (*) Other [________________] 

기타 선택이 위험한 경우 (데이터 삭제), 사용자가 명시 적으로 기타를 클릭 할 때까지 텍스트 상자를 비활성화 할 수 있습니다. 그런 다음 라디오가 텍스트 상자를 다른 방향 대신에 움직입니다. 이 경우 사용자가 다른 단계를 수행해야합니다. 그것은 상황에 달려 있습니다 - 각각의 경우에 어떤 일이 일어날 지 생각해보십시오.

나는 보통 사용자가 '잘못된'일을하는 것을 불가능하게하거나 성가 시게하려고합니다. EG 뭔가 일치하지 않는 경우 확인 버튼을 해제하십시오. 또는 사용자가 텍스트를 입력 할 때 기타 라디오를 선택하십시오. 텍스트 상자에 텍스트가 있지만 라디오 버튼이 다른 것으로 설정된 경우 일반적으로 텍스트를 무시합니다. 하지만 심각하거나 위험한 상황이라면 사용자가 마음을 굳히고 있는지 확인해야합니다. 사용자가 다른 라디오를 선택할 때 텍스트를 삭제하면 해당 사용자는 열 받게 할 수도 있지만 조심해야한다면 적절할 수 있습니다.

관련 문제