Accessing a UX field using $ [jQuery] notation

[JPMPA]

To update a Field in UX component the following works:
{dialog.object}.setValue('FirstName',"TEST1233");

But to use $ [jQuery] notation, what is the syntax for fields? I tried all the below and nothing worked. 'VND_C_ALIAS_' - this is the name/alias of the UX component.

$('{dialog.ComponentName}.V.R1.FirstName').innerHTML = "TESTABC";
$('{dialog.ComponentName}.V.R1.FIRSTNAME').innerHTML = "TESTABC";
$('VND_C_ALIAS_.V.R1.Firstname').innerHTML = "TESTABC";
$('VND_C_ALIAS_.V.R1.FIRSTNAME').innerHTML = "TESTABC";

BTW: The label change worked as shown in an another thread and copied for actual testing.

$('{dialog.ComponentName}.LBL.R1.FIRSTNAME').innerHTML = "TEST LABEL";

Thanks.

[aburningflame]

Re: Accessing a UX field using $ [jQuery] notation

Just a few things you might try:
$('#idselector').html('test');

$('.classselector').html('this is a class');

You could try the following: (the # is so say 'select an item with this id' the escapes \ are so jquery doesnt intepret . as a class selector)
$('#{dialog.ComponentName}\.LBL\.R1\.FIRSTNAME').html('test');

[Davidk]

Re: Accessing a UX field using $ [jQuery] notation

To use jQuery, you must load the jQuery libraries so I'll assume that's done.

jQuery, which "kinda normally" uses $ can't continue to use $ in Alpha, and other environments, because $ is reserved in Alpha for Alpha stuff.

So... somewhere... usually an a5w page, you use...

<script> if(typeof jQuery != 'undefined') jQuery.noConflict();</script>

to essential remap jQuery $ to (in this case) 'jQuery'.

So... now... anywhere you need to reference something with jQuery... you use 'jQuery ' (without quotes) in place of $.

[aburningflame]

Re: Accessing a UX field using $ [jQuery] notation

And just a little tip - if you do this $j=jQuery.noConflict(); You essentially remap 'jQuery' to $j. and can use $j('#selector').html('test');

[Davidk]

Re: Accessing a UX field using $ [jQuery] notation

And just a little tip - if you do this $j=jQuery.noConflict(); You essentially remap 'jQuery' to $j. and can use $j('#selector').html('test');

My only concern with this... and it's just me and my eyes... is that I tend to miss the j. I want a big loud shout out from jQuery that it's in play... since jQuery and $ are often in the mix together

[JPMPA]

Re: Accessing a UX field using $ [jQuery] notation

Thanks! Since $('{dialog.ComponentName}.LBL.R1.FIRSTNAME').innerHTML = "TEST LABEL" works for the label - can assume jQuery is fine with $ symbol and the escapes \ char are optional.
I am still not able to update the field. I tried the following (the first 3 had syntax error - innerHTML not a function - the last 3 - no error but did nothing). Thanks!

$('#{dialog.ComponentName}.V.R1.FIRSTNAME').innerHTML('test');
$('{dialog.ComponentName}\.V\.R1\.FIRSTNAME').innerHTML('test');
$('#{dialog.ComponentName}\.V\.R1\.FIRSTNAME').innerHTML('test');

$('{dialog.ComponentName}.V.R1.FIRSTNAME').innerHTML = "test";
$('#{dialog.ComponentName}.V.R1.FIRSTNAME').innerHTML = "test";
$('#{dialog.ComponentName}\.V\.R1\.FIRSTNAME').innerHTML = "test";

[Davidk]

Re: Accessing a UX field using $ [jQuery] notation

jQuery is not fine with the $ symbol. They are in direct contention. $ belongs to Alpha... actually to Javascript libraries that Alpha uses. This from jQuery...

Many JavaScript libraries use $ as a function or variable name, just as jQuery does. In jQuery's case, $ is just an alias for jQuery, so all functionality is available without using $. If you need to use another JavaScript library alongside jQuery, return control of $ back to the other library with a call to $.noConflict(). Old references of $ are saved during jQuery initialization; noConflict() simply restores them.

So... you need to tell jQuery that it's got to use something else instead of $.

This...

<script> if(typeof jQuery != 'undefined') jQuery.noConflict();</script>

tells jQuery to use 'jQuery' (no quote) instead of $.

Furthermore... innerHTML doesn't exist in jQuery. To change "innerHTML" using jQuery I believe it's...

$("#regTitle").html("Hello World");

or in our case... with Alpha...

jQuery("#regTitle").html("Hello World");

[JPMPA]

Re: Accessing a UX field using $ [jQuery] notation

Thanks David. I appreciate the help.

[Davidk]

Re: Accessing a UX field using $ [jQuery] notation

I forgot to ask... just curious... why do you want to use jQuery to get at innerHTML? Why not Javascript? Using a jQuery library of some sorts?

jQuery libraries are a lot of fun to work with... except when they use $ liberally. Then it's always a hunt and peck process of which $ symbols to change... 'cause it's never just all of them.

[JPMPA]

Re: Accessing a UX field using $ [jQuery] notation

For "labels" as it was mentioned the command is $('{dialog.ComponentName}.LBL.R1.FIRSTNAME').innerHTML = "TEST LABEL" that worked perfectly.
I was just curious why I was not able to access a simple UX field using similar $ notation. Thanks!

[RichCPT]

Re: Accessing a UX field using $ [jQuery] notation

For html input controls the ".value" property is used, not the ".innerHTML" property. Therefore, it would be $('control_id').value

"{dialog.object}.setValue()" takes care of a lot of things for you; I would not want to shortcut it.

[JPMPA]

Re: Accessing a UX field using $ [jQuery] notation

Thank you.
$('{dialog.ComponentName}.V.R1.FIRSTNAME').value = "test";
It worked.
I always use {dialog.object}.setValue(), but was just curious when I saw how its label was updated using $('{dialog.ComponentName}.LBL.R1.FIRSTNAME').innerHTML = "TEST LABEL".
Thanks!