{% extends "default/index.html" %}
{% block header %}
{% if remove %}
<script type="text/javascript" src="/@@media/jquery-1.3.1.min.js"></script>
<script type="text/javascript" charset="utf-8">
  $(function(){
          $("select#id_host").change(function(){
      $.getJSON("/json/servicesforhost/"+$(this).val()+"/", function(j) {
          var options = '<option value="">---------- </option>';
        for (var i = 0; i < j.length; i++) {
          options += '<option value="' + parseInt(j[i].pk) + '">' + j[i].fields['service_description'] + '</option>';
        }
        $("#id_service").html(options);
        $("#id_service option:first").attr('selected', 'selected');
        $("#id_service").attr('disabled', false);
      })
      $("#id_service").attr('selected', 'selected');
    })

})
</script>
{% endif %}
{% endblock header %}
{% block content %}
{% if remove %}
<form method="POST" action="/service/removehost">
{% else %}
<form method="POST" action="/service/addhost">
{% endif %}
    <table>
        {{ form }}
    </table>
    {% if remove %}
    <input type='submit' value='remove service from host'>
    {% else %}
    <input type='submit' value='add service to host'>
    {% endif %}
</form>
{% endblock content %}
