diff --git a/app/assets/javascripts/app/controllers/_ui_element/holiday_selector.js.coffee b/app/assets/javascripts/app/controllers/_ui_element/holiday_selector.js.coffee
index 6c85538eb..cd278bfa9 100644
--- a/app/assets/javascripts/app/controllers/_ui_element/holiday_selector.js.coffee
+++ b/app/assets/javascripts/app/controllers/_ui_element/holiday_selector.js.coffee
@@ -20,10 +20,10 @@ class App.UiElement.holiday_selector
     item.find('.js-datePicker').html(datePicker)
 
     # set active/inactive of date
-    item.find('.js-active').bind('click', (e) ->
+    item.delegate('.js-active', 'click', (e) ->
       active = $(e.target).prop('checked')
       row = $(e.target).closest('tr')
-      input = $(e.target).closest('tr').find('.js-description')
+      input = $(e.target).closest('tr').find('.js-summary')
       if !active
         row.addClass('is-inactive')
         input.prop('readonly', true)
@@ -35,7 +35,7 @@ class App.UiElement.holiday_selector
     )
 
     # remove date
-    item.find('.js-remove').bind('click', (e) ->
+    item.delegate('.js-remove', 'click', (e) ->
       $(e.target).closest('tr').remove()
     )
 
@@ -61,14 +61,14 @@ class App.UiElement.holiday_selector
       $(e.target).closest('tr').find('.js-summary').val('')
 
       # place new element
-      template = item.find('.js-placeholder').clone()
-      template.removeClass('hidden').removeClass('js-placeholder')
-      template.attr('data-date', date)
-      template.find('.js-date').html(App.i18n.translateDate(date))
-      template.find('.js-active').attr('name', "{boolean}public_holidays::#{date}::active")
-      template.find('.js-summary').attr('name', "public_holidays::#{date}::summary")
-      template.find('.js-summary').val(summary)
-      item.find('.js-placeholder').before(template)
+
+      template = App.view('calendar/holiday_selector_placeholder')(
+        placeholderDate: date
+        placeholderSummary: summary
+        nameSummary: "public_holidays::#{date}::summary"
+        nameActive: "{boolean}public_holidays::#{date}::active"
+      )
+      item.find('.settings-list-controlRow').before(template)
     )
 
     item
diff --git a/app/assets/javascripts/app/views/calendar/holiday_selector.jst.eco b/app/assets/javascripts/app/views/calendar/holiday_selector.jst.eco
index 424c505ad..24f6b12b0 100644
--- a/app/assets/javascripts/app/views/calendar/holiday_selector.jst.eco
+++ b/app/assets/javascripts/app/views/calendar/holiday_selector.jst.eco
@@ -1,59 +1,43 @@
-    <table class="settings-list">
-      <thead>
-        <tr>
-          <th><%- @T('Active') %>
-          <th><%- @T('Date') %>
-          <th><%- @T('Description') %>
-          <th><%- @T('Action') %>
-      </thead>
-      <tbody>
-        <% for day, meta of @days: %>
-        <tr <% if !meta.active: %>class="is-inactive"<% end %> data-date="<%= day %>">
-          <td>
-            <label class="checkbox-replacement">
-              <input type="checkbox" <% if meta.active: %>checked<% end %> class="js-active" name="{boolean}public_holidays::<%= day %>::active" value="true">
-              <%- @Icon('checkbox', 'icon-unchecked') %>
-              <%- @Icon('checkbox-checked', 'icon-checked') %>
-            </label>
-          <td><%- @Tdate(day) %>
-          <td><input class="form-control form-control--small js-description <% if !meta.active: %>is-disabled<% end %>" type="text" name="public_holidays::<%= day %>::summary" value="<%= meta.summary %>" required/>
-          <td>
-            <div class="settings-list-rowControls">
-              <% if !meta.feed: %>
-                <div class="btn btn--text js-remove">
-                  <%- @Icon('trash') %> <%- @T('Remove') %>
-                </div>
-              <% end %>
+<table class="settings-list">
+  <thead>
+    <tr>
+      <th><%- @T('Active') %>
+      <th><%- @T('Date') %>
+      <th><%- @T('Description') %>
+      <th><%- @T('Action') %>
+  </thead>
+  <tbody>
+    <% for day, meta of @days: %>
+    <tr <% if !meta.active: %>class="is-inactive"<% end %> data-date="<%= day %>">
+      <td>
+        <label class="checkbox-replacement">
+          <input type="checkbox" <% if meta.active: %>checked<% end %> class="js-active" name="{boolean}public_holidays::<%= day %>::active" value="true">
+          <%- @Icon('checkbox', 'icon-unchecked') %>
+          <%- @Icon('checkbox-checked', 'icon-checked') %>
+        </label>
+      <td><%- @Tdate(day) %>
+      <td><input class="form-control form-control--small js-summary <% if !meta.active: %>is-disabled<% end %>" type="text" name="public_holidays::<%= day %>::summary" value="<%= meta.summary %>" required/>
+      <td>
+        <div class="settings-list-rowControls">
+          <% if !meta.feed: %>
+            <div class="btn btn--text js-remove">
+              <%- @Icon('trash') %> <%- @T('Remove') %>
             </div>
-        <% end %>
+          <% end %>
+        </div>
+    <% end %>
 
-        <tr class="hidden js-placeholder" data-date="">
-          <td>
-            <label class="checkbox-replacement">
-              <input type="checkbox" checked class="js-active" name="" value="true">
-              <%- @Icon('checkbox', 'icon-unchecked') %>
-              <%- @Icon('checkbox-checked', 'icon-checked') %>
-            </label>
-          <td class="js-date">
-          <td><input class="form-control form-control--small js-summary" type="text" name="" value="" required/>
-          <td>
-            <div class="settings-list-rowControls">
-              <div class="btn btn--text js-remove">
-                <%- @Icon('trash') %> <%- @T('Remove') %>
-              </div>
-            </div>
-
-        <tr class="settings-list-controlRow">
-          <td>
-          <td class="js-datePicker">
-            <!-- not supported right now by ff
-            <input class="form-control form-control--small" type="date" placeholder="<%- @T('Date') %>"/>
-            -->
-          <td>
-            <input class="form-control form-control--small js-summary" type="text" placeholder="<%- @T('Description') %>"/>
-          <td>
-            <div class="btn btn--text js-add">
-              <%- @Icon('plus-small') %> <%- @T('Add') %>
-            </div>
-      </tbody>
-    </table>
\ No newline at end of file
+    <tr class="settings-list-controlRow">
+      <td>
+      <td class="js-datePicker">
+        <!-- not supported right now by ff
+        <input class="form-control form-control--small" type="date" placeholder="<%- @T('Date') %>"/>
+        -->
+      <td>
+        <input class="form-control form-control--small js-summary" type="text" placeholder="<%- @T('Description') %>"/>
+      <td>
+        <div class="btn btn--text js-add">
+          <%- @Icon('plus-small') %> <%- @T('Add') %>
+        </div>
+  </tbody>
+</table>
\ No newline at end of file
diff --git a/app/assets/javascripts/app/views/calendar/holiday_selector_placeholder.jst.eco b/app/assets/javascripts/app/views/calendar/holiday_selector_placeholder.jst.eco
new file mode 100644
index 000000000..eddce6e5f
--- /dev/null
+++ b/app/assets/javascripts/app/views/calendar/holiday_selector_placeholder.jst.eco
@@ -0,0 +1,15 @@
+<tr class="" data-date="<%= @placeholderDate %>">
+  <td>
+    <label class="checkbox-replacement">
+      <input type="checkbox" checked class="js-active" name="<%= @nameActive %>" value="true">
+      <%- @Icon('checkbox', 'icon-unchecked') %>
+      <%- @Icon('checkbox-checked', 'icon-checked') %>
+    </label>
+  <td><%- @Tdate(@placeholderDate) %>
+  <td><input class="form-control form-control--small js-summary" type="text" name="<%= @placeholderSummary %>" value="<%= @placeholderSummary %>" required/>
+  <td>
+    <div class="settings-list-rowControls">
+      <div class="btn btn--text js-remove">
+        <%- @Icon('trash') %> <%- @T('Remove') %>
+      </div>
+    </div>
\ No newline at end of file