필수선택사항 옵션을 주고 글쓰기 할 때 문제점 질문 드립니다. > 그누4 질문답변

그누4 질문답변

그누보드4 관련 질문은 QA 로 이전됩니다. QA 그누보드4 바로가기
기존 게시물은 열람만 가능합니다.

필수선택사항 옵션을 주고 글쓰기 할 때 문제점 질문 드립니다. 정보

필수선택사항 옵션을 주고 글쓰기 할 때 문제점 질문 드립니다.

본문

카테고리를 사용하구요.

카테고리 선택박스에 class="required" title="분류" 이렇게 해 두면 필수입력 사항이 되는데요.

만약 글 작성 시 카테고리 선택없이 저장 버튼을 누르면 경고창이 뜹니다.

그런데 문제는 경고창 확인 후 페이지 리로딩 해버리는 문제로 작성한 글이 날아가 버리네요.

혹시 경고창 확인 후 페이지를 리로딩 하지 않게 하려면 wrest.js에서 어디를 손봐야 할까요?

아무리 여기저기 손봐도 안되네요. ㅠ ㅠ

부디 도움 부탁드리겠습니다. ^^




그누보드는 DTD 버저이구요.
에디터는 cheditor 5.03 사용 중입니다.

/skin/board/basic/write.skin.php (글쓰기 카테고리 출력부분)

	<?php if ($is_category) { ?>
	<tr>
		<th>분류</th>
		<td>
			<select id="ca_name" name="ca_name" class="ca_list required" title="분류">
				<option value="">선택하세요</option>
				<?php echo $category_option?>
			</select>
		</td>
	</tr>
	<?php } ?>



### 글쓰기 onsubmit 부분 ###

<form id="fwrite" name="fwrite" method="post" onsubmit="return fwrite_submit(this);" enctype="multipart/form-data">



/skin/board/basic/write.skin.php(글쓰기 스크립트 부분)

function fwrite_submit(f) 
{
	if (document.getElementById('char_count')) {
		if (char_min > 0 || char_max > 0) {
			var cnt = parseInt(document.getElementById('char_count').innerHTML);
			if (char_min > 0 && char_min > cnt) {
				alert("내용은 "+char_min+"글자 이상 쓰셔야 합니다.");
				return false;
			} 
			else if (char_max > 0 && char_max < cnt) {
				alert("내용은 "+char_max+"글자 이하로 쓰셔야 합니다.");
				return false;
			}
		}
	}

	if (document.getElementById('tx_wr_content')) {
		if (!ed_wr_content.outputBodyText()) { 
			alert('내용을 입력하십시오.'); 
			ed_wr_content.returnFalse();
			return false;
			//return true;
		}
	}

	<?php if ($is_dhtml_editor && $board['bo_3'] == "cheditor5") echo cheditor3('wr_content'); ?>

	var subject = "";
	var content = "";
	$.ajax({
		url: "<?php echo $board_skin_path?>/ajax.filter.php",
		type: "POST",
		data: {
			"subject": f.wr_subject.value,
			"content": f.wr_content.value
		},
		dataType: "json",
		async: false,
		cache: false,
		success: function(data, textStatus) {
			subject = data.subject;
			content = data.content;
		}
	});

	if (subject) {
		alert("제목에 금지단어('"+subject+"')가 포함되어있습니다");
		f.wr_subject.focus();
		return false;
	}

	if (content) {
		alert("내용에 금지단어('"+content+"')가 포함되어있습니다");
		if (typeof(ed_wr_content) != "undefined") 
			ed_wr_content.returnFalse();
		else 
			f.wr_content.focus();
		return false;
	}

	if (!check_kcaptcha(f.wr_key)) {
		return false;
	}

	document.getElementById('btn_submit').disabled = true;

	<?php echo cheditor3('wr_content');?>
	<?php
	if ($g4['https_url'])
		echo "f.action = '$g4[https_url]/$g4[bbs]/write_update.php';";
	else
		echo "f.action = './write_update.php';\n";
	?>
	return true;
}


/bbs/write.php

$is_category = false;
if ($board[bo_use_category]) {
    $ca_name = $write[ca_name];
    $category_option = get_category_option($bo_table);
    $is_category = true;
}


