Vervolgkeuzelijsten dynamisch vullen

Vereisten

Procedure voor het dynamisch vullen van vervolgkeuzelijsten

Overweeg een scenario waar u Staat drop-down lijst wilt bevolken die op een waarde wordt gebaseerd die u in Land drop-down lijst selecteert. Als u Australië in Land drop-down lijst selecteert, Staat toont de staten binnen Australië. De volgende procedure beschrijft hoe te om deze taak te verwezenlijken.

Creeer een project met de volgende modules:
- De bundel die de logica bevat om de drop-down te bevolken, die in dit geval een servlet is.
- De inhoud, die het .jar dossier insluit en een drop-down middel heeft. De servlet wijst naar deze resource.

Schrijf een servlet die op het Land van de verzoekparameter wordt gebaseerd, die een serie terugkeert die de namen van staten binnen het land bevat.

@Component(metatype = false)
@Service(value = Servlet.class)
@Properties({
        @Property(name = "sling.servlet.resourceTypes", value = "/apps/populatedropdown"),
        @Property(name = "sling.servlet.methods", value = {"GET", "POST"}),
        @Property(name = "service.description", value = "Populate states dropdown based on country value")
})
public class DropDownPopulator extends SlingAllMethodsServlet {
    private Logger logger = LoggerFactory.getLogger(DropDownPopulator.class);

    protected void doPost(SlingHttpServletRequest request,
                          final SlingHttpServletResponse response)
            throws ServletException, IOException {
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");
        try {
            String US_STATES[] = {"0=Alabama",
                    "1=Alaska",
                    "2=Arizona",
                    "3=Arkansas",
                    "4=California",
                    "5=Colorado",
                    "6=Connecticut",
                    "7=Delaware",
                    "8=Florida",
                    "9=Georgia",
                    "10=Hawaii",
                    "11=Idaho",
                    "12=Illinois",
                    "13=Indiana",
                    "14=Iowa",
                    "15=Kansas",
                    "16=Kentucky",
                    "17=Louisiana",
                    "18=Maine",
                    "19=Maryland",
                    "20=Massachusetts",
                    "21=Michigan",
                    "22=Minnesota",
                    "23=Mississippi",
                    "24=Missouri",
                    "25=Montana",
                    "26=Nebraska",
                    "27=Nevada",
                    "28=New Hampshire",
                    "29=New Jersey",
                    "30=New Mexico",
                    "31=New York",
                    "32=North Carolina",
                    "33=North Dakota",
                    "34=Ohio",
                    "35=Oklahoma",
                    "36=Oregon",
                    "37=Pennsylvania",
                    "38=Rhode Island",
                    "39=South Carolina",
                    "40=South Dakota",
                    "41=Tennessee",
                    "42=Texas",
                    "43=Utah",
                    "44=Vermont",
                    "45=Virginia",
                    "46=Washington",
                    "47=West Virginia",
                    "48=Wisconsin",
                    "49=Wyoming"};
            String AUSTRALIAN_STATES[] = {"0=Ashmore and Cartier Islands",
                    "1=Australian Antarctic Territory",
                    "2=Australian Capital Territory",
                    "3=Christmas Island",
                    "4=Cocos (Keeling) Islands",
                    "5=Coral Sea Islands",
                    "6=Heard Island and McDonald Islands",
                    "7=Jervis Bay Territory",
                    "8=New South Wales",
                    "9=Norfolk Island",
                    "10=Northern Territory",
                    "11=Queensland",
                    "12=South Australia",
                    "13=Tasmania",
                    "14=Victoria",
                    "15=Western Australia"};
            String country = request.getParameter("country");
            JSONArray stateJsonArray = new JSONArray();
            if (country.length() > 0) {
                if ("australia".equalsIgnoreCase(country)) {
                    stateJsonArray = new JSONArray();
                    for (String state : AUSTRALIAN_STATES) {
                        stateJsonArray.put(state);
                    }
                } else if ("unitedstates".equalsIgnoreCase(country)) {
                    stateJsonArray = new JSONArray();
                    for (String state : US_STATES) {
                        stateJsonArray.put(state);
                    }
                }
                response.setContentType("application/json");
                response.getWriter().write(stateJsonArray.toString());
            }

        } catch ( Exception e) {
            logger.error(e.getMessage(), e);
        }
    }
}

Maak een vervolgkeuzelijst onder een bepaalde maphiërarchie in apps (maak bijvoorbeeld een knooppunt onder /apps/myfolder/demo). Zorg ervoor dat de parameter sling:resourceType voor het knooppunt gelijk is aan de parameter waarmee het servlet-punt (/apps/populatedropdown?lang=nl).
Verpak het inhoudsknooppunt en sluit het .jar-bestand in op een bepaalde locatie (bijvoorbeeld /apps/mijnmap/demo/install/). Implementeer hetzelfde bestand op de server.
Maak een adaptief formulier en voeg er twee vervolgkeuzelijsten aan toe: Land en Staat. De lijst Land kan de namen van landen bevatten. In de lijst Frame kunnen dynamisch de namen worden ingevuld van staten voor het land dat u in de eerste lijst selecteert.

Voeg de namen van de landen toe die u wilt weergeven in de lijst Land. Voeg in de lijst Staat een script toe om het te vullen op basis van de naam van het land in de lijst Land.
```
JSON.parse(
    $.ajax({
        url: "/apps/myfolder/demo/dropdown",
        type: "POST",
        async: false,
        data: {"country": country.value},
         success: function(res){},
         error : function (message) {
              guideBridge._guide.logger().log(message);
              successFlag = false;
              }
           })
.responseText);
```