Magento 2, Magento Development, Customization, Extension Development and Integration, Optimization, SEO and Responsive Design

Magento 2, Magento Development, Customization, Extension Development and Integration, Optimization, SEO and Responsive Design

Change shipping address dropdown to list view at checkout page Magento

Once i need to change shipping address dropdown to div structure.
After a long research i found that this select box is comming form core php file and i do not want to make any change in core file. So at last i changed my shipping.phtml file as following.

I have changed in file

This code is used for getting the html for select box for presaved address.
I added my new code after this.
<?php echo $this->getAddressesHtmlSelect('shipping') ?>

Now, my code looks like this,

<label for="shipping-address-select"><?php echo $this->__('Select a shipping address from your address book or enter a new address.') ?></label>
<div class="input-box" style="display: none;">
<?php echo $this->getAddressesHtmlSelect('shipping') ?>
        /*New Code start*/   
<div id="custAddress">
<?php $customerId = Mage::getSingleton('customer/session')->getCustomer();?>    
<?php $customer = Mage::getModel('customer/customer')->load($customerId->getId()); ?>
<?php $data = array();?>
<?php $i=0; foreach ($customer->getAddresses() as $address):?>
<?php $data = $address->toArray();?>
<div id="addresseList">
       <a href="javaScript:void(0);" onclick="setAddress(" id="<?php echo $i;?>">
          <div id="selected_<?php echo $i;?>" class="selectedImage" style="float: right; margin: -6px; display: none;"><img src="<?php echo $this->getSkinURl()?>images/right.jpg" /></div>
         <?php echo $data['firstname'].' '.$data['lastname'].'<br />';?>
         <?php echo $data['street'].'<br />';?>
         <?php echo $data['city'].','.$data['region'].','.$data['postcode'].'<br />';?>
         <?php $country_name = Mage::app()->getLocale()->getCountryTranslation($data['country_id']);?>
         <?php echo $country_name.'<br />';?>
          <?php echo 'T: '.$data['telephone'];?>
 <?php $i++; endforeach; ?>  

<li id="addNewtext"><a href="javaScript:void(0);" onclick="setNewAddress()"><?php echo $this->__('Click to Add new address') ?></a></li>

/*End of New code start*/

I have added javascript and jQuery function in same file at the bottom of the page.

<script type="text/javascript">
function setAddress(obj)
    document.getElementById('shipping-address-select').selectedIndex = obj;
function setNewAddress()
    jQuery("#shipping-address-select").find("option:contains('New Address')").each(function()
     if( jQuery(this).text() == 'New Address' )

Hit like or leave comment if post help!

Please support us, Like us on Facebook.

  1. Here is a guide to help you decide what beauty essentials to bring on your trip,
    to ensure you have beautiful, flawless skin all the whole way through.
    More specifically, using coconut oil as an antioxidant.
    Toning helps remove all traces of dirt, grease and excess cleanser.

    My homepage :: face lift cream

  2. Cheers. Used the code to rewrite the select box as I needed to add some classes



Copyright @ 2015 HKblog.