/js/wrest.js (필수입력 처리 부분)

var wrestMsg = "";
var wrestFld = null;
var wrestFldDefaultColor = "";
var wrestFldBackColor = "#FFE4E1";

// subject 속성값을 얻어 return, 없으면 tag의 name을 넘김
function wrestItemname(fld)
{
	return fld.getAttribute("title") ? fld.getAttribute("title") : ( fld.getAttribute("alt") ? fld.getAttribute("alt") : fld.name );
}

// 양쪽 공백 없애기
function wrestTrim(fld)
{
	var pattern = /(^\s+)|(\s+$)/g; // \s 공백 문자
	//(/^\s+|\s+$/g,"");
	var str = fld.value.replace(pattern, "");
	return str;
}

// 필수 입력 검사
function wrestRequired(fld)
{
	if (wrestTrim(fld) == "") {
		if (wrestFld == null) {
			// 셀렉트박스일 경우에도 필수 선택 검사합니다.
			wrestMsg = wrestItemname(fld) + " : 필수 "+(fld.type=="select-one"?"선택":"입력")+"입니다.\n";
			wrestFld = fld;
		}
		return false;
	}
	return false;
}

// 김선용 2006.3 - 전화번호(휴대폰) 형식 검사 : 123-123(4)-5678
function wrestTelNum(fld)
{
	if (!wrestTrim(fld)) return;

	var pattern = /^[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}$/;
	if(!pattern.test(fld.value)){
		if(wrestFld == null){
			wrestMsg = wrestItemname(fld)+" : 전화번호 형식이 올바르지 않습니다.\n\n하이픈(-)을 포함하여 입력하세요.\n";
			wrestFld = fld;
			fld.select();
		}
	}
}

// 이메일주소 형식 검사
function wrestEmail(fld)
{
	if (!wrestTrim(fld)) return;

	//var pattern = /(\S+)@(\S+)\.(\S+)/; 이메일주소에 한글 사용시
	var pattern = /([0-9a-zA-Z_-]+)@([0-9a-zA-Z_-]+)\.([0-9a-zA-Z_-]+)/;
	if (!pattern.test(fld.value)) {
		if (wrestFld == null) {
			wrestMsg = wrestItemname(fld) + " : 이메일주소 형식이 아닙니다.\n";
			wrestFld = fld;
		}
	}
}

// 한글인지 검사 (자음, 모음만 있는 한글은 불가)
function wrestHangul(fld)
{
	if (!wrestTrim(fld)) return;

	var pattern = /([^가-힣\x20])/i;

	if (pattern.test(fld.value)) {
		if (wrestFld == null) {
			wrestMsg = wrestItemname(fld) + ' : 한글이 아닙니다. (자음, 모음만 있는 한글은 처리하지 않습니다.)\n';
			wrestFld = fld;
		}
	}
}

// 한글인지 검사2 (자음, 모음만 있는 한글도 가능)
function wrestHangul2(fld)
{
	if (!wrestTrim(fld)) return;

	var pattern = /([^가-힣ㄱ-ㅎㅏ-ㅣ\x20])/i;

	if (pattern.test(fld.value)) {
		if (wrestFld == null) {
			wrestMsg = wrestItemname(fld) + ' : 한글이 아닙니다.\n';
			wrestFld = fld;
		}
	}
}

// 한글,영문,숫자인지 검사3
function wrestHangulAlNum(fld)
{
	if (!wrestTrim(fld)) return;

	var pattern = /([^가-힣\x20^a-z^A-Z^0-9])/i;

	if (pattern.test(fld.value)) {
		if (wrestFld == null) {
			wrestMsg = wrestItemname(fld) + ' : 한글, 영문, 숫자가 아닙니다.\n';
			wrestFld = fld;
		}
	}
}

// 한글,영문 인지 검사
function wrestHangulAlpha(fld)
{
	if (!wrestTrim(fld)) return;

	var pattern = /([^가-힣\x20^a-z^A-Z])/i;

	if (pattern.test(fld.value)) {
		if (wrestFld == null) {
			wrestMsg = wrestItemname(fld) + ' : 한글, 영문이 아닙니다.\n';
			wrestFld = fld;
		}
	}
}

