Jump to content
marcelobbt

Validação em campos adicionados

Recommended Posts

Estou montando um form que acrescenta alguns campos mais esses campos que são acrescentados não consigo fazer funcionar a validação.

 

Obs: Se eu colocar o campo no html as regras de validação funcionam, mas se eu acrescento via botão ele não funciona.

 

html:

<div class="row"  ng-app="acidente">
	<div class="col-sm-12">
		<h2>Cadastrar Acidente</h2>
		<p>Empresa: <?php echo '<strong>'.$mensal->__get('empresa').'</strong>&nbsp;&nbsp;-&nbsp;&nbsp;Período:'.$mensal->__get('mes').'/'.$mensal->__get('ano'); ?></p>
		<form class="form-horizontal" name="acidenteForm" novalidate action="http://www.google.com">
			<div class="form-group">
				<label class="col-sm-2 control-label">Dia do Acidente<span class="vermelho">*</span>:</label>
				<div class="col-sm-10">
					<input type="number" name="diaform" class="form-control" ng-model="diaform" required dia-Acidente>
					&nbsp;&nbsp;<span class="vermelho" ng-show="acidenteForm.diaform.$invalid && acidenteForm.diaform.$dirty">O dia do acidente deve ser um número válido.</span>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">Descrição do Acidente<span class="vermelho">*</span>:</label>
				<div class="col-sm-10">
					<textarea name="descricaoform" class="form-control" required ng-model="descricaoform" rows="5"></textarea>
					<p class="vermelho" ng-show="acidenteForm.descricaoform.$invalid && acidenteForm.descricaoform.$dirty">Favor preencher a descrição do acidente.</p>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">Recomendações do Acidente:</label>
				<div class="col-sm-10">
					<textarea name="recomendacaoform" class="form-control" rows="5"></textarea>
				</div>
			</div>
			<span ng-controller="AdicionarController">
				<div class="form-group">
					<label class="col-sm-2 control-label">Adicionar acidentado:</label>
					<div class="col-sm-10">
						<input type="button" class="btn btn-success" ng-click="AdicionarCampos()" name="adicionarAcidentado" value="+">
					</div>
				</div>
				<div id="maisCampos">
					
				</div>
			</span>
			

			<p><span class="vermelho">*</span> campos de preenchimento obrigatório</p>
			<div class="form-group">
				<label class="col-sm-2 control-label">&nbsp;</label>
				<div class="col-sm-10">
					<input type="submit" class="btn btn-success" name="cadastrar" ng-disabled="acidenteForm.$invalid" value="Enviar">
				</div>
			</div>
		</form>
	</div>
	<script src="<?php echo base_url(); ?>js/angular.min.js"></script>
	<script src="<?php echo base_url(); ?>js/acidente.js"></script>
</div>

 

acidente.js

var app = angular.module('acidente', []);
app.directive('diaAcidente', function() {
    return { 
        require: 'ngModel',
        link: function(scope, element, attr, mCtrl) {
            function myValidation(value) {
                if (value > 0 && value < 32) {
                    mCtrl.$setValidity('charE', true);
                } else {
                    mCtrl.$setValidity('charE', false);
                }
                return value;
            }
            mCtrl.$parsers.push(myValidation);
        }
    };
});
 var adicionar = []; 
 var i = 0;
