내용으로 건너뛰기
권남
사용자 도구
로그인
사이트 도구
검색
도구
문서 보기
이전 판
역링크
최근 바뀜
미디어 관리자
사이트맵
로그인
>
최근 바뀜
미디어 관리자
사이트맵
추적:
javascript:jquery:form
이 문서는 읽기 전용입니다. 원본을 볼 수는 있지만 바꿀 수는 없습니다. 문제가 있다고 생각하면 관리자에게 문의하세요.
====== JQuery Form ====== ===== checkbox/radio ===== * $("input[type=checkbox]").is(":checked") : 체크박스나 라디오버튼의 체크 여부를 리턴한다. [[http://api.jquery.com/is/|jQUery is() - 현재 요소가 selector를 만족하는지 리턴]] * $("input[type=checkbox]:checked") : 체크된 요소만 리턴한다. * $("input[type=checkbox]:not(:checked)") : 체크 안 된 요소만 리턴한다. * $("select").val() : ''select'' 요소의 선택된 값을 읽는다. * $("select").val(1).select() : ''select'' 요소에서 ''option''의 value가 1인 것을 선택 상태로 만든다. * $("select :selected").text() : ''select'' 요소에서 선택 상태인 ''option''의 문자열 값을 읽는다. ===== jQuery Form Plugin ===== * http://jquery.malsup.com/form/ * Ajax 로 Form을 submit 할 수 있다. * $.ajaxForm() 의 **beforeSubmit** 함수 내에서 폼의 내용을 바꾸는 것은 제대로 작동하지 않는다. 이럴 때는 폼의 내용을 바꾼뒤 $.ajaxSubmit()을 호출하는 것이 낫다. * [[http://bassistance.de/jquery-plugins/jquery-plugin-validation/|Validation]] 플러그인과 함께 사용시에는 beforeSubmit에서 validate()를 호출하면 된다. [[http://mytory.co.kr/archives/2292|참조]]<code javascript> function(){ return $('.myForm').valid(); } </code> * form의 submit 버튼을 ''<input type="submit" ../>'' 이나 ''<button type="submit" ...>'' 등으로 할 경우 2 중으로 submit 되는 현상이 발생할 수 있다. 이를 위해 ''onclick="return false;"''를 해당 태그에 추가해주면 된다. ==== AjaxForm으로 파일 업로드 ==== * 파일을 업로드 할 때는 **iframe: true** 옵션을 주면된다. * iframe: true 옵션을 줄 경우, 그 결과로 JSON을 그냥 받을 수 없다. Firefox/IE는 application/json MIME TYPE을 Javascript에 결과로 넘겨주지 않고 파일로 다운로드하여 저장하기 때문이다. http://pinoytech.org/question/2755802/jquery-ajaxform-returning-json-file * 회피법 * JSON 결과를 text/plain;charset=utf-8 로 리턴한다. 받는 측에서도 요청을 보낼 때 dataType: "text"로 지정하여 보낸다. * 결과를 문자열로 받아서 striptags를 실행한다.<code javascript> text.replace(/(<([^>]+)>)/ig,""); </code> * 해당 결과를 jQuery.parseJSON(text); 로 JSON으로 변환하여 그 값을 사용한다. === iframe 옵션과 Cross Domain 문제 === * ''document.domain=XX'' 로 Cross Domain 설정을 한 상태에서 iframe 옵션을 사용하면 업로드가 작동하지 않는다. iframe 내부 컨텐츠의 document.domain 설정은 항상 iframe URL의 도메인을 따르게 되기 때문이다. Chrome에서 보면 다음과 같은 오류 발생.<code> Unsafe JavaScript attempt to access frame with URL XXX from frame with URL YYY. Domains, protocols and ports must match. </code> * 비록 document.domain 설정이 iframe 도메인을 포함한다고 하더라도 두 값이 정확히 동일하지 않으면 작동하지 않게 된다. * 해결책 * iframe의 결과를 HTML로 하고, 해당 HTML의 <head>에서 **document.domain**을 호출자와 동일하게 설정하는 Javascript 코드를 넣어준다. * 호출자는 응답 결과를 text나 json이 아닌 **html**로 지정하고, html DOM Parsing을 한다. * 혹은, 응답 결과를 JSONP로 간주하고, 응답 html에서 callback 호출을 시도해본다.(아직 안해봄) * [[http://www.sencha.com/forum/showthread.php?136092-Response-lost-from-upload-Ajax-request-to-iframe-if-document.domain-changed|Response lost from upload Ajax request to iframe if document.domain changed]] 참조 ===== Enter 키로 Form submit 되는 것 막기 ===== * [[http://stackoverflow.com/questions/585396/how-to-prevent-enter-keypress-to-submit-a-web-form|How to prevent ENTER keypress to submit a web form?]] <code javascript> $("form").on("keypress", function (e) { if (e.keyCode === 13) { //원하는 작업들.. return false; } }); </code>
javascript/jquery/form.txt
· 마지막으로 수정됨: 2016/09/02 13:27 저자
kwon37xi
문서 도구
문서 보기
이전 판
역링크
맨 위로