---
title: 'Teh 4'
---

Teht 4 Kolmikerros
===

## Table of Contents

[TOC]

## Rest Backend

Clientin toimimaan saamisessa ei juurikaan hankaluuksia, kuten ei Serverissäkään, lukuunottamatta muutaman ahaa elämyksen tarvetta. Tiedot päivitetään jqueryn avulla

Koodi
---

function loadApp() {
  console.log("loading application");

  // Bind AJAX call to the click event of Button #lataa
  $('#lataa').click(function(event) {
    // TODO: selvitä mikä merkitys on ao. rivillä
    event.preventDefault();

    // The server must be bind to localhost (for testing) as we don't have a FQDN or HTTP proxy available
    //TODO: correct URI
    $.get("http://localhost:8080/api/v1/athletes/", function(data) {
      console.log("Sending HTTP GET to server");
    })
    .done(function( data ) {
      console.log("response from server :", data);
      
      //TODO: esitä vastaanotettu data webbisivulla, eli 
      // rakenna tässä kohtaa taulukko table+th+tr+td-elementein
      // palvelimelta tuleva vastaus on data-muuttujassa JavaScript-oliona

      $.each(data, function(key, value) {
        $("table").append("<tr><td> Etunimi: "+ value.firstname + " Sukunimi: " + value.lastname+ " Kutsumanimi: "+ value.kname+ " Syntymäaika: " + value.bdate + " Laji: " +value.sports + " Saavutukset: " + value.stats+ " Kuva: " + value.img + "</td></tr>");
        $("#table").show();
      
      });

    })
    .fail(function(err) {
      console.log("error");
    })
    .always(function() {
      console.log("finished");
    });
  });

Esimerkkinä tietojen päivitys index.html documenttiin