01/10/2018, 09:23

Đã nhúng js vào html nhưng không check validate được?

file HTML

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="../CSS/add_content.css">

</head>
<body>
	
	<form action="" method="post" onsubmit="return validate_add_content()">
		<div id="container">
			<div id="header">
				<div id="cms">
					<label>CMS</label>
				</div>
				<div class="dropdown">

					<img src="../Images/man-user.png" />
					<div class="dropdown-content">

						<a href="#"><img id="img-user-profile"
							src="../Images/man-user-black.png" /><span
							id="user-profile-span"> User Profile </span></a> <a href="#"><img
							id="img-user-logout" src="../Images/logout.png" /><span
							id="user-logout-span"> Logout </span></a>
					</div>
				</div>
			</div>
			<div class="dropdown" style="display: none">
				<ul>
					<li><a href="#"><img src="images/upload.png" alt="Upload" />
							Upload</a></li>
					<li><a href="#"><img src="images/messages.png"
							alt="Upload" /> Messages</a></li>

				</ul>
			</div>

			<div id="content">
				<div id="sidebar">
					<div id="search">

						<input type="text" name="search" placeholder="Search.."
							id="txt_search"> <input type="button" value="">

					</div>

					<div class="view_content">
						<img src="../Images/small-calendar.png" /> <label>View
							Content</label>
					</div>

					<div class="form_content">
						<img src="../Images/note.png" /> <label>Form Content</label>
					</div>

				</div>
				<div id="main_content">
					<div id="edit-profile">
						<h3>Add Content</h3>
					</div>
					<div id="form">


						<div id="lbl_profile">
							<label>Content Form Element</label>
						</div>
						<div id="main_form">

							<label>Title</label> <input type="text"
								placeholder="Enter the title" id="title"> <label>Brief</label>
							<textarea rows="4" cols="50" id="brief"></textarea>
							<label>Content</label>
							<textarea rows="6" cols="50" id="content"></textarea>
						</div>
						<div id="submit">
							<input type="submit" value="Submit Button"> <input
								type="button" value="Reset Button">
						</div>

					</div>

				</div>
			</div>
		</div>
	</form>
	<script type="text/javascript" src="../Script/add_content.js"></script>

</body>
</html>
`
file js
`/**
 * 
 */

function validate_add_content() {
    var Title = document.getElementById("title").value;
    var Brief = document.getElementById("brief").value;
    var Content = document.getElementById("content").value;
    var len_title = Title.length;
    var len_brief = Brief.length;
    var len_content = Content.length;
    var check=true;
    if (Title === "") {
		alert("Title is empty!");
		document.getElementById("title").style.borderColor = "RED";
		check = false;
	} else if (len_title < 10 || len_title > 200) {
		alert("Title is  between 10-200 characters long!");
		document.getElementById("title").style.borderColor = "RED";
		check = false;
	} else {
		document.getElementById("title").style.borderColor = "#ccc";

	}
    
    if (Brief === "") {
		alert("Brief is empty!");
		document.getElementById("brief").style.borderColor = "RED";
		check = false;
	} else if (len_brief < 30 || len_brief > 150) {
		alert("Brief is  between 30-150 characters long!");
		document.getElementById("brief").style.borderColor = "RED";
		check = false;
	} else {
		document.getElementById("brief").style.borderColor = "#ccc";

	}
    
    if (Content === "") {
		alert("Content is empty!");
		document.getElementById("content").style.borderColor = "RED";
		check = false;
	} else if (len_content < 50 || len_content > 1000) {
		alert("Brief is  between 50-1000 characters long!");
		document.getElementById("content").style.borderColor = "RED";
		check = false;
	} else {
		document.getElementById("content").style.borderColor = "#ccc";
		check=true;
		alert("ok");

	}
    return check;
}

Bạn nào giúp mình tìm lỗi sai với ạ? Cảm ơn mọi người

viết 11:37 ngày 01/10/2018

bạn phải nói nó bị j thì mới biết đc chứ, giờ f12 lên mở console là biết lỗi ngay :3

Vô Thin viết 11:28 ngày 01/10/2018

Bạn thử đưa đoạn JavaScript của bạn lên trên phần head thử xem sao nhé. Hoặc là để trực tiếp trong file HTML luôn mà khoan để ở một file .js riêng để khi chạy xem tại sao nó lại không alert gì cả, vì có lẽ có một lỗi lập trình nào đó trong code JS.

Sau khi nhìn qua về HTML thì yêu cầu bạn chủ topic kiểm tra lại các ID của các tag HTML bởi vì có vài cái (div và textarea) có id đều là content.

Bài liên quan
0