【问题标题】:AEM - Refresh datasource after granite field changeAEM - 花岗岩字段更改后刷新数据源
【发布时间】:2020-08-03 15:08:20
【问题描述】:

我正在尝试弄清楚如何从我希望传递到数据源的路径字段中为选择字段刷新花岗岩数据源。

基本上:

  1. 设置将查看内容片段模型的路径 (pathToOptions)

  2. Datasource 被调用,每次对话框中的路径值发生变化,Sling Servlet 检索内容片段的所有字段

  3. 作者对话框为花岗岩选择下拉菜单 (cfOptions) 生成选项,其中包含来自数据源的字段。

     <pathToOptions jcr:primaryType="nt:unstructured"
         sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
         fieldLabel="CF Path"
         rootPath="/content"
         name="./pathToOptions"/>
     <cfOptions jcr:primaryType="nt:unstructured"
         sling:resourceType="granite/ui/components/coral/foundation/form/select"
         fieldLabel="CF Options"
         name="./cfOptions">
         <datasource jcr:primaryType="nt:unstructured"
             sling:resourceType="/bin/path/to/servlet"/>
     </resProperties>
    

(变量名和路径只是通用的)

没有太多关于 AEM Granite 数据源和 Apache Sling API 的知识;数据源是否有可行的方法,或者我需要依赖 AJAX。如果是后者,我会发布一个后续问题。

【问题讨论】:

    标签: aem sling aem-touch-ui


    【解决方案1】:

    经过一番研究;事实证明,使用数据源无法做到这一点,而是使用 AJAX ($.ajax()) 与 Sling Servlet 通信以实现必要的功能。

    https://helpx.adobe.com/experience-manager/using/creating-touchui-dynamic.html

    我使用此文档作为完成功能的基础,但根据我的规范进行了调整。

    (function ($, $document) {
        "use strict";
    
        var LANGUAGE = "./language", COUNTRY = "./country";
    
        function adjustLayoutHeight(){
            $(".coral-FixedColumn-column").css("height", "20rem");
        }
     
        $document.on("dialog-ready", function() {
            adjustLayoutHeight();
         
            // Getting reference of language drop down field
            var language = $("[name='" + LANGUAGE +"']").closest(".coral-Select")
         
            // Initializing country drop down field
            var country = new CUI.Select({
                element: $("[name='" + COUNTRY +"']").closest(".coral-Select")
            });
         
            if(_.isEmpty(country) || _.isEmpty(language)){
                return;
            }
         
            var langCountries = {};
         
            country._selectList.children().not("[role='option']").remove();
         
            function fillCountries(selectedLang, selectedCountry){
    
                var x = $("[name='./country']").closest(".coral- Select").find('option').remove().end();
                _.each(langCountries, function(value, lang) {
    
                    if( (lang.indexOf(selectedLang) !== 0) || (value.country == "*") ){
                        return;
                    }
    
                    var test2 = $("[name='./country']")[0];
    
                    $("<option>").appendTo(test2).val(lang).html(value.country);
    
                });
    
                country = new CUI.Select({
                    element: $("[name='" + COUNTRY +"']").closest(".coral-Select")
                });
             
             
                if(!_.isEmpty(selectedCountry)){             
                    country.setValue(selectedCountry);     
                }
             
            }
         
            //listener on language select for dynamically filling the countries on language select
            language.on('selected.select', function(event){
                console.log(event);
                fillCountries(event.selected);
            });
         
            // Get the languages list from the source
            $.getJSON("/libs/wcm/core/resources/languages.2.json").done(function(data){
                langCountries = data;
             
                var $form = country.$element.closest("form");
             
                //get the second select box (country) saved value
                $.getJSON($form.attr("action") + ".json").done(function(data){
                    if(_.isEmpty(data)){
                        return;
                    }
    
                    // Passing values to populate countries list
                    fillCountries(language.val(), data.country);
                })
            });
        });
    })($, $(document));
    

    此片段最初来自文章。我只应用它以防万一链接失效。我已经看到很多 Adob​​e 的论坛帖子都有 404 链接,因此添加此作为预防措施以供将来参考。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-10-11
      • 1970-01-01
      • 1970-01-01
      • 2016-08-23
      • 2011-09-13
      • 1970-01-01
      相关资源
      最近更新 更多