How do I detect all changes in an input type of a form?

Question

How do I detect all changes in an input type of a form?

Navigation

#1 by (4 votes)

2

Hi, I have this form:

		function balidatu(){
			var pas1 = $("#pass").val();
			var pas2 = $("#passC").val();
			if(pas1 != pas2){
				alert("Pasahitzak berdinak izan behar dira.");
				return(false);
			}else{
				return(true);
			}
		}
		$(document).ready(function(){
			$("#pass").change(){
				$("#posta").val("JAJAJAJAJA");
			}
		});

  <div id='page-wrap'>
	<span><a href='../HTML5/layout.html'>Atzera</a></span> <br><br>
	
	<h2>Quiz: crazy questions</h2>
    
	<div>
			<form id="galderenF" name="galderenF" method="post" action="signUp.php" onsubmit="return balidatu()">
				
				<label for="posta"><strong>Posta (*):</strong></label>
				<input type="email" name="posta" id="posta" placeholder="Zure posta"  pattern="[a-zA-Z]{2,}[0-9]{3}@ikasle\.ehu\.(eus|es)"  required/><br>
			 
				<label for="deitura"><strong>Deitura (*):</strong></label>
				<input type="text" name="deitura" minlength="10" id="galdera" placeholder="Zure deitura" required/><br>
				
				<label for="nick"><strong>Nick (*):</strong></label>
				<input type="text" name="nick" id="erantzunZuzena" placeholder="Zure nick-a" required/><br>
				
				<label for="pasahitza" ><strong>Pasahitza (*):</strong></label>
				<input type="password" name="pasahitza" minlength = "6" id="pass" placeholder="Pasahitza" required/><br>
				
				<label for="pasEr" ><strong>Pasahitza Errepikatu (*):</strong></label>
				<input type="password" name="pasahitzaRep" minlength = "6" id="passC" placeholder="Pasahitza errepikatu" required/><br>
				
				<input class="botoia" type="submit" id="botoia1" value="Erregistratu" />
				<input class="botoia" type="reset" id="botoia2" value="Reset" />
				<div id="aster" ><strong> * | Nahitaezko hutsuneak </strong></div><br><br>
				
			</form>
				<div id = "ezkutatu1" style = 'display:block'>Posta egiaztatzen...  </div>
				<div id = "erakutsiEgiaBada1" style = 'display:none'> Posta onargarria da </div> 
				<div id = "erakutsiGezurraBada2" style = 'display:none'> Posta existitzen da WSan </div> 
				
				<div id = "ezkutatu2" style = 'display:block'> Pasahitza egiaztatzen... </div>
				<div id = "erakutsiEgiaBada2" style = 'display:none'> Pasahitza onargarria da </div>
				<div id = "erakutsiGezurraBada2" style = 'display:none'> Pasahitza ez da onargarria da </div>
</div>

What I want to do is that every time a character is changed in Pasahitza (password) read a file (which I will implement later when I know how to detect these changes).

I have tried the change () function of jQuery but it does not work, I do not know if it is because change () is not valid for what I want or if something is wrong.
Greetings.

javascript jquery

asked by Mikel Molinuevo 21.11.2017 в 15:05

source

1 answer

Delete a file with all its contents in Python Take the value of the operator to perform javascript operations

score 4 · Accepted Answer

About your concern it is better to use with jquery on, since the .click and .change are being discontinued, therefore if you need to generate a serious listener in the following way:

$("#tuID").on("change",function(){
  // aqui va el codigo que requieres hacer cuando se genere algun cambio....
});

It is important to generate this behavior within the ready that is, it would be something like this:

$(function() {
  // Handler for .ready() called.
  $("#tuID").on("change",function(){
  // aqui va el codigo que requieres hacer cuando se genere algun cambio....
  });
});

The idea is that the input you make the listener will be listening to the changes you make; It is also important to contemplate the possibility that you generate the input dynamically with append, so if any input you do so keep in mind that the listener would be set up in the following way:

$(document).on("change","#tuID",function(){
   // aqui va tu codigo cuando generas un input dinamico y que se le pueda
   // incluir un listener.
});

Greetings, I hope you find it useful.