[SOLUCIONADO] Validar contraseña de un formulario y mensaje de error

[zerobathory]

Hola, buenas tardes, acudo a ustedes porque no se que estoy haciendo mal, estoy haciendo un sistema en el que se pueden crear usuarios con un formulaio, tengo dos campos que son contraeña y confirmar contraseña, los cuales quiero que cuando se cambie de el de confirmar contraseña a otro, valide mediante javascript si las contraseñas son iguales o no, en caso de que no sean iguales, el campo de confirmar contraseña lo va a cambiar por uno que tiene el estilo de error y un mensaje diciendo "las contraseñas no coinciden, es decir

Que pase de:

Código:

<label>Confirmar contraseña</label>
<input name="pass2" type="password" class="form-control">

A:

Código:

<label class="control-label" id="inputError">Lasc ontraseñas no coinciden</label>
<input name="pass2" class="password" class="fomr-control" id="inputError">

Con el codigo anterior, lo que deberia pasar, es que el input mediante estilo css que ya tengo, va a tomar un contorno en rojo, y el mensaje de "Las contraseñas no coinciden" van a estar tambien en color rojo.
Para tratar de hacer eso tengo la siguiente funcion, pongo el codigo completo incluyendo el formulario:

Código:

<script>
	function validarpsw(){
		var p1 = document.frm.elements.namedItem("pss1").value;
		var p2 = document.frm.elements.namedItem("pss2").value;
		if(p1 != p2){
			var errorrem = document.getElementById("confirmapass");
			var error = document.createElement("label");
			error.setAttribute("class", "control-label");
			error.setAttribute("for", "inputError");
			var texto = document.createTextNode("Las contraseñas no coinciden"); 
			error.appendChild(texto);
			var confirmcon = document.createElement("input");
			var pass2 = document.frm.elements.namedItem("pass2");
			confirmcon.setAttribute("type", "password");
			confirmcon.setAttribute("name", "pass2");
			confirmcon.setAttribute("value", pass2.value);
			confirmcon.setAttribute("class", "form-control");
			confirmcon.setAttribute("id", "inputError");
			errorrem.parentNode.replaceChild(error, errorrem);
			pass2.parentNode.replaceChild(confirmcon, pass2);
		}
	}
<script>
<form role="form" method="post" action="validanusuario.php" name="frm">
<label>Contrase&ntilde;a</label>
     <input type="password" class="form-control" name="pass1">
<label id="confirmapass">Confirmar Contrase&ntilde;a</label>
      <input type="password" class="form-control" name="pass2" onChange="validarpsw()">
</form>

Con esto al poner contraseñas que no coinciden en ambos campos, y pasar de el campo confirmar contraseña a otro, no pasa nada, no se que estoy haciendo mal, si pueden ayudarme por favor

[zerobathory]

Tipico que nadie responde, en los ultimos temas que he hecho de problematica, nadie me ha ayudado y siempre termino yo poniendo la solucion que encontre, en fin, el unico problema es que en la parte

Código:

var p1 = document.frm.elements.namedItem("pss1").value;
		var p2 = document.frm.elements.namedItem("pss2").value;

Los "pss1" y "pss2" estaba mal, me falto agregarles una "a" ya que lo tengo como name="pass2" dentro de mi input, en fin, algo tan sencillo que nadie pudo ayudar, ya que. Lo mejore un poco incluyendo mi estilo para que sea mas facil mostar el mensaje de error, quedo asi:

Código:

<script>
	function validarpsw(){
		var p1 = document.frm.elements.namedItem("pass1").value;
		var p2 = document.frm.elements.namedItem("pass2").value;
		if(p1 != p2){
			var errorrem = document.getElementById("confirmapass");
			var error = document.createElement("label");
			error.setAttribute("class", "control-label");
			error.setAttribute("for", "inputError");
			var texto = document.createTextNode("-Las contraseñas no coinciden"); 
			error.appendChild(texto);
			errorrem.parentNode.replaceChild(error, errorrem);
			document.getElementById("anade").setAttribute("class", "form-group has-error");
		}
	}
<script>

<div id="anade">
<form role="form" method="post" action="validanusuario.php" name="frm">
<label>Contrase&ntilde;a</label>
     <input type="password" class="form-control" name="pass1">
<label id="confirmapass">Confirmar Contrase&ntilde;a</label><span id="confirmapass"></span>
      <input type="password" class="form-control" name="pass2" onChange="validarpsw()">
</form>
</div>

[caricatos]

Hola:

Iniciado por zerobathory

Tipico que nadie responde, en los ultimos temas que he hecho de problematica, nadie me ha ayudado y siempre termino yo poniendo la solucion que encontre,...

Creo que no es justo que nos cuentes tus "rabietas" porque en unas pocas horas no te hayan contestado...

Digo yo, no sería mejor tener el mensaje oculto y simplemente mostrarlo en la validación...

mensaje_error.style.display = (pass1 == pass2) ? "block":"none";

y deshabilitar el botón submit (que supongo que habrá) en caso de fallo...

boton_submit.disabled = (pass1 != pass2);

Saludos