 jQuery ($) ->  
+  
+  # The form
+  $chooseDistrict = $("#choose-district")
+
+  showDistrictContact = (district) ->
+        # The form
+        $chooseDistrict = $("#choose-district")
+
+        # Hide all contact cards
+        $("aside.contact-us.multi-district .vcard").hide()
+        $("aside.contact-us.multi-district .no-district-available").remove()
+
+        # Show selected contact card
+        $chosen = $("#district-#{district}")
+        if($chosen.length)
+          $chosen.show()
+        else
+          $chooseDistrict.after('<div class="no-district-available">Kontaktinformation för valt stadsområde saknas.</div>')
+
+        # Set district in select menu
+        $selectDistrict.val district
+
+        # Set selected district in cookie
+        $.cookie('city-district', district, { expires: 365, path: '/' } )
+  
+  $(document.body).on "change", $chooseDistrict.find("select"), ->
+    showDistrictContact $chooseDistrict.find("select").val()
+
   $("aside.contact-us .write-to-us").click (event) -> 
     event.preventDefault()
     $trigger = $(@)

          url: $trigger.attr('data-action')
          data: $form.serialize() + "&contactid=#{$trigger.attr('data-contact-id')}"
          success: (data) ->                      
            $form.replaceWith(data)						
            $that.find('form').show()
          error: (x, y, z) ->   
            $form.after('<div class="error">Ett fel inträffade, vänligen försök senare eller skicka ditt meddelande till nedanstående e-postadress.</div>')                                        

              district: item.towndistrict
      minLength: 2
      select: (event, ui) ->
        showDistrictContact ui.item.district.toLowerCase()
