Hello,

the bulma documentation says that you can disable a form partially or totally by enclosing the fields to be disabled in a

<fieldset disabled></fieldset>

tag.

I could find no way to change the disabled using the classes in htmlwidgets, I couldn't find a TJSHTMLFieldSet and TJSHTMLElement has no disabled attribute.

I cast it to a TJSHTMLButtonElement and it works, but, meh, I don't like it.

I added a "disabled" field to TJSHTMLElement (and removed it from all other descendant) and it also works.

I also don't like to have some elements using htmlwidgets and other elements using TJS*.

Is there a better, proper, way?

Bye

You can access ALL attributes using the properties property of TJSObject.

So if 'El' is your object instance then you can set disabled:

El.Properties['disabled']:='1';

it is also the default property so the following also works:

El['disabled']:='1';

The correct way is to introduce TJSHTMLFieldSet and declare the disabled property. As long as that class does not exist, see above.

Michael.

El 13/9/22 a les 16:33, Michael Van Canneyt ha escrit:

I tried that, and it doesn't work.
I want to disable the disabled, neither setting it to '0' or to 'false' works (i.e. the form is still disabled).
The other way round works though (i.e. I don't put the disabled in the html and set it to '1' in code).
Strange.

Bye

not strange. The attribute/property is there (regardless of the value), or it is not, you must use undefined if you wish to remove it:

El['disabled']:=undefined;

Michael.

El 13/9/22 a les 17:15, Michael Van Canneyt ha escrit:

silwebclient.lpr(88,31) Error: Incompatible types: got "JSValue"
expected "String"

Bye

El 13/9/22 a les 17:19, Luca Olivetti ha escrit:

But if I specify

   El.Properties['disabled']:=undefined;

it compiles and it works.
That's because I used a TJSHTMLElement which redefines Attrs as the default property. Confusing.

Bye

El 13/9/22 a les 16:33, Michael Van Canneyt ha escrit:

The correct way is to introduce TJSHTMLFieldSet and declare the disabled property. As long as that class does not exist, see above.

Hello,

for the time being I defined a TJSHTMLFieldSet class but since it isn't complete (I just exposed the 'disabled' attribute) I won't submit a patch.

My new question is why the T*Widget classes don't expose the underlying disabled attribute of the TJSHTMLElement that have it.

I suppose it's just lack of time.

Since the Element property is protected, I'm using an ugly class helper/class cracker combo (and using enabled rather than disabled because it's what normal lazarus controls have), see below.

A tangential question is, what should one use? T*Widgets or TJSHTMLElements?

---------------8<---------------8<---------------8<---------------8<--------

   TButtonEnabledHelper = class helper for TButtonWidget
   private
     function GetEnabled: boolean;
     procedure SetEnabled(AValue: boolean);
   public
     property enabled:boolean read GetEnabled write SetEnabled;
   end;
   TCrackButtonWidget = class(TButtonWidget)
   end;
function TButtonEnabledHelper.GetEnabled: boolean;
begin
  result:=not
TJSHTMLButtonElement(TCrackButtonWidget(self).element).disabled;
end;
procedure TButtonEnabledHelper.SetEnabled(AValue: boolean);
begin
  TJSHTMLButtonElement(TCrackButtonWidget(self).Element).disabled:=not
AValue;
end;

---------------8<---------------8<---------------8<---------------8<--------

Bye

Correct.

Patches accepted, obviously.

Michael.

El 28/9/22 a les 20:08, Michael Van Canneyt via Pas2js ha escrit:

That's what I thought.
I suppose I can easily patch TButton (and other components like it when I need them), but do you think it's better to use "enabled" (like a normal lazarus control) or "disabled" (what the underlying html element has)?

The second question (T*Widgets vs. TJSHTMElements) is still unanswered ;-)

Bye

Stay as close as possible to the underlying element, so 'disabled' seems best.

The second question (T*Widgets vs. TJSHTMElements) is still unanswered ;-)

It cannot be answered in general: it depends on your needs.

For more complicated projects I personally use the widgets because they automate many tasks. The ability to work with a TDatamodule/"TForm" and data aware stuff are time-savers, they do not exist for simple elements.

For simple projects, the elements are sufficient; The tool to create a "form" definition based on a HTML file makes it easy to work with them, but you must then manually implement a lot of things using HTML things such as querySelectorAll.

Michael.

El 29/9/22 a les 20:04, Michael Van Canneyt via Pas2js ha escrit:

Stay as close as possible to the underlying element, so 'disabled' seems best.

OK, done
https://gitlab.com/freepascal.org/fpc/pas2js/-/merge_requests/24

Too much: I just had to change a TImageWidget to a TJSHTMLImageElement because the former set the width and height of the img element to 0 :-(

Bye

Thank you!

I probably didn't notice since I always have set the sizes. But I'll change the implementation to ignore 0 sizes.

Michael.