app.controller('AdicionarController', function($scope) {
	$scope.AdicionarCampos = function () {
        ordinal = i+1;
        adicionar.push('<p><strong>'+ordinal+'º acidentado</strong></p>');
        adicionar.push('<div class="form-group"><label class="col-sm-2 control-label">Matrícula:</label><div class="col-sm-10"><input type="number" name="matriculaform'+i+'" class="form-control"></div></div>');
        adicionar.push('<div class="form-group"><label class="col-sm-2 control-label">Previsão de Alta<span class="vermelho">*</span>:</label><div class="col-sm-10"><input type="date" name="previsaoform'+i+'" id="previsaoform'+i+'" class="form-control" required ng-model="previsaoform'+i+'">&nbsp;&nbsp;<span class="vermelho" ng-show="acidenteForm.previsaoform'+i+'.$invalid && acidenteForm.previsaoform'+i+'.$dirty">Favor informar a previsao da alta.</span></div></div>');
        document.getElementById("maisCampos").innerHTML = adicionar;
        i = i + 1;
    };
});

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Rogerio Pancini
      Bom dia pessoal.
       
      Fui ajustando um script para enviar e-mails com Ajax e Php.
      Está funcionando muito bem o envio e uma coleta de informações que faço após o envio.
      Para ficar 99% certo, falta um detalhe no Validate, que uso no formulário de contato.
       
      Parece que ele funciona em conjunto com o script de envio e não após fazer a validação.
       
      Se eu usar " submitHandler " (como no exemplo da documentação)
      $("#myform").validate({ submitHandler: function(form) { // some other code // maybe disabling submit button // then: $(form).submit(); } }); Parece que o formulário dá problema no focus, para de clicar, sei lá.
       
      Vou colocar o que fiz aqui.
      Se alguém tiver alguma sugestão desse detalhe, eu agradeço.
       
      <!-- Formulário de contato --> <form name="form_contato" id="form_contato" method="post" action=""> <div class="row"> <div class="col-md-12"> <div class="form-field"> <input type="text" placeholder="Nome" id="nome" name="nome"> </div> </div> <div class="col-md-12"> <div class="form-field"> <input type="tel" placeholder="Telefone" id="telefone" name="telefone"> </div> </div> <div class="col-md-12"> <div class="form-field"> <input type="email" placeholder="E-mail" id="email" name="email"> </div> </div> <div class="col-md-12"> <div class="form-field"> <input type="text" placeholder="Assunto" id="assunto" name="assunto"> </div> </div> </div> <div class="form-field"> <textarea placeholder="Mensagem" rows="4" id="mensagem" name="mensagem"></textarea> </div> <div class="row"> <div class="col-md-6"> <div class="form-button text-left"> <div class="form-tip"> <div class="g-recaptcha" data-sitekey="<?php echo $chave_de_site_sel; ?>"></div> </div> </div> </div> <div class="col-md-6"> <div class="form-button text-right text-center-mobile"> <button type="submit" class="readon">Enviar</button> <input type="hidden" name="enviar" value="ok" /> </div> </div> </div> <div class="text-center" id="post_email" style="display: none; "> <div class="alert alert-warning mt-30" role='alert'>Aguarde, enviando o e-mail...</div> </div> </form> /****** Validate ******/ $().ready(function() { $("#form_contato").validate({ rules: { nome: "required", email: {required: true, email: true}, telefone: "required", assunto: "required", mensagem: "required", }, messages: { nome: "Informe seu nome", email: {required: "Informe o e-mail", email: "Informe um e-mail válido"}, telefone: "Informe o telefone", assunto: "Informe o assunto", mensagem: "Envie uma mensagem" } }); }); /****** Validate ******/ /****** Ajax ******/ $('#form_contato').on('submit', function (e) { e.preventDefault(); const nome = $('input[name="nome"]').val(); const telefone = $('input[name="telefone"]').val(); const email = $('input[name="email"]').val(); const assunto = $('input[name="assunto"]').val(); const mensagem = $('textarea[name="mensagem"]').val(); const g_recaptcha_response = $('#g-recaptcha-response').val(); $('#post_email').css({ 'display': "block" } ); $.ajax({ type: 'post', url: '<?php echo $dir_base; ?>php/post/contato.php', data: {nome: nome, telefone: telefone, email: email, assunto: assunto, mensagem: mensagem, g_recaptcha_response: g_recaptcha_response}, success: function(response) { var data = $.parseJSON(response); if (data.status == 10) { swal({ title: "Enviado", text: "Agradecemos seu contato!", confirmButtonColor: "#007ca8", type: "success" }); $("#form_contato")[0].reset(); grecaptcha.reset(); $('#post_email').css({ 'display': "none" } ); }else if (data.status == 20) { swal({ title: "Oopss...", text: "Ocorreu um problema ao concluir o envio do e-mail", confirmButtonColor: "#e74c3c", type: "error" }); grecaptcha.reset(); $('#post_email').css({ 'display': "none" } ); }else if (data.status == 30) { swal({ title: "Oopss...", text: "O reCAPTCHA não foi habilitado", confirmButtonColor: "#e74c3c", type: "error" }); grecaptcha.reset(); $('#post_email').css({ 'display': "none" } ); }else if (data.status == 40) { swal({ title: "Oopss...", text: "Ocorreu um problema ao acessar o banco de dados", confirmButtonColor: "#e74c3c", type: "error" }); grecaptcha.reset(); $('#post_email').css({ 'display': "none" } ); }else { swal({ title: "Oopss...", text: "Ocorreu um erro ao enviar a mensagem", confirmButtonColor: "#e74c3c", type: "error" }); grecaptcha.reset(); $('#post_email').css({ 'display': "none" } ); } } }); }); /****** Ajax ******/ O post do PHP é meio grande, se for necessário eu coloco ele também.
       
      Muito obrigado
    • By juniormatrix
      Bom dia!
       
      Tenho este código:
       
      $("#formulario").validate({ ignore: [], rules: { nome:{required: true}, contato:{required: true}, telefone:{required: true}, cidade:{required: true}, email:{required: true, email: true}, mensagem:{required: true}, }, });  
      Funciona perfeitamente.
       
      Mas pretendo adicionar um campo oculto no meu formulário nomeado "url" e preciso que o código acima faça a seguinte lógica:
       
      Se o campo "url" estiver preenchido, não faz nada, ou seja, não envia a mensagem; Se estiver vazio, executa o script e envia a mensagem.
       
      Minha intenção é evitar o envio de Spam. Se alguém pude me ajudar, fico grato. E se eu estiver fazendo da forma errada, por favor me avisem.
       
      PS.: vou ser sincero, gostaria do código pronto. Sei que tem bastante conteúdo na internet, mas não tenho interesse em aprender a fazer, pois meu trabalho principal é mais na parte de design. Estou tendo que fazer o serviço de outra pessoa.
       
      Agradeço desde já!
    • By juniormatrix
      Bom dia!
       
      Tenho este código:
       
      $("#formulario").validate({ ignore: [], rules: { nome:{required: true}, contato:{required: true}, telefone:{required: true}, cidade:{required: true}, email:{required: true, email: true}, mensagem:{required: true}, }, });  
      Funciona perfeitamente.
       
      Mas pretendo adicionar um campo oculto no meu formulário nomeado "url" e preciso que o código acima faça a seguinte lógica:
       
      Se o campo "url" estiver preenchido, não faz nada, ou seja, não envia a mensagem; Se estiver vazio, executa o script e envia a mensagem.
       
      Minha intenção é evitar o envio de Spam. Se alguém pude me ajudar, fico grato. E se eu estiver fazendo da forma errada, por favor me avisem.
       
      PS.: vou ser sincero, gostaria do código pronto. Sei que tem bastante conteúdo na internet, mas não tenho interesse em aprender a fazer, pois meu trabalho principal é mais na parte de design. Estou tendo que fazer o serviço de outra pessoa.
       
      Agradeço desde já!
    • By Webster Moitinho
      Estou desenvolvendo localmente em PHP5 mas hospedando na Web com PHP7. Fiz meu formulário, minhas regras de validação de cada campo, e para validar o email tinha usado o eregi() que está obsoleto e foi removido no PHP7. Agora não consigo fazer a validação. Estou tentando cpm preg_match(). Meu código antes estava assim:
      if (!eregi("^[a-z0-9_\.\-]+@[a-z0-9_\.\-]*[a-z0-9_\-]+\.[a-z]{2,4}$", $valor)) { echo "Preencha com um email válido"; } reescrevi para ele ficar assim
      if(preg_match("/^([[:alnum:]_.-]){3,}([[:lower:][:digit:]_.-]{3,})(.[[:lower:]]{2,3})(.[[:lower:]]{2})?$/", $valor)) { echo "Preencha com um email válido"; } mas não está dando certo...
    • By Rodrigo5468
      Boa tarde a todos.
       
      Estou desenvolvendo um sistema de registro para fins de estudos, mas tenho algumas dúvidas e dificuldades até. Estou usando "programação orientada a objetos", e quero validar alguns campos do meu registro, se puderem me auxiliar, será de grande ajuda.
       
      Meu Diretório:
      Projeto1/ ├── backend/ │ ├── classes/ │ │ ├── Register.php ├── index.php Em Register.php tenho o seguinte código para fazer a validação, mas acredito que estou fazendo algo de errado.
      public function setUsername($username) { $sql = "SELECT * FROM $this->table WHERE username = :username"; $stmt = Database::prepare($sql); $stmt->execute(array('username' => $_POST["username"])); if(empty($_POST["username"])) { return "O campo usuário não pode ser vázio."; }elseif(ctype_space($_POST["username"])) { return "Não pode usar apenas espaços no campo de usuário."; }elseif(strlen($_POST["username"] < 3)) { return "É necessário no mínimo 3 (três) caracteres no usuário."; }elseif(strlen($_POST["username"] > 15)) { return "O máximo é de 15 (quinze) caracteres no usuário."; }elseif(preg_match("/^[a-zA-Z0-9]*$/", $_POST["username"] == 0)) { return "O nome de usuário só pode conter letras e números. (sem espaços e sem caracteres epeciais)"; }elseif($stmt->num_rows !== 0) { return "O nome de usuário já está cadastrado em nossos bancos de dados."; }else { $this->username = $username; } } E no index.php tenho o seguinte código, acredito que está certo, mas eu gostaria de mostrar as mensagens de erros que estão no Register.php, como que posso fazer isso?
      $register = new Registers(); if(isset($_POST["cadastrar"])) { $username = $_POST["username"]; $email = $_POST["email"]; $password = $_POST["password"]; $register->setUsername($username); $register->setEmail($email); $register->setPassword($password); if($register->insert()) { return "Usuário cadastrado com sucesso."; } }  
       
      Obrigado pela atenção!
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.