How to disable an input after submitting form data?

Hello, I would like to know how I can disable text fields when submitting form data, that is, when I click on the button, these can be automatically disabled.

Actually, when sending the data the field is disabled (since I have said sending with an ajax to avoid the refresh of the page). But when reloading the page on my own, the form does not take the “lock” that if it was done previously, that is, the field is re-enabled, how can I leave it permanently blocked or disabled after sending the data that is added in the input?

I have tried to do it with javascript by means of this simple method:

Javascript:

let titulo = document.getElementById("titulo");
if(titulo){
        titulo.disabled = true;
    }else{
        titulo.disabled = false;
    }

View

<div class="form-group row">
   <label for="titulo" class="col-sm-3 col-form-label">Titulo</label>
   <div class="col-sm-8">
   <input type="text" class="form-control" id="titulo"
    placeholder="" value="{{$user->titulo}}">
    </div>
</div>
<div class="form-group row">
 <div class="offset-sm-3 col-sm-8" id="div_confirmacion2">
   <button type="submit"
    class="btn indigo white-text text-bold float-right"
    id="update_datos_comple">
    Guardar cambios
    </button>
  </div>

Right, let’s cover Basic Rule #3:

Never use Javascript as your sole security feature.

Now that that’s out of the way; persisting data between pageloads in Javascript will be categorized as localStorage or sessionStorage, depending on your length-of-life.

localStorage lives forever (until removed), sessionStorage lives until the browser is closed.

Both of them are derived from the same class (Storage), both objects exist in all reference scopes at all times, and carry three primary accessor functions: .setItem(key,value), .getItem(key), and .deleteItem(key).

When you submit the form, set the appropriate value into the appropriate object, and disable the form fields. On load, check the storage for the value, and if present, disable the form fields (or perhaps slightly more securely, check for the absence of the key, and enable the form fields.)

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.