Estoy programando en PHP y necesito habilitar unos campos de un formulario cuando le de a un botón, para esto he creado una función con JavaScript pero no se habilita nada solo aparece en mi URL: "http://localhost/ecomerce/sistema/nuevafactura.php#" No sé que podría estar mal. Aquí está el formulario: La clase es btn_new_cliente El botón para que al que le tengo que dar es a Nuevo Cliente
<h4>Datos del Cliente</h4>
<a href="#" class="btn-new btn_new_cliente">Nuevo Cliente</a>
</div>
<form name="form_new_cliente_venta" id="form_new_cliente_venta" class="datos">
<input type="hidden" name="action" value="addCliente">
<input type="hidden" name="idCliente" id="idCliente" value="" required>
<div class="wd30">
<label>DNI</label>
<input type="text" name="dni_cliente" id="dni_cliente" class="dni_cliente">
</div>
<div class="wd30">
<label>Nombre</label>
<input type="text" name="nom_cliente" id="nom_cliente" disabled required><!--Está desactivado-->
</div>
<div class="wd30">
<label>Teléfono</label>
<input type="number" name="tel_cliente" id="tel_cliente" disabled required>
</div>
<div class="wd100">
<label>Dirección</label>
<input type="text" name="dir_cliente" id="dir_cliente" class="dir_cliente" disabled required>
</div>
<div class="wd100">
<label>Localidad</label>
<input type="text" name="loc_cliente" id="loc_cliente" disabled required>
</div>
<div class="wd100">
<label>Provincia</label>
<input type="text" name="pro_cliente" id="pro_cliente" disabled required>
</div>
<div class="wd100">
<label>País</label>
<input type="text" name="pai_cliente" id="pai_cliente" disabled required>
</div>
<div id="div_registro_cliente" class="wd100">
<button type="submit" class="btn_save">Guardar</button>
</div>
</form>
</div>
Aquí está mi función de JavaScript para quitar el atributo disabled:
$(document).ready(function(){
$('.btn_new_cliente').click(function(e){
e.preventDefault();
$('#nom_cliente').removeAttr('disabled');
$('#tel_cliente').removeAttr('disabled');
$('#dir_cliente').removeAttr('disabled');
$('#loc_cliente').removeAttr('disabled');
$('#pro_cliente').removeAttr('disabled');
$('#pai_cliente').removeAttr('disabled');
$('#div_registro_cliente').slideDown();
});
});
Muchas gracias de antemano.
<a>
? Usa otro tipo de elemento más apropiado, como un<input>
o directamente<button>
. Saludos<a>
y cambiarlo por un<button>
, quizá te convenga también revisar el tema del teléfono tratado como número. Y también, para simplificar cosas, podrías utilizar clases para todos esos ìnput` bloqueados (por ejemplo añadiendoclass="bloqueo_en_edicion"
) y después utilizarla cuando pulsen el botón, poniendo$(".bloqueo_en_edicion").removeAttr('disabled')
en lugar de todas esas instrucciones repetidas. Y además así sería más sencillo añadir algún campo en el futuro.