Icon View Thread

The following is the text of the current message along with any replies.
Messages 1 to 10 of 10 total
Thread Setting a DOM ID for a form input element
Thu, May 3 2018 6:39 PMPermanent Link

Stephen P

Prokon Software Consultants (Canada) Ltd.

I am trying to access the value of a form input element. Let's say the input element's name is Edit1. To get its value, I use getElementById as follows:

   InputElement := THTMLInputElement(window.document.getElementById('special-id'));
   CurrentValue := InputElement.value;


Since EWB does not assign a DOM ID, I need to assign one myself earlier in the program flow. I do this with

   Edit1.ClientId := 'special-id';


I find that Edit1.ClientId does not assign the DOM ID to the text input element, but rather to a parent (surrounding) div. As a result InputElement.value returns a blank value. It seems wrong to me that the parent div element gets assigned the DOM ID.

Is this a bug in EWB, or am I doing it wrong?

Thanks!
Fri, May 4 2018 3:41 AMPermanent Link

Matthew Jones

Stephen P wrote:

>     Edit1.ClientId := 'special-id';

I've used this with panels in the past and it has worked for parenting charts. But perhaps some more detailed control is needed for the compound controls, or some sort of hierarchy so you set the clientID and it appends appropriate suffixes, so "myname-input" and "myname-border" or whatever.

--

Matthew Jones
Fri, May 4 2018 3:41 AMPermanent Link

Chris Holland

SEC Solutions Ltd.

Avatar

Team Elevate Team Elevate

I use the same method here and it works with no problem.

I am accessing a TVideo and a TPaint object though.

Chris Holland

[Team Elevate]

On 03/05/2018 23:39, Stephen P wrote:
> I am trying to access the value of a form input element. Let's say the input element's name is Edit1. To get its value, I use getElementById as follows:
>
>      InputElement := THTMLInputElement(window.document.getElementById('special-id'));
>      CurrentValue := InputElement.value;
>
>
> Since EWB does not assign a DOM ID, I need to assign one myself earlier in the program flow. I do this with
>
>      Edit1.ClientId := 'special-id';
>
>
> I find that Edit1.ClientId does not assign the DOM ID to the text input element, but rather to a parent (surrounding) div. As a result InputElement.value returns a blank value. It seems wrong to me that the parent div element gets assigned the DOM ID.
>
> Is this a bug in EWB, or am I doing it wrong?
>
> Thanks!
>
Fri, May 4 2018 5:11 AMPermanent Link

Chris Holland

SEC Solutions Ltd.

Avatar

Team Elevate Team Elevate

One thing I did notice with assigning a ClientId is that it didn't like
doing it during a form OnShow() event.

Try setting the ClientId just before you call your javascript function
and see if that makes a difference.

Chris Holland

[Team Elevate]


On 03/05/2018 23:39, Stephen P wrote:
> I am trying to access the value of a form input element. Let's say the input element's name is Edit1. To get its value, I use getElementById as follows:
>
>      InputElement := THTMLInputElement(window.document.getElementById('special-id'));
>      CurrentValue := InputElement.value;
>
>
> Since EWB does not assign a DOM ID, I need to assign one myself earlier in the program flow. I do this with
>
>      Edit1.ClientId := 'special-id';
>
>
> I find that Edit1.ClientId does not assign the DOM ID to the text input element, but rather to a parent (surrounding) div. As a result InputElement.value returns a blank value. It seems wrong to me that the parent div element gets assigned the DOM ID.
>
> Is this a bug in EWB, or am I doing it wrong?
>
> Thanks!
>
Fri, May 4 2018 6:03 PMPermanent Link

Stephen P

Prokon Software Consultants (Canada) Ltd.

Thank you for your comments @Matthew and @Chris.

You are confirming that the TControl.ClientID method does work for containers; that is good news. It would appear it just does not work for form input controls.

> One thing I did notice with assigning a ClientId is that it didn't like doing it during a
> form OnShow() event. Try setting the ClientId just before you call your javascript
> function and see if that makes a difference.
I was actually not sure of where the best place would be to assign the DOM ID, so I tried the from OnCreate() and OnShow(), and a button's OnCLick(). The result is the same -- the ID gets assigned to a parent DIV.

I think this may be a bug in EWB.
Tue, May 8 2018 4:12 AMPermanent Link

Chris Holland

SEC Solutions Ltd.

Avatar

Team Elevate Team Elevate

Hi Stephen,

I have attached a small sample project that changes the Text on a TEdit
box using external javascript for you.

Hope this helps.

Chris Holland

[Team Elevate]


On 04/05/2018 23:03, Stephen P wrote:
> Thank you for your comments @Matthew and @Chris.
>
> You are confirming that the TControl.ClientID method does work for containers; that is good news. It would appear it just does not work for form input controls.
>
>> One thing I did notice with assigning a ClientId is that it didn't like doing it during a
>> form OnShow() event. Try setting the ClientId just before you call your javascript
>> function and see if that makes a difference.
> I was actually not sure of where the best place would be to assign the DOM ID, so I tried the from OnCreate() and OnShow(), and a button's OnCLick(). The result is the same -- the ID gets assigned to a parent DIV.
>
> I think this may be a bug in EWB.
>




Attachments: Test ClientID.zip
Wed, May 9 2018 2:58 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Stephen,

<< I find that Edit1.ClientId does not assign the DOM ID to the text input element, but rather to a parent (surrounding) div. As a result InputElement.value returns a blank value. It seems wrong to me that the parent div element gets assigned the DOM ID.

Is this a bug in EWB, or am I doing it wrong? >>

The property is *Client*ID, not *Input*ID, so there are no guarantees that the two are going to match for any given control because the client element is not always the same as the input element.

Having said that, I'll see if I can improve this a bit, but it's not something that will make it into Build 12 because that's going out this evening and setting the input element as the client element can have far-reaching effects.  For now, you'll have to find the input element *within* the client element using external JS.

Tim Young
Elevate Software
www.elevatesoft.com
Thu, May 10 2018 9:40 PMPermanent Link

Stephen P

Prokon Software Consultants (Canada) Ltd.

Thank you @Tim. It will be very useful to have Edit1.ClientId address the input element without any JS tricks.

Thank you @Chris. Your work-around work perfect for now.

You are two smart guys!
Fri, May 18 2018 1:06 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Stephen,

Build 13 is going out soon, and has a new InputID for input controls that can be used to get/set the ID for the input elements in such controls.

Tim Young
Elevate Software
www.elevatesoft.com
Wed, May 23 2018 8:20 PMPermanent Link

Stephen P

Prokon Software Consultants (Canada) Ltd.

Works like a charm. Thank you Tim!
Image