30/09/2018, 18:10

Validate ckeditor by jquery

Em chào các anh !
Em có đoạn Code như này làm đi làm lại rồi nhưng Thầy vẫn nhận xét là vẫn chưa validate ckeditor ở ô giới thiệu thành viên, nên nhờ các anh xem giúp và chỉ em với ạ.

<html>
	<head>
		<title>jQuery Validator</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta name="keywords" content="học php" />
		<meta name="description" content="học php" />
		<script type="text/javascript" src="ckeditor/ckeditor.js" ></script>
		<script type="text/javascript" src="jquery-1.11.3.min.js" ></script>
		<script type="text/javascript" src="jquery.validate.min.js" ></script>
		<script>
		$().ready(function() {

		// validate signup form on keyup and submit
		$("#formlogin").validate({
			rules: {
				username: {
					required: true,
					minlength: 6,
				},
				password: {
					required: true,
					minlength: 6,
					maxlength: 32,
					
				},
				confirm_password: {
					minlength: 6, 
					required: true, 
					equalTo: "#password"
				},
				
				email: {
				
					required: true, 
					email: true, 
				},
				reemail: {
					required: true, 
					equalTo: "#email"
				},
				hoten:{
					required: true,
					equalTo: "#hoten",
				},
				gioitinh:{
					required: true,
					equalTo: "#gioitinh",
				},
				thanhpho:{
					required: true,
					equalTo: "#thanhpho",
				},
				skype:{
					required: true,
					equalTo: "#skype",
				},
				gioithieu:{
					required: true,
					equalTo: "#gioithieu",
				},
				
				agree: "required"
			},
			messages: {
				
				username: {
					required: "Vui lòng nhập tên đăng nhập !",
					minlength: "Tên truy cập phải có ít nhất 6 ký tự, nhiều nhất 32 ký tự"
				},
				password: {
					required: "Vui lòng nhập mật khẩu !",
					minlength: " Mật khẩu phải có ít nhất 6 ký tự"
				},
				confirm_password: {
					required: "Vui lòng nhập lại mật khẩu !",
					minlength: " Mật khẩu phải có ít nhất 6 ký tự",
					equalTo: "Vui lòng nhập lại mật khẩu trên !"
					
				},
				
				email: {
					required: "Email phải đúng định dạng !",
					minlength: "Email phải đúng định dạng",
					email: "Email phải đúng định dạng !"
					
				},
				reemail: {
					required: "Vui lòng nhập lại emmail !",
					minlength: " Mật khẩu phải có ít nhất 6 ký tự",
					equalTo: "Xác nhận email phải trùng với Email đã nhập trên !"
					
				},
				hoten:{
					required: "Nhập họ và tên",
					equalTo: "Nhập họ và tên",
				},
				gioitinh:{
					required: "Chọn",
					equalTo: "Vui lòng lựa chọn giới tính",
				},
				thanhpho:{
					required: "Chọn thành phố",
					equalTo: "Vui lòng chọn thành phố",
				},
				skype:{
					required: "Nhập nick Skype",
					equalTo: "Vui lòng nhập nick Skype",
				},
				gioithieu:{
					required: "Giới thiệu tóm tắt bản thân",
					equalTo: "Giới thiệu tóm tắt bản thân",
				},
				//email: "Please enter a valid email address",
				agree: "Please accept our policy",
				topic: "Please select at least 2 topics"
			}
		});

		// propose username by combining first- and lastname
		$("#username").focus(function() {
			var firstname = $("#firstname").val();
			var lastname = $("#lastname").val();
			if (firstname && lastname && !this.value) {
				this.value = firstname + "." + lastname;
			}
		});
	});
		</script>
	</head>
	<body>		
		<p style="size:90%; font-style:italic">(*) Bắt buộc nhập</p>
		<form action="" method="POST" name="formlogin" id="formlogin">
			<table width="800px" border="1">
				<tr><td colspan="2"><p style="color:#E97D13; text-align:center">VinaTAB EDU - Đã học là làm được</p></td></tr>
				<tr><td colspan="2"><p style="color:#E97D13"><b>Đăng ký thành viên, gian hàng</b></p></td></tr>
				<tr>
					<td width="152px" valign="top">Tên truy cập(*): </td>
					<td valign="top">
						<input type="text" value="" name="username" id="username" size="32" /><br />						
					</td>
				</tr>
				
				<tr>
					<td valign="top">Mật khẩu(*): </td>
					<td valign="top">
						<input type="password" value="" name="password" id="password" size="32" /><br />
					</td>
				</tr>
				
				<tr>
					<td valign="top">Xác nhận mật khẩu(*): </td>
					<td valign="top">
						<input type="password" value="" name="confirm_password" id="confirm_password" size="44" /><br />
						
					</td>
				</tr>
				
				<tr>
					<td valign="top">Họ và tên(*): </td>
					<td valign="top">
						<input type="text" value="" name="hoten" id="hoten" size="44" />
					</td>
				</tr>
				
				<tr>
					<td valign="top">Email(*): </td>
					<td valign="top">
						<input type="text" value="" name="email" id="email" size="44" /><br />
					</td>
				</tr>
				
				<tr>
					<td valign="top">Xác nhận email: </td>
					<td valign="top">
						<input type="text" value="" name="reemail" id="reemail" size="44" /><br />
					</td>
				</tr>
				
				<tr>
					<td valign="middle">Avatar/logo: </td>
					<td valign="top">
						<input type="file" value="" name="avatar" size="44" />
					</td>
				</tr>				
				<tr>
					<td valign="top">Giới tính(*): </td>
					<td valign="top" id="gioitinh">
						Nam <input type="radio" value="nam" name="gioitinh"/>
						Nữ <input type="radio" value="nu" name="gioitinh"  /><br />						
					</td>
				</tr>
				
				<tr>
					<td valign="top">Ngày sinh: </td>
					<td valign="top">
						<select name="ngay">
							<option value="0">Ngày</option>
							<option value="1">1</option>
							<option value="2">2</option>
							<option value="31">31</option>
						</select> -
						<select name="thang">
							<option value="0">Tháng</option>
							<option value="1">1</option>
							<option value="2">2</option>
							<option value="12">12</option>
						</select> -
						<select name="nam">
							<option value="0">Năm</option>
							<option value="1">2013</option>
							<option value="2">2014</option>
							<option value="12">2015</option>
							<option value="12">2016</option>
						</select> (dd-mm-yyyy)
					</td>
				</tr>
				
				<tr>
					<td valign="top">Thành phố(*): </td>
					<td valign="top">
						<select name="thanhpho" id="thanhpho">
							<option value="">--[Chọn]--</option>
							<option value="danang">Đà Nẵng</option>
							<option value="hochiminh">Hồ Chí Minh</option>
							<option value="hanoi">Hà Nội</option>
						</select>
					</td>
				</tr>
				
				<tr>
					<td valign="top">Nick Yahoo: </td>
					<td valign="top">
						<input type="text" value="" name="yahoo" />
					</td>
				</tr>
				
				<tr>
					<td valign="top">Nick Skype(*): </td>
					<td valign="top">
						<input type="text" value="" name="skype" id="skype"/>
					</td>
				</tr>
				
				<tr>
					<td valign="top">Giới thiệu thành viên(*)</td>
					<td valign="top">
						<textarea class="ckeditor" rows="6" cols="80" name="gioithieu" id="gioithieu"></textarea>
					</td>
				</tr>
				
				<tr>
					<td valign="top">&nbsp;</td>
					<td valign="top">
						<input type="submit" value="Submit" name="submit" />
						<input type="reset" value="Reset" name="reset" />
					</td>
				</tr>
				
			</table>
		</form>
	</body> 
