Block form if values are repeated

Question

Block form if values are repeated

Navigation

#1 by (0 votes)

1

I have this form where I have the fields bl and bl2 where I compare if the data are the same, and if they are not, send me an alert, but I would like you not to send the information in addition to the alert.

<script type="text/javascript">
function comprobarClave(){ 
   	bl = document.caso.bl.value 
   	bl2 = document.caso.bl2.value 

   	if (bl != bl2) 
      	alert("Las dos BL Diferentes") 
   	 
} 
</script>

<form action="" method="post" autocomplete="off" name="caso"><table width="1151" height="155" border="0" cellspacing="0">
      <tr>
        <td>BL/BOOKING:</td>
        <td>&nbsp;</td>
        <td><label for="bl"></label>
          <input type="text" name="bl" id="bl" required="required" /></td>
        <td>&nbsp;</td>
        <td>BL/BOOKING:</td>
        <td>&nbsp;</td>
        <td><label for="fech">
          <input type="text" name="bl2" id="bl2" required="required" />
        </label></td>
        <td>&nbsp;</td>
        <td>Fecha:</td>
        <td>&nbsp;</td>
        <td><label for="fech">
          <input type="date" name="fech" id="fech" required="required" />
        </label></td>
        </tr>
      <tr>
        <td>Nombre del cliente:</td>
        <td>&nbsp;</td>
        <td><input type="text" name="textfield2" id="nom_cli" /></td>
        <td>&nbsp;</td>
        <td>Codigo del cliente:</td>
        <td>&nbsp;</td>
        <td><input type="text" name="cod_cli" id="cod_cli" required="required"/></td>
        <td>&nbsp;</td>
        <td>Origen:</td>
        <td>&nbsp;</td>
        <td><label for="Destino">
          <input type="text" name="fech2" id="fech2" required="required" />
        </label></td>
      </tr>
      <tr>
        <td>Cantidad de items/cont:</td>
        <td>&nbsp;</td>
        <td><label for="cant"></label>
          <input type="number" name="cant" id="cant" min="1"/>      <label for="textfield2"></label></td>
        <td>&nbsp;</td>
        <td>Almacenamiento:</td>
        <td>&nbsp;</td>
        <td><label for="alm"></label>
          <input type="date" name="alm" id="alm" /></td>
        <td>&nbsp;</td>
        <td>Retención:</td>
        <td>&nbsp;</td>
        <td><label for="ret"></label>
          <input type="date" name="ret" id="ret" /></td>
        </tr>
      
      </table>
      <p>&nbsp;</p>
      <p>
        <input type="submit" class="button" name="send"  value="Guardar"  onClick="comprobarClave()" />
      </p>
  </form>

javascript html

asked by Leonardo 08.10.2017 в 06:16

source

1 answer

Initialize fixes of objects in C ++ What is the best way to use setter methods with objects? [closed]

score 0 · Answer 1

You can use the attribute onsubmit of the form, placing a function js that will be invoked when it is sub-qualified when you click the button.

The function should return true or false depending on whether you want to submite or not the form.

function comprobarClave(){ 
  let bl = document.getElementById('bl').value;
  let bl2 = document.getElementById('bl2').value;
  if (bl != bl2){
     alert("Las dos BL Diferentes, no se submiteará el form") 
     return false;
  }else{
      alert("Las dos BL iguales, se submiteará el form") 
      return true;
   }
}

<form action="" method="post" onsubmit = "return comprobarClave();" autocomplete="off" name="caso"><table width="1151" height="155" border="0" cellspacing="0">
      <table>
        <tr>
          <td>BL/BOOKING:</td>
          <td>&nbsp;</td>
          <td><label for="bl"></label>
            <input type="text" name="bl" id="bl" required="required" /></td>
          <td>&nbsp;</td>
          <td>BL/BOOKING:</td>
          <td>&nbsp;</td>
          <td><label for="fech">
            <input type="text" name="bl2" id="bl2" required="required" />
          </label></td>     
        <tr>
      </table>
      <p>
        <input type="submit" class="button" name="send"  value="Guardar" />
      </p>
  </form>