var servicelist = 
{ 
  '10': ['Däckservice', 'renkaisiin_liittyvat_esitte.jpg'],
  '11': ['Stötdämpare', 'iskunvaimentimet_esittely.jpg'],
  '12': ['Oljor och oljebyten', 'oljyt_ja_oljynvaihdot_esitt.jpg'],
  '13': ['Bromsar', 'jarrut_esittely.jpg'],
  '14': ['Batterier', 'akut_esittely.jpg'],
  '15': ['Hjulinställning', 'ohjauskulmat_esittely.jpg'],
  '16': ['Avgassystem', 'pakoputket_esittely.jpg'],
  '17': ['Biltillbehör', 'autotarvikkeet_esittely.jpg'],
  '18': ['AC-service', 'ilmastointi_esittely.jpg'],
  '19': ['Däckhotell', 'sailytys_esittely.jpg'],
  '20': ['Bilservice', 'autohuolto_esittely.jpg'],
  '22': ['MC-däck', 'moottoripyora_esittely.jpg'],
  '23': ['Biltvätt', 'autonpesu_esittely.jpg'],
  '24': ['Snabbservice', 'autohuolto_esittely.jpg']
};


$(function () {
  
  $("#q0").change( function () {
    $("#services").empty();
    var services = $(this).find(":selected").attr("rel").split(",");
    var email = $(this).find(":selected").attr("title");

    $("#emailfield").val(email); alert(email);

    if (services.length == 0) return;
    $.each(services, function (i, service) {
      service = parseInt(service);
      if (servicelist[ service ])
      {
        var serviceName = servicelist[ service ][0];
        var serviceImg = servicelist[ service ][1];
        $("#services").append(
          '<div style="text-align: center; float: left; width: 100px; height: 100px; margin: 0 10px 10px 0;">'+
          '<img src="/files/vianorse/palvelut/'+ serviceImg +'" alt="'+ serviceName +'" /><br />'+
          serviceName +'<br />'+
          '<input type="checkbox" name="q1[]" value="'+ serviceName +'" />'+
          '</div>'
        );
      }
    });
    
  });

});