</html> 
vũ xuân quân viết 20:26 ngày 30/09/2018

lên google tìm theo cụm từ này “how to validate ckeditor in javascript” hoặc “jquery validate ckeditor” hoặc “javascript validate ckeditor textarea”

MK viết 20:21 ngày 30/09/2018

Em search nhưng vẫn chưa hiểu ạ

vũ xuân quân viết 20:20 ngày 30/09/2018

thao khảo mấy link này

dzone.com

Using the jQuery Validate Plugin with CKEditor - DZone Web Dev

Just a quick post (mostly for my own reference!) on using the jQuery validate plugin to check that a CKEditor instance has content. The problem occurs when...


stackoverflow.com
Santosh Linkha

jquery validation of textarea integrated with ckeditor

jquery, jquery-plugins, jquery-validate, ckeditor
asked by Santosh Linkha on 11:17AM - 26 Feb 11

stackoverflow.com
PHPCoder

Jquery validation not working with ckeditor

jquery, jquery-validate, ckeditor
asked by PHPCoder on 11:31AM - 07 Mar 14

em chưa hiểu là chưa hiểu chỗ nào ?

MK viết 20:14 ngày 30/09/2018

Em gửi bài Thầy bảo chưa validate được ckeditor, e làm validate thêm cái đó,em chưa hiểu thêm validate là sao ạ ? Em mới học nên ngôn ngữ lập trình em chưa hiểu ạ.

vũ xuân quân viết 20:15 ngày 30/09/2018

mấy cái link trên đã chỉ hướng dẫn cách validate ckeditor rồi. Em đọc mấy link trên sẽ thấy.
anh chỉ hướng dẫn cho em thôi.

Cương Nguyễn viết 20:25 ngày 30/09/2018

Vãi em, a cũng chưa dịch validate ra tiếng việt bao h. E có thể hiểu nó như là 1 luật, hay 1 yêu cầu mà bắt buộc người dùng phải tuân theo.
Ví dụ:
E có 1 TextBox cho người dùng nhập email chẳng hạn. e mail thì phải giống như: xxx@yyy.zzz. E lại không muốn cho họ nhập sai format trên -> e sẽ phải validate đoạn text mà người dùng nhập. Nếu họ nhập sai -> thông báo và bắt nhập lại.

Nếu e để ý trên các form đăng ký tài khoản hiện nay có 2 kiểu validate:

  1. Validate ngay khi người dùng nhập: ví dụ có 2 ô nhập Passwordnhập lại Password. bất cứ khi nào e gõ thêm 1 ký tự ở ô nhập lại Pasword đều báo đỏ đến khi e nhập đúng password đã nhập ở bên trên thì mới báo xanh.
  2. Validate khi người dùng bấm submit: Người dùng nhập hết tên, tuổi, account, password… xong bấm Submit -> lúc này mới validate tất cả các text mà người dùng nhập và báo họ những cái nào nhập sai.
Bài liên quan
0