Add CRX props after selecting option from datasource

[Giuderos]

Hi,

in my component dialog I have this item:

<rule jcr:primaryType="nt:unstructured" 
sling:resourceType="granite/ui/components/coral/foundation/form/autocomplete" emptyText="----  Slect value -----" fieldDescription="Select rule" fieldLabel="Select rule" forceSelection="{Boolean}true" name="./rule" required="false">
<datasource jcr:primaryType="nt:unstructured" sling:resourceType="/bin/notification/getrules" addNone="{Boolean}true"/>
<options jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/autocomplete/list"/>
</rule>

The servlet /getrules return me a list of Rules:

{
  "id": "1234",
  "name": "sample name"
  "description": "sample description"
}

Actually, on selection, I store "id" in ./rule properties. Is it possible to store "name" and "description" in other two crx properties?

I am on AEM 6.4.5

Thanks 

[Lokesh_Vajrala]

@Giuderos Why would you want to store the name and description properties in the content along with id? Is it simply because you need to read them and display them in the UI? 

[Giuderos1]

Exactly, I need them to show in HTML

[Lokesh_Vajrala · Accepted solution]

In that case, you don't want to store those additional properties under the component content. Instead of keeping them in the component content, I would read them from the location where the datasource is populating the selection drop-down. 

sample pseudo code
in component sling model PostConstruct method
request.getResourceResolver().getResource("path-to-datasource-resources"); 
// get children and find the child with the id matching from the content and get the name and description. 

I hope the above makes sense for your scenario. 

[Saravanan_Dharmaraj]

You need to write some custom code to achieve that when you submit the dialog.

Give a class to the option

granite:class="rule-option"

(function ($, $document) {
    "use strict";
    $(document).on("click", ".cq-dialog-submit", function (e) {
        var $value = $('.rule-option');
        //Get the name and description and save it with delimiter in the same property
        // you need to write logic in front end to parse it and show each items separately.

        
    });
})($, $(document));

Dont forget to add the script in cq.authoring.dialog clientlib

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
      jcr:primaryType="cq:ClientLibraryFolder"
      categories="cq.authoring.dialog"/>