Validação com JQuery não funciona - Apostila VRaptor FJ-28

Front-end
#1

Boa noite, estou estudando a apostila do VRaptor e parei no capitulo 11 onde mostra uma validação com JQuery.
Baixei o arquivo Validation.
Segue o arquivo formulario.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<script type="text/javascript" src="D:\Caderno Fafism\Arquivos do Curso\JQuery\jquery-1.7.2.min.js"> </script>
<script type="text/javascript" src="D:\Caderno Fafism\Arquivos do Curso\JQuery\jquery.validate.min.js"> </script>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

<script type="text/javascript">
	$('#produtos_form').validate();
</script>

</head>
<body>
<form id="produtos_form" action="<c:url value="/produtos"/>" method="POST">
	<fieldset>
		<legend>Adicionar produtos</legend>
		
		<label for="nome">Nome.: </label>
		<input id="nome" class="required" minlength="3" type="text" name="produto.nome" value="${produto.nome}"/> <br/><br/>
		
		<label for="descricao">Descrição.: </label>
		<textarea id="descricao" class="required" maxlength="40" type="text" name="produto.descricao">${produto.descricao}</textarea><br/><br/>
		
		<label for="preco">Preço.: </label>
		<input id="preco" type="text" class="required" min="0" name="produto.preco" value="${produto.preco}"/><br/><br/>
		
		<button type="submit">Enviar</button>
		
	</fieldset>
</form>

</body>

</html>

O metodo que esta em meu controller

        @Post
	@Path("/produtos")
	public void adiciona(Produto produto)
	{
		obj_produtoDao.salva(produto);
		result.redirectTo(ProdutosController.class).lista();
		
	}

Nunca usei JQuery, gostaria de saber se preciso fazer mais alguma coisa ou o pq desses codigos não estarem funcionando?
Aguardo e muito obrigado pela ajuda.

#2

Oi paulo.furtado,

Dentro do seu projeto, na pasta WebContent, crie a pasta com o nome de javascript.

Depois, coloque os arquivos do jquery que vc quer usar para dentro desta pasta.

E no seu jsp, insira a seguinte linha

<script type="text/javascript" src="<c:url value="/javascripts/jquery-1.7.2.min.js"/>"></script>
<script type="text/javascript" src="<c:url value="/javascripts/jquery.validate.min.js"/>"></script>

Imagino que isso já baste para fazer funcionar.

#3

não funcionou.
o engraçado é que nem um alert acontece quando carrego a página.
parece que o jquery não roda.

#4

Isso é um pouco estranho…

Tente modificar seu javascript para o seguinte:

$("#produtos_form").validate({		
		rules: {
			"produto.nome" : {
				required: true,
				minlength: 3 
			},
			
			"produto.descricao" : {
				required: true,
				maxlength: 40
			},
			
			"produto.preco" :{
				min: 0.0
			}
			
		}
	});
#5

Poxa, agora funcionou, ficou mt bom.
só mais uma coisa, tem como traduzir essas validalçoes, pq o texto esta aparecendo em ingles, tem como traduzir ou personalizar?

Muitoo obrigado mesmo pela ajuda.

#6

Oi paulo.furtado,

Que bom que funcionou! :smiley:

Tem como mudar sim, é só adicionar as mensagens no código.

Segue um exemplo:

$("#produtosForm").validate({		
		rules: {
			"produto.nome" : {
				required: true,
				minlength: 3 
			},
			
			"produto.descricao" : {
				required: true,
				maxlength: 40
			},
			
			"produto.preco" :{
				min: 0.0
			}

                messages : {
                   "produto.nome" : "Nome obrigatório",
                   "produto.descricao" : "Descrição obrigatória.",
                   "produto.preco" : "Defina um preço."
               }
			
		}
	});

Bons estudos!

#7

Show de bola.
Muito obrigado mesmo pela ajuda.
ja estava ficando doido com isso.
Bons estudos e continue ajudando porque é muito bom quando se esta perdido e encontra ajuda.
Fica com Deus.

#8