Develop > Controller layer > Application developer > Support globalization > Globalized catalog content > Globalized tools framework


Create a language selection drop-down list

This section refers to creating a language section drop-down list.

To create a language selection drop-down list:


Procedure

  1. Include a bean declaration to the StoreLanguageBean. For this, add the following statement to the StoreLanguageSelection.jsp file available in

    • WC_EAR/SiteAdministration.war/tools/common

    • WC_PROFILE\xml\tools\common

    <jsp:useBean id="storeLang" scope="request"
    class="com.ibm.commerce.tools.common.ui.StoreLanguageBean">
    </jsp:useBean>
    

  2. Make a call to the StoreLanguageBean.getStoreJS(storeName,out):

    <% storeLang.getStoresJS("stores", out); %>
    

    The getStoresJS method creates a JavaScript array with all information entitled to the user according to the access control policy. The information includes the stores that the user is entitled to access, the fulfillment centers of those stores, and the languages, which each store supports. The following is an example of a JavaScript array created by a call to the getStoresJS method:

    stores[0] = new Object();
     stores[0].storeId = '10001'
    stores[0].languages = new Array();
     stores[0].languages[0] = new Object();
     stores[0].languages[0].langId = '-1';
     stores[0].languages[0].langDesc = 'United States English';
     stores[0].languages[1] = new Object();
     stores[0].languages[1].langId = '-3';
     stores[0].languages[1].langDesc = 'German';
     stores[0].languages[2] = new Object();
     stores[0].languages[2].langId = '-5';
     stores[0].languages[2].langDesc = 'Spanish';
     stores[0].languages[3] = new Object();
     stores[0].languages[3].langId = '-2';
     stores[0].languages[3].langDesc = 'French';
     stores[0].languages[4] = new Object();
     stores[0].languages[4].langId = '-4';
     stores[0].languages[4].langDesc = 'Italian';
     stores[0].languages[5] = new Object();
     stores[0].languages[5].langId = '-10';
     stores[0].languages[5].langDesc = 'Japanese';
     stores[0].languages[6] = new Object();
     stores[0].languages[6].langId = '-9';
     stores[0].languages[6].langDesc = 'Korean';
     stores[0].languages[7] = new Object();
     stores[0].languages[7].langId = '-6';
     stores[0].languages[7].langDesc = 'Brazilian Portuguese';
     stores[0].languages[8] = new Object();
     stores[0].languages[8].langId = '-7';
     stores[0].languages[8].langDesc = 'Simplified Chinese';
     stores[0].languages[9] = new Object();
     stores[0].languages[9].langId = '-8';
     stores[0].languages[9].langDesc = 'Traditional Chinese';
    

  3. Use the language data contained in the JavaScript array, which the StoreLanguageBean.getStoreJS(storeName,out) retrieves, to construct the drop-down list:

    function getLanguageList() 
    {
        var langSelection = document.getElementById("langlb");
        var newOption;
        var selectedLangId = null;
     
        langSelection.options.length = 0;
        if (stores.length > 0 && selectedStore != null) 
        { 
           for (var x=0; x<stores[selectedStore].languages.length; x++) 
           {
              newOption = new Option(stores[selectedStore].languages[x].langDesc, stores [selectedStore].languages[x].langId);
              langSelection.options[langSelection.options.length] = newOption;
     
              if (stores[selectedStore].languages[x].langId == currentLangId) 
              {
                  selectedLangId = stores[selectedStore].languages[x].langId;
                  langSelection.options[x].selected = true;
              }
              else if (selectedLangId != currentLangId && (x == 0 || stores [selectedStore].languages[x].langId == defaultLangId)) 
              {
                  selectedLangId = stores[selectedStore].languages[x].langId;
                  langSelection.options[x].selected = true;
              }
            }
        }
        else 
        {
            newOption = new Option("<%= UIUtil.toJavaScript(none) %>", "");
            langSelection.options[langSelection.options.length] = newOption;
        }
    }
    


Results

For an implementation example, refer to the StoreLanguageSelection.jsp file available in:


Related concepts

Globalized tools framework

Cultural considerations

Localized store assets


Related tasks

Create a globalized store

Create and using resource bundles in the tools framework

Name and address formatting

Related reference

Globalization tips

massload utility (Server environment)


+

Search Tips   |   Advanced Search