// 숫자인지검사
// 배부른꿀꿀이님 추가 (http://dasir.com) 2003-06-24
function wrestNumeric(fld)
{
	if (fld.value.length > 0) {
		for (i = 0; i < fld.value.length; i++) {
			if (fld.value.charAt(i) < '0' || fld.value.charAt(i) > '9') {
				wrestMsg = wrestItemname(fld) + " : 숫자가 아닙니다.\n";
				wrestFld = fld;
			}
		}
	}
}

// 영문자 검사
// 배부른꿀꿀이님 추가 (http://dasir.com) 2003-06-24
function wrestAlpha(fld)
{
	if (!wrestTrim(fld)) return;

	var pattern = /(^[a-zA-Z]+$)/;

	if (!pattern.test(fld.value)) {
		if (wrestFld == null) {
			wrestMsg = wrestItemname(fld) + " : 영문이 아닙니다.\n";
			wrestFld = fld;
		}
	}
}

// 영문자와 숫자 검사
// 배부른꿀꿀이님 추가 (http://dasir.com) 2003-07-07
function wrestAlNum(fld)
{
   if (!wrestTrim(fld)) return;

   var pattern = /(^[a-zA-Z0-9]+$)/;

   if (!pattern.test(fld.value)) {
	   if (wrestFld == null) {
		   wrestMsg = wrestItemname(fld) + " : 영문 또는 숫자가 아닙니다.\n";
		   wrestFld = fld;
	   }
   }
}

// 영문자와 숫자 그리고 _ 검사
function wrestAlNum_(fld)
{
   if (!wrestTrim(fld)) return;

   var pattern = /(^[a-zA-Z0-9\_]+$)/;

   if (!pattern.test(fld.value)) {
	   if (wrestFld == null) {
		   wrestMsg = wrestItemname(fld) + " : 영문, 숫자, _ 가 아닙니다.\n";
		   wrestFld = fld;
	   }
   }
}

// 최소 길이 검사
function wrestMinLength(fld, css)
{
	if (!wrestTrim(fld)) return;

	var str = css.split('='); // minlength=?? <-- str[1]

	if (wrestFld == null) {
		if (fld.value.length < parseInt(str[1])) {
			wrestMsg = wrestItemname(fld) + " : 최소 "+str[1]+"글자 이상 입력하세요.\n";
			wrestFld = fld;
		}
	}
}

// 이미지 확장자
function wrestImgExt(fld)
{
	if (!wrestTrim(fld)) return;

	var pattern = /\.(gif|jpg|png)$/i; // jpeg 는 제외
	if(!pattern.test(fld.value)){
		if(wrestFld == null){
			wrestMsg = wrestItemname(fld)+" : 이미지 파일이 아닙니다.\n.gif .jpg .png 파일만 가능합니다.\n";
			wrestFld = fld;
			fld.select();
		}
	}
}

// 확장자
function wrestExtension(fld, css)
{
	if (!wrestTrim(fld)) return;

	var str = css.split('='); // ext=?? <-- str[1]
	var src = fld.value.split('.');
	var ext = src[src.length - 1];

	if (wrestFld == null) {
		if (ext.toLowerCase() < str[1].toLowerCase()) {
			wrestMsg = wrestItemname(fld) + " : ."+str[1]+" 파일만 가능합니다.\n";
			wrestFld = fld;
		}
	}
}

// 공백 검사후 공백을 "" 로 변환
function wrestNospace(fld)
{
	var pattern = /(\s)/g; // \s 공백 문자

	if (pattern.test(fld.value)) {
		if (wrestFld == null) {
			wrestMsg = wrestItemname(fld) + " : 공백이 없어야 합니다.\n";
			wrestFld = fld;
		}
	}
}

// submit 할 때 속성을 검사한다.
function wrestSubmit()
{
	wrestMsg = "";
	wrestFld = null;

	var attr = null;

	// 해당폼에 대한 요소의 갯수만큼 돌려라
	for (var i=0; i<this.elements.length; i++) {
		var el = this.elements[i];

		// Input tag 의 type 이 text, file, password 일때만
		// 셀렉트 박스일때도 필수 선택 검사합니다. select-one
		if (el.type=='text' || el.type=='hidden' || el.type=='file' || el.type=='password' || el.type=='select-one' || el.type=='textarea') {
			var array_css = el.className.split(' '); // class 를 공백으로 나눔

			el.style.backgroundColor = wrestFldDefaultColor;

			// 배열의 길이만큼 돌려라
			for (var k=0; k<array_css.length; k++) {
				var css = array_css[k];
				switch (css) {
					case "required"		: wrestRequired(el); break;
					case "trim"			: wrestTrim(el); break;
					case "email"		: wrestEmail(el); break;
					case "hangul"		: wrestHangul(el); break;
					case "hangul2"		: wrestHangul2(el); break;
					case "hangulalpha"	: wrestHangulAlpha(el); break;
					case "hangulalnum"	: wrestHangulAlNum(el); break;
					case "nospace"		: wrestNospace(el); break;
					case "numeric"		: wrestNumeric(el); break;
					case "alpha"		: wrestAlpha(el); break;
					case "alnum"		: wrestAlNum(el); break;
					case "alnum_"		: wrestAlNum_(el); break;
					case "telnum"		: wrestTelNum(el); break; // 김선용 2006.3 - 전화번호 형식 검사
					case "imgext"		: wrestImgExt(el); break;
					default :
						// css 가 minlength= 로 시작한다면 = 뒤의 숫자는 최소길이값
						if (/^minlength\=/.test(css)) {
							wrestMinLength(el, css); break;
						} else if (/^extension\=/.test(css)) {
							wrestExtension(el, css); break;
						}
				} // switch (css)
			} // for (k)
		} // if (el)
	} // for (i)

	// 필드가 null 이 아니라면 오류메세지 출력후 포커스를 해당 오류 필드로 옮김
	// 오류 필드는 배경색상을 바꾼다.
	if (wrestFld != null) {
		// 경고메세지 출력
		alert(wrestMsg);

		if (wrestFld.style.display != 'none') {
			wrestFld.style.backgroundColor = wrestFldBackColor;
			if (typeof(wrestFld.select) != 'undefined')
				wrestFld.select();
				wrestFld.focus();
		}
		return false;
	}

	if (this.oldsubmit && this.oldsubmit() == false)
			return false;

		return true;
}

	// 초기에 onsubmit을 가로채도록 한다.
		function wrestInitialized()
		{
	//var regexp = /required/;
	var regexp = /\brequired\b/;


			for (var i = 0; i < document.forms.length; i++) 
			{
				// onsubmit 이벤트가 있다면 저장해 놓는다.
				if (document.forms[i].onsubmit) document.forms[i].oldsubmit = document.forms[i].onsubmit;
				document.forms[i].onsubmit = wrestSubmit;


				for (var j = 0; j < document.forms[i].elements.length; j++) 
				{
					// 필수 입력일 경우는 * 배경이미지를 준다.
					//if (document.forms[i].elements[j].getAttribute("required") != null)
					if (regexp.test(document.forms[i].elements[j].className))
					{
						//document.forms[i].elements[j].style.backgroundColor = wrestFldDefaultColor;
						//document.forms[i].elements[j].className = "wrest_required";
						document.forms[i].elements[j].style.backgroundImage = "url('"+g4_path+"/js/wrest.png')";
						document.forms[i].elements[j].style.backgroundPosition = "top right";
						document.forms[i].elements[j].style.backgroundRepeat = "no-repeat";
					}
				}
			}
		}

	// 폼필드 자동검사
	$(document).ready(function(){
		wrestInitialized();
	});

댓글 전체

카테고리 선택박스 코드를 안보고서는 문제를 해결 할 수 없습니다
추측으로는 onchange에서 페이지 이동이 되도록 되어잇는 것 같습니다만
아 그런가요?

코드를 질문에 추가해서 보여드려야 할까요?

필수선택(입력)은 wrest.js가 처리하지 않나요?

관련된 부분들을 모두 수정해서 올렸습니다. ^^;;

답변을 받을 수 있을까요? ㅠ ㅠ 늘 답변을 받지 못했었는데...

꼭 해결해야 할 문제입니다
전체 66,558 |RSS
그누4 질문답변 내용 검색

회원로그인

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