custom dropdown on region select

Since magento has no provision for city dropdown, i’ve tried adding a custom code on my persistent/checkout/onepage/billing.phtml, i added this but city doesnt populate the dropdown,, But when i try it on a single html page, it actually dropsdown.
This is my code:

<div class="input-box">
                           <select id="billing:region_id" name="billing[region_id]" title="<?php echo $this->__('State/Province') ?>" class="validate-select" style="display:none;">
                                <option value=""><?php echo $this->__('Please select region, state or province') ?></option>
                            <script type="text/javascript">
                                $('billing:region_id').setAttribute('defaultValue',  "<?php echo $this->getAddress()->getRegionId() ?>");
                            <input type="text" id="billing:region" name="billing[region]" value="<?php echo $this->escapeHtml($this->getAddress()->getRegion()) ?>"  title="<?php echo $this->__('State/Province') ?>" class="input-text <?php echo $this->helper('customer/address')->getAttributeValidationClass('region') ?>" style="display:none;" />

    <div class="field ">
                        <label for="billing:city" class="required"><em>*</em><?php echo $this->__('City') ?></label>
<div class="input-box">
<input class="input-box" type="text" name="name">
<script type="text/javascript">
   $('.input-box').replaceWith("<input class="input-box" type='text' name='name'>");
   $('.input-box').replaceWith('<select class="input-box"><option>a</option></select>');


12 answers

Profile photo of chima oscar 130.00 $tone May 20, 2015

Hi Kan Lee,
Thank you for your reply. What i want to achieve is, when i select a particular state(S), the city field changes from text box to select dropdown.

Profile photo of tuan le van 11570.00 $tone May 21, 2015

HI chima oscar
You could add this code at the end of the file.

<script type="text/javascript"> 
function billingSwitchCityField(){
$address = Mage::getSingleton('checkout/session')->getQuote()->getBillingAddress();
$defaultCity = $address->getCity();
var selectVal = jQuery('#billing\\:region_id option:selected').val();
if(selectVal != "1"){
.replaceWith('<select id="billing:city" name="billing[city]" class="required-entry">' +
'<option value="">choose option</option>' +
.replaceWith('<input type="text" class=" input-text required-entry absolute-advice " title="City" value="<?php echo $defaultCity;?>" id="billing:city" name="billing[city]" autocomplete="off">');

jQuery('#billing\\:region_id').change(function() {

Kan Lee

Profile photo of chima oscar 130.00 $tone May 21, 2015

Finally Kan,
What if i want my condition to be if two or three different states are selected, will i list them this way

if(selectVal == "1" "2" "3")

or do i use an else if then follow the way you did yours

Profile photo of chima oscar 130.00 $tone May 21, 2015

Hi Kan,
Thanks for your reply.
If i do it this way, they’ll all have the same <select> options.
What i want is, if a ==1 (display this options)
else if b == 2 (display this option)
else if c == 3 (display this option)
else (display text field)

Profile photo of Mall Staff 184060.00 $tone December 31, 2015

Hi irfan khan
That is a custom work requirement and you should find a freelancer to help you on this or you can submit a custom work service request from our at
and our developers will help you to solve this.

Profile photo of Frank 1460.00 $tone December 16, 2016

Hi Kiran Mange,

Hi i want to add city dropdown in your user registration filed.

As this need pretty much custom tweaks, please consider our custom work service to get the feature you mentioned. Our standard support can help you with bug-related issues only.


Please login or Register to Submit Answer

Written By