Editabillity of input fields

[Dick Honing]

Is there an option to make an input field non editable? Preferably, I'm looking for a mechanism to turn the editabillty on and off.

[Wassim]

Hello,

Not related to AppDrag but more HTML/CSS/JS knowledges, in jQuery which is loaded on your AppDrag website you can do it this way :

// disable
$(".your-selector-to-target-your-input").attr("disabled","disabled");
// enable
$(".your-selector-to-target-your-input").removeAttr("disabled");

(it works on all kind of inputs, dropdowns and textareas)

[Dick Honing]

@Wassim I finally got it to work. The main issue why this did not work earlier, is that I thought I was adding an ID to the input field through the Page Builder, whilst it was actually adding it to the surrounding element. I then went into the code and added id="ProductnaamInput to the input field manually. Finally, I added the following code to my onload routine:

    document.getElementById("ProductnaamInput").readOnly = true;

and voila!

And here is a definite feature request: being able ad a Cloud Backend (Indentification) ID to an input field via Page Builder!

The idea is behind this, is that I can build a form which can display data in read only mode, which can then be edited by clicking a button and finally saved to the database.

[Wassim]

@Dick-Honing said in Editabillity of input fields:

nding element. I then went into the code and added id="ProductnaamInput to the input field manually. Finally, I added the following code to my onload routine:

I think selecting your input this way would be easier:

$("#yourId input")

[Dick Honing]

@Wassim thanks for the tip! First I'm trying to learn Javascript basics and then I'll take a look ad jQuery ...

[Wassim]

You're welcome, it works in Vanilla Js too:

 document.querySelector("#yourId input");