Commerce Addressbook

[tennist]

I am working on adding support for commerce address book and am running into an error. I am using in-line java to populate a select list on the checkout form that allows users to select from their saved billing addresses. Everything is working fine in terms of populating the list and setting the values for the input fields when an address is chosen, however, when I click the submit button, it says that the Saved Addresses Field is Required even though an item is selected in the list. My code is below and any help would be appreciated.

 *Make Billing Profiles Retrieve Call To Server.
 */
function customcommerce_billing_profiles_retrieve(options) {
  try {
    options.method = 'GET';
    options.path = 'customer-profile.json';
    options.service = 'customer-profile';
    options.resource = 'index';
    Drupal.services.call(options);
  }
  catch (error) {
    console.log('customcommerce_billing_profiles_retrieve - ' + error);
  }
}

/**
 * Implements hook_form_alter().
 */
function customcommerce_form_alter(form, form_state, form_id) {
  try {

    //console.log(form_id); // Use to see the form id.
    //console.log(form);    // Use to inspect the form.

    if (form_id == 'commerce_checkout_view') {      
        form.elements['saved_billing_information'] = {
            type: 'select',
            title: t('Saved Addresses'),                    
            required: true,       
            options: {0: 'New Address'},
            weight: 0,
            attributes: {
                id: 'edit-commerce-checkout-view-saved_billing_information',
                onchange: "customcommerce_saved_billing_information_onchange(this)"             
            }
        };
        form.suffix += drupalgap_jqm_page_event_script_code({
            page_id: drupalgap_get_page_id(),
            jqm_page_event: 'pageshow',
            jqm_page_event_callback: 'customcommerce_saved_billing_information_list_populate'
            //jqm_page_event_args: JSON.stringify({
                //country_widget_id: country_widget_id,
                //default_country: country_code
            //})
        });     
    }

  }
  catch (error) { console.log('customcommerce_form_alter - ' + error); }
}

/**
 *Checkout Billing Profiles List Populate .
 */
function customcommerce_saved_billing_information_list_populate(options) {
  try {
    customcommerce_billing_profiles_retrieve({          
        success: function(profiles) {           

            var default_value = '';
            var html = '';

            //Store profiles so we can use them to populate the billing information form later
            _commerce_billing_profiles = profiles;          

            //Add each profile to the dropdown list
            $.each( profiles, function( key, value ) {              
                if (value.default_value != 0){
                    default_value = key;
                }
                if (value.status != 0){
                    html += '<option value="' + key + '">' + value.commerce_customer_address.thoroughfare + '</option>';                    
                }               
            });         
            if (!empty(html)) {
                $('#edit-commerce-checkout-view-saved_billing_information').append(html);               
            }       

            // If we have a default profile use it and fire the change event for the profile select.
            if (!empty(default_value)) {
              $('#edit-commerce-checkout-view-saved_billing_information').val(default_value).change();
            }

            // We don't have a default profile, so immediately trigger the
            // change event on the first profile.
            else if (empty(default_value) && !empty(html)) {
              $('#edit-commerce-checkout-view-saved_billing_information').change();
            }           
        }
    });

  }
  catch (error) {
    console.log('customcommerce_saved_billing_information_list_populate - ' + error);
  }
}

/**
 *Checkout Billing Profiles List onChange.
 */
function customcommerce_saved_billing_information_onchange(data) {
  try {  

     if (data.value != 0) {  

        // Name line
        $('#edit-commerce-checkout-view-billing-information-name_line').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.name_line) {
          $('#edit-commerce-checkout-view-billing-information-name_line').val(_commerce_billing_profiles[data.value].commerce_customer_address.name_line);
        }

        // First Name
        $('#edit-commerce-checkout-view-billing-information-first_name').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.first_name) {
          $('#edit-commerce-checkout-view-billing-information-first_name').val(_commerce_billing_profiles[data.value].commerce_customer_address.first_name);
        }

        // Last Name
        $('#edit-commerce-checkout-view-billing-information-last_name').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.last_name) {
          $('#edit-commerce-checkout-view-billing-information-last_name').val(_commerce_billing_profiles[data.value].commerce_customer_address.last_name);
        }

        // thoroughfare
        $('#edit-commerce-checkout-view-billing-information-thoroughfare').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.thoroughfare) {
          $('#edit-commerce-checkout-view-billing-information-thoroughfare').val(_commerce_billing_profiles[data.value].commerce_customer_address.thoroughfare);
        }

        // premise
        $('#edit-commerce-checkout-view-billing-information-premise').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.premise) {
          $('#edit-commerce-checkout-view-billing-information-premise').val(_commerce_billing_profiles[data.value].commerce_customer_address.premise);
        }

        // locality
        $('#edit-commerce-checkout-view-billing-information-locality').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.locality) {
          $('#edit-commerce-checkout-view-billing-information-locality').val(_commerce_billing_profiles[data.value].commerce_customer_address.locality);
        }

        // administrative area
        $('#edit-commerce-checkout-view-billing-information-administrative_area').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.administrative_area) {
          $('#edit-commerce-checkout-view-billing-information-administrative_area').val(_commerce_billing_profiles[data.value].commerce_customer_address.administrative_area).selectmenu('refresh', true);
        }

        // postal code
        $('#edit-commerce-checkout-view-billing-information-postal_code').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.postal_code) {
          $('#edit-commerce-checkout-view-billing-information-postal_code').val(_commerce_billing_profiles[data.value].commerce_customer_address.postal_code);
        }

        // country
        $('#edit-commerce-checkout-view-billing-information-country').attr('disabled', true);
        if (_commerce_billing_profiles[data.value].commerce_customer_address.country) {
          $('#edit-commerce-checkout-view-billing-information-country').val(_commerce_billing_profiles[data.value].commerce_customer_address.country).selectmenu('refresh', true);
        }

     } else {
        // Name line        
          $('#edit-commerce-checkout-view-billing-information-name_line').val('').attr('disabled', false);

        // First Name
          $('#edit-commerce-checkout-view-billing-information-first_name').val('').attr('disabled', false);

        // Last Name        
          $('#edit-commerce-checkout-view-billing-information-last_name').val('').attr('disabled', false);

        // thoroughfare     
          $('#edit-commerce-checkout-view-billing-information-thoroughfare').val('').attr('disabled', false);

        // premise      
          $('#edit-commerce-checkout-view-billing-information-premise').val('').attr('disabled', false);

        // locality     
          $('#edit-commerce-checkout-view-billing-information-locality').val('').attr('disabled', false);

        // administrative area      
          $('#edit-commerce-checkout-view-billing-information-administrative_area').val('').selectmenu('refresh', true).attr('disabled', false);

        // postal code      
          $('#edit-commerce-checkout-view-billing-information-postal_code').val('').attr('disabled', false);

        // country
          $('#edit-commerce-checkout-view-billing-information-country').val('US').selectmenu('refresh', true).attr('disabled', false);

     }

  }
  catch (error) {
    console.log('customcommerce_saved_billing_information_onchange - ' + error);
  }
}```

[tennist]

Please note that I solved this problem. The reason for the error was due to having underscores in my form element id. I changed it to hyphens and everything is working fine.

On a side note I think this might be able to be implemented into the Commerce Module or as a new module "Commerce Addressbook", however. It requires a bit of modification to the current submit handler for billing information form in the Commerce module. I don't know the best way about changing this so that the commerce module will still be functional for people that don't have Commerce Addressbook running on their web server.