diff --git a/lib/NGCP/Panel/Controller/Header.pm b/lib/NGCP/Panel/Controller/Header.pm
index 615f757ba3..1432edd9d9 100644
--- a/lib/NGCP/Panel/Controller/Header.pm
+++ b/lib/NGCP/Panel/Controller/Header.pm
@@ -270,6 +270,16 @@ sub rules_list :Chained('set_base') :PathPart('rules') :CaptureArgs(0) {
         order_by => { -asc => 'priority' },
     });
     $c->stash(rules_rs => $rules_rs);
+
+    $c->stash->{rule_dt_columns} = NGCP::Panel::Utils::Datatables::set_columns($c, [
+        { name => 'priority', search => 0, title => $c->loc('Priority') },
+        { name => 'id', search => 1, title => $c->loc('#') },
+        { name => 'name', search => 1, title => $c->loc('Name') },
+        { name => 'description', search => 1, title => $c->loc('Description') },
+        { name => 'stopper', search => 1, title => $c->loc('Stopper') },
+        { name => 'enabled', search => 1, title => $c->loc('Enabled') },
+    ]);
+
     $c->stash(rules_uri => $c->uri_for_action("/header/rules_root", [$c->req->captures->[0]]));
 
     $c->stash(template => 'header/rules_list.tt');
@@ -323,6 +333,13 @@ sub rules_root :Chained('rules_list') :PathPart('') :Args(0) {
     return;
 }
 
+sub rules_ajax :Chained('rules_list') :PathPart('ajax') :Args(0) {
+    my ($self, $c) = @_;
+    my $rs = $c->stash->{rules_rs};
+    NGCP::Panel::Utils::Datatables::process($c, $rs, $c->stash->{rule_dt_columns});
+    $c->detach( $c->view("JSON") );
+}
+
 sub rules_base :Chained('rules_list') :PathPart('') :CaptureArgs(1) {
     my ($self, $c, $rule_id) = @_;
 
@@ -456,8 +473,21 @@ sub conditions_list :Chained('rules_base') :PathPart('conditions') :CaptureArgs(
     my ( $self, $c ) = @_;
 
     my $conditions_rs = $c->stash->{rule_result}->conditions;
+
     $c->stash(conditions_rs => $conditions_rs);
 
+    $c->stash->{condition_dt_columns} = NGCP::Panel::Utils::Datatables::set_columns($c, [
+        { name => 'id', search => 1, title => $c->loc('#') },
+        { name => 'match_type', search => 1, title => $c->loc('Match') },
+        { name => 'match_part', search => 1, title => $c->loc('Part') },
+        { name => 'match_name', search => 1, title => $c->loc('Name') },
+        { name => 'expression', search => 1, title => $c->loc('Expression') },
+        { name => 'value_type', search => 1, title => $c->loc('Type') },
+        { name => 'c_values', search => 0, title => $c->loc('Values') },
+        { name => 'c_rwr_set', search => 0, title => $c->loc('Rewrite Rule Set') },
+        { name => 'enabled', search => 1, title => $c->loc('Enabled') },
+    ]);
+
     $c->stash(conditions_uri => $c->uri_for_action("/header/conditions_root", $c->req->captures));
 
     $c->stash(template => 'header/conditions_list.tt');
@@ -469,26 +499,36 @@ sub conditions_root :Chained('conditions_list') :PathPart('') :Args(0) {
 
     my $conditions_rs = $c->stash->{conditions_rs};
 
-    my @conditions = ();
+    $c->stash(conditions => [ $conditions_rs->all ] );
 
-    foreach my $condition ($conditions_rs->all) {
-        my $row = { $condition->get_inflated_columns };
-        @{$row->{values}} = map { $_->value } $condition->values->all;
-        push @conditions, $row;
-        if ($row->{rwr_set_id}) {
-                my $rwr_set = { $condition->rwr_set->get_inflated_columns };
-                $row->{rwr_set} = $rwr_set->{name};
-                my $dp_id = $row->{rwr_dp_id} // 0;
-                ($row->{rwr_dp}) =
-                    grep { $_ =~ /_dpid/ && $rwr_set->{$_} eq $dp_id }
-                        keys %{$rwr_set};
-        }
-    }
-
-    $c->stash(conditions => \@conditions);
     return;
 }
 
+sub conditions_ajax :Chained('conditions_list') :PathPart('rules_ajax') :Args(0) {
+    my ($self, $c) = @_;
+    my $rs = $c->stash->{conditions_rs};
+    NGCP::Panel::Utils::Datatables::process($c, $rs, $c->stash->{condition_dt_columns}, sub {
+        my $item = shift;
+        my %cols = $item->get_inflated_columns;
+        my ($c_rwr_set, $c_rwr_dp) = ('','');
+        if ($cols{rwr_set_id}) {
+            my %rwr_set = $item->rwr_set->get_inflated_columns;
+            $c_rwr_set = $rwr_set{name};
+            my $dp_id = $cols{rwr_dp_id} // 0;
+            ($c_rwr_dp) =
+                grep { $_ =~ /_dpid/ && $rwr_set{$_} eq $dp_id }
+                    keys %rwr_set;
+            $c_rwr_dp =~ s/_dpid$//;
+        }
+        return (
+            expression => ($cols{expression_negation} ? ' ! ' : ' ') . $cols{expression},
+            c_values => join("<br/>", map { $_->value } $item->values->all) // '',
+            c_rwr_set => $c_rwr_set ? "$c_rwr_set ($c_rwr_dp)" : '',
+        );
+    });
+    $c->detach( $c->view("JSON") );
+}
+
 sub conditions_base :Chained('conditions_list') :PathPart('') :CaptureArgs(1) {
     my ($self, $c, $condition_id) = @_;
 
@@ -695,6 +735,18 @@ sub actions_list :Chained('rules_base') :PathPart('actions') :CaptureArgs(0) {
     });
     $c->stash(actions_rs => $actions_rs);
 
+    $c->stash->{action_dt_columns} = NGCP::Panel::Utils::Datatables::set_columns($c, [
+        { name => 'priority', search => 0, title => $c->loc('Priority') },
+        { name => 'id', search => 1, title => $c->loc('#') },
+        { name => 'header', search => 1, title => $c->loc('Header') },
+        { name => 'header_part', search => 1, title => $c->loc('Part') },
+        { name => 'action_type', search => 1, title => $c->loc('Type') },
+        { name => 'value_part', search => 1, title => $c->loc('Value Part') },
+        { name => 'value', search => 1, title => $c->loc('Value') },
+        { name => 'c_rwr_set', search => 0, title => $c->loc('Rewrite Rule Set') },
+        { name => 'enabled', search => 1, title => $c->loc('Enabled') },
+    ]);
+
     $c->stash(actions_uri => $c->uri_for_action("/header/actions_root", $c->req->captures));
 
     $c->stash(template => 'header/actions_list.tt');
@@ -744,25 +796,34 @@ sub actions_root :Chained('actions_list') :PathPart('') :Args(0) {
         }
     }
 
-    my @actions = ();
+    $c->stash(actions => [ $actions_rs->all ]);
 
-    foreach my $action ($actions_rs->all) {
-        my $row = { $action->get_inflated_columns };
-        push @actions, $row;
-        if ($row->{rwr_set_id}) {
-                my $rwr_set = { $action->rwr_set->get_inflated_columns };
-                $row->{rwr_set} = $rwr_set->{name};
-                my $dp_id = $row->{rwr_dp_id} // 0;
-                ($row->{rwr_dp}) =
-                    grep { $_ =~ /_dpid/ && $rwr_set->{$_} eq $dp_id }
-                        keys %{$rwr_set};
-        }
-    }
-
-    $c->stash(actions => \@actions);
     return;
 }
 
+sub actions_ajax :Chained('actions_list') :PathPart('rules_ajax') :Args(0) {
+    my ($self, $c) = @_;
+    my $rs = $c->stash->{actions_rs};
+    NGCP::Panel::Utils::Datatables::process($c, $rs, $c->stash->{action_dt_columns}, sub {
+        my $item = shift;
+        my %cols = $item->get_inflated_columns;
+        my ($c_rwr_set, $c_rwr_dp) = ('','');
+        if ($cols{rwr_set_id}) {
+            my %rwr_set = $item->rwr_set->get_inflated_columns;
+            $c_rwr_set = $rwr_set{name};
+            my $dp_id = $cols{rwr_dp_id} // 0;
+            ($c_rwr_dp) =
+                grep { $_ =~ /_dpid/ && $rwr_set{$_} eq $dp_id }
+                    keys %rwr_set;
+            $c_rwr_dp =~ s/_dpid$//;
+        }
+        return (
+            c_rwr_set => $c_rwr_set ? "$c_rwr_set ($c_rwr_dp)" : '',
+        );
+    });
+    $c->detach( $c->view("JSON") );
+}
+
 sub actions_base :Chained('actions_list') :PathPart('') :CaptureArgs(1) {
     my ($self, $c, $action_id) = @_;
 
diff --git a/share/templates/header/actions_edit.tt b/share/templates/header/actions_edit.tt
deleted file mode 100644
index 4b8c7a0dd9..0000000000
--- a/share/templates/header/actions_edit.tt
+++ /dev/null
@@ -1,88 +0,0 @@
-[% site_config.title = c.loc('Header Rules for [_1]', set_result.name) -%]
-
-<div class="row">
-    <span>
-        <a class="btn btn-primary btn-large" href="[% c.uri_for('/back') %]"><i class="icon-arrow-left"></i> [% c.loc('Back') %]</a>
-    </span>
-    [% back_created = 1 -%]
-    [% UNLESS c.user.read_only -%]
-    <span>
-    <a class="btn btn-primary btn-large" href="[% c.uri_for_action('/header/rules_create', [c.req.captures.0]) %]"><i class="icon-star"></i> [% c.loc('Create Header Rule') %]</a>
-    </span>
-    [% END -%]
-</div>
-
-[% IF messages -%]
-<div class="row">
-    [% FOREACH m IN messages -%]
-        <div class="alert alert-[% m.type %]">[% m.text %]</div>
-    [% END -%]
-</div>
-[% END -%]
-
-<div class="ngcp-separator"></div>
-<table class="table table-bordered table-striped table-highlight table-hover">
-    <thead>
-        <tr>
-            <th></th>
-            <th>[% c.loc('Name') %]</th>
-            <th>[% c.loc('Description') %]</th>
-            <th class="ngcp-actions-column"></th>
-        </tr>
-    </thead>
-    <tbody>
-    [% FOR r IN rules %]
-        <tr class="sw_action_row">
-            <td>
-                    <a href="[% c.uri_for_action('/header/rules_root',[set_result.id], 'move' => r.id, 'where' => 'up') %]">
-                        <i class="icon-arrow-up"></i>
-                    </a>
-                    <a href="[% c.uri_for_action('/header/rules_root',[set_result.id], 'move' => r.id, 'where' => 'down') %]">
-                        <i class="icon-arrow-down"></i>
-                    </a>
-            </td>
-            <td>[% r.name %]</td>
-            <td>[% r.description %]</td>
-            <td class="ngcp-actions-column">
-            [% UNLESS c.user.read_only -%]
-                <div class="sw_actions pull-right">
-                    [%- FILTER null;
-                            backuritmp=c.req.uri;
-                            backuritmp.query_param_delete('back');
-                            backuritmp.query_param_delete('move');
-                            backuritmp.query_param_delete('where');
-                        END;
-                    %]
-                    <a class="btn btn-small btn-primary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/rules_edit',[set_result.id, r.id]) %]">
-                        <i class="icon-edit"></i> [% c.loc('Edit') %]
-                    </a>
-                    <a class="btn btn-small btn-primary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/conditions_edit',[set_result.id, r.id]) %]">
-                        <i class="icon-cog"></i> [% c.loc('Conditions') %]
-                    </a>
-                    <a class="btn btn-small btn-primary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/actions_edit',[set_result.id, r.id]) %]">
-                        <i class="icon-star"></i> [% c.loc('Actions') %]
-                    </a>
-                    <a data-confirm="Delete" class="btn btn-small btn-secondary" href="[% c.uri_for_action('/header/rules_delete',[set_result.id, r.id]) %]">
-                        <i class="icon-trash"></i> [% c.loc('Delete') %]
-                    </a>
-                </div>
-            [% END -%]
-            </td>
-        </tr>
-    [% END %]
-    </tbody>
-</table>
-
-[% IF edit_flag || create_flag -%]
-[%
-    PROCESS "helpers/modal.tt";
-    modal_header(m.name = c.loc('Header Rule'),
-                 m.create_flag = create_flag);
-    form.render;
-    modal_footer();
-    modal_script(m.close_target = rules_uri);
--%]
-[% END -%]
-
-
-[% # vim: set tabstop=4 syntax=html expandtab: -%]
diff --git a/share/templates/header/actions_list.tt b/share/templates/header/actions_list.tt
index 1c16d42a8d..7b25fcdd34 100644
--- a/share/templates/header/actions_list.tt
+++ b/share/templates/header/actions_list.tt
@@ -1,104 +1,32 @@
 [% site_config.title = c.loc('Header Rule Actions for [_1]', rule_result.name) -%]
 
-<div class="row">
-    <span>
-        <a class="btn btn-primary btn-large" href="[% c.uri_for_action('/header/rules_root',[set_result.id]) %]"><i class="icon-arrow-left"></i> [% c.loc('Back') %]</a>
-    </span>
-    [% back_created = 1 -%]
-    [% UNLESS c.user.read_only -%]
-    <span>
-    <a class="btn btn-primary btn-large" href="[% c.uri_for_action("/header/actions_create", [set_result.id, rule_result.id]) %]"><i class="icon-star"></i> [% c.loc('Create Header Rule Action') %]</a>
-    </span>
-    [% END -%]
-    <span>
-    <a class="btn btn-teritary btn-large" data-backuri="[% c.uri_for_action('/header/rules_list',[set_result.id]) %]" href="[% c.uri_for_action('/header/conditions_root',[set_result.id, rule_result.id]) %]"><i class="icon-glass"></i> [% c.loc('Conditions') %]</a>
-    </span>
-</div>
-
-[% IF messages -%]
-<div class="row">
-    [% FOREACH m IN messages -%]
-        <div class="alert alert-[% m.type %]">[% m.text %]</div>
-    [% END -%]
-</div>
-[% END -%]
+[%
+    helper.name = c.loc('Header Rule Actions');
+    helper.identifier = 'header_rule_actions';
+    helper.messages = messages;
+    helper.dt_columns = action_dt_columns;
+    helper.length_change = 1;
 
-<div class="ngcp-separator"></div>
-<table class="table table-bordered table-striped table-highlight table-hover">
-    <thead>
-        <tr>
-            <th></th>
-            <th>[% c.loc('Header') %]</th>
-            <th>[% c.loc('Part') %]</th>
-            <th>[% c.loc('Type') %]</th>
-            <th>[% c.loc('Value Part') %]</th>
-            <th>[% c.loc('Value') %]</th>
-            <th>[% c.loc('Rewrite Rule Set') %]</th>
-            <th>[% c.loc('Rewrite Rules') %]</th>
-            <th>[% c.loc('Enabled') %]</th>
-            <th class="ngcp-actions-column"></th>
-        </tr>
-    </thead>
-    <tbody>
-    [% FOR action IN actions %]
-        <tr class="sw_action_row">
-            <td>
-                    [% IF action != actions.first %]
-                    <a href="[% c.uri_for_action('/header/actions_root',[set_result.id, rule_result.id], 'move' => action.id, 'where' => 'up') %]">
-                        <i class="icon-arrow-up"></i>
-                    </a>
-                    [% END %]
-                    [% IF action != actions.last %]
-                    <a href="[% c.uri_for_action('/header/actions_root',[set_result.id, rule_result.id], 'move' => action.id, 'where' => 'down') %]">
-                        <i class="icon-arrow-down"></i>
-                    </a>
-                    [% END %]
-            </td>
-            <td>[% action.header %]</td>
-            <td>[% action.header_part %]</td>
-            <td>[% action.action_type %]</td>
-            <td>[% action.value_part %]</td>
-            <td>[% action.value %]</td>
-            <td>[% action.rwr_set %]</td>
-            <td>[% action.rwr_dp %]</td>
-            <td>[% action.enabled %]</td>
-            <td class="ngcp-actions-column">
-            [% UNLESS c.user.read_only -%]
-                <div class="sw_actions pull-right">
-                    [%- FILTER null;
-                            backuritmp=c.req.uri;
-                            backuritmp.query_param_delete('back');
-                            backuritmp.query_param_delete('move');
-                            backuritmp.query_param_delete('where');
-                        END;
-                    %]
-                    <a class="btn btn-small btn-primary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/actions_edit',[set_result.id, rule_result.id, action.id]) %]">
-                        <i class="icon-edit"></i> [% c.loc('Edit') %]
-                    </a>
-                    <a data-confirm="Delete" class="btn btn-small btn-secondary" href="[% c.uri_for_action('/header/actions_delete',[set_result.id, rule_result.id, action.id]) %]">
-                        <i class="icon-trash"></i> [% c.loc('Delete') %]
-                    </a>
-                </div>
-            [% END -%]
-            </td>
-        </tr>
-    [% END %]
-    </tbody>
-</table>
+    helper.close_target = close_target;
+    helper.create_flag = create_flag;
+    helper.edit_flag = edit_flag;
+    helper.form_object = form;
+    helper.ajax_uri = c.uri_for_action( "/header/actions_ajax", [c.req.captures.0, c.req.captures.1] );
 
-[% IF edit_flag || create_flag -%]
-[%
-    IF form.has_for_js;
-        form.render_repeatable_js;
+    UNLESS c.user.read_only;
+        helper.dt_buttons = [
+            { uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/actions/?move='+full.id+'&where=up", class = 'btn-small btn-primary', icon = 'icon-arrow-up' },
+            { uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/actions/?move='+full.id+'&where=down", class = 'btn-small btn-primary', icon = 'icon-arrow-down' },
+            { name = c.loc('Edit'), uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/actions/'+full.id+'/edit", class = 'btn-small btn-primary', icon = 'icon-edit' },
+            { name = c.loc('Delete'), uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/actions/'+full.id+'/delete", class = 'btn-small btn-secondary', icon = 'icon-trash' },
+        ];
+        helper.top_buttons = [
+            { name = c.loc('Create Header Rule Action'), uri = c.uri_for_action('/header/actions_create', [c.req.captures.0, c.req.captures.1]), icon = 'icon-star' },
+            { name = c.loc('Conditions'), uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/conditions", class = 'btn btn-teritary btn-large', icon = 'icon-play' },
+        ];
     END;
-    PROCESS "helpers/modal.tt";
-    modal_header(m.name = c.loc('Header Rule Actions'),
-                 m.create_flag = create_flag);
-    form.render;
-    modal_footer();
-    modal_script(m.close_target = actions_uri);
--%]
-[% END -%]
 
+    PROCESS 'helpers/datatables.tt';
+-%]
 
 [% # vim: set tabstop=4 syntax=html expandtab: -%]
diff --git a/share/templates/header/conditions_list.tt b/share/templates/header/conditions_list.tt
index 3f369b79cb..6c654dcd71 100644
--- a/share/templates/header/conditions_list.tt
+++ b/share/templates/header/conditions_list.tt
@@ -1,86 +1,30 @@
 [% site_config.title = c.loc('Header Rule Conditions for [_1]', rule_result.name) -%]
 
-<div class="row">
-    <span>
-        <a class="btn btn-primary btn-large" href="[% c.uri_for_action('/header/rules_root',[set_result.id]) %]"><i class="icon-arrow-left"></i> [% c.loc('Back') %]</a>
-    </span>
-    [% back_created = 1 -%]
-    [% UNLESS c.user.read_only -%]
-    <span>
-    <a class="btn btn-primary btn-large" href="[% c.uri_for_action("/header/conditions_create", [set_result.id, rule_result.id]) %]"><i class="icon-star"></i> [% c.loc('Create Header Rule Condition') %]</a>
-    </span>
-    [% END -%]
-    <span>
-    <a class="btn btn-teritary btn-large" href="[% c.uri_for_action('/header/actions_root',[set_result.id, rule_result.id]) %]"><i class="icon-play"></i> [% c.loc('Actions') %]</a>
-    </span>
-</div>
-
-[% IF messages -%]
-<div class="row">
-    [% FOREACH m IN messages -%]
-        <div class="alert alert-[% m.type %]">[% m.text %]</div>
-    [% END -%]
-</div>
-[% END -%]
+[%
+    helper.name = c.loc('Header Rule Conditions');
+    helper.identifier = 'header_rule_conditions';
+    helper.messages = messages;
+    helper.dt_columns = condition_dt_columns;
+    helper.length_change = 1;
 
-<div class="ngcp-separator"></div>
-<table class="table table-bordered table-striped table-highlight table-hover">
-    <thead>
-        <tr>
-            <th>[% c.loc('Match') %]</th>
-            <th>[% c.loc('Part') %]</th>
-            <th>[% c.loc('Name') %]</th>
-            <th>[% c.loc('Expression') %]</th>
-            <th>[% c.loc('Type') %]</th>
-            <th>[% c.loc('Values') %]</th>
-            <th>[% c.loc('Rewrite Rule Set') %]</th>
-            <th>[% c.loc('Rewrite Rules') %]</th>
-            <th>[% c.loc('Enabled') %]</th>
-            <th class="ngcp-actions-column"></th>
-        </tr>
-    </thead>
-    <tbody>
-    [% FOR condition IN conditions %]
-        <tr class="sw_action_row">
-            <td>[% condition.match_type %]</td>
-            <td>[% condition.match_part %]</td>
-            <td>[% condition.match_name %]</td>
-            <td>[% IF condition.expression_negation %] ! [% END %][% condition.expression %]</td>
-            <td>[% condition.value_type %]</td>
-            <td>[% condition.values.join('<br/>') %]</td>
-            <td>[% condition.rwr_set %]</td>
-            <td>[% condition.rwr_dp %]</td>
-            <td>[% condition.enabled %]</td>
-            <td class="ngcp-actions-column">
-            [% UNLESS c.user.read_only -%]
-                <div class="sw_actions pull-right">
-                    <a class="btn btn-small btn-primary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/conditions_edit',[set_result.id, rule_result.id, condition.id]) %]">
-                        <i class="icon-edit"></i> [% c.loc('Edit') %]
-                    </a>
-                    <a data-confirm="Delete" class="btn btn-small btn-secondary" href="[% c.uri_for_action('/header/conditions_delete',[set_result.id, rule_result.id, condition.id]) %]">
-                        <i class="icon-trash"></i> [% c.loc('Delete') %]
-                    </a>
-                </div>
-            [% END -%]
-            </td>
-        </tr>
-    [% END %]
-    </tbody>
-</table>
+    helper.close_target = close_target;
+    helper.create_flag = create_flag;
+    helper.edit_flag = edit_flag;
+    helper.form_object = form;
+    helper.ajax_uri = c.uri_for_action( "/header/conditions_ajax", [c.req.captures.0, c.req.captures.1] );
 
-[% IF edit_flag || create_flag -%]
-[%
-    IF form.has_for_js;
-        form.render_repeatable_js;
+    UNLESS c.user.read_only;
+        helper.dt_buttons = [
+            { name = c.loc('Edit'), uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/conditions/'+full.id+'/edit", class = 'btn-small btn-primary', icon = 'icon-edit' },
+            { name = c.loc('Delete'), uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/conditions/'+full.id+'/delete", class = 'btn-small btn-secondary', icon = 'icon-trash' },
+        ];
+        helper.top_buttons = [
+            { name = c.loc('Create Header Rule Condition'), uri = c.uri_for_action('/header/conditions_create', [c.req.captures.0, c.req.captures.1]), icon = 'icon-star' },
+            { name = c.loc('Actions'), uri = "/header/" _ set_result.id _ "/rules/" _ rule_result.id _ "/actions", class = 'btn btn-teritary btn-large', icon = 'icon-play' },
+        ];
     END;
-    PROCESS "helpers/modal.tt";
-    modal_header(m.name = c.loc('Header Rule Conditions'),
-                 m.create_flag = create_flag);
-    form.render;
-    modal_footer();
-    modal_script(m.close_target = conditions_uri);
--%]
-[% END -%]
 
+    PROCESS 'helpers/datatables.tt';
+-%]
 
 [% # vim: set tabstop=4 syntax=html expandtab: -%]
diff --git a/share/templates/header/rules_list.tt b/share/templates/header/rules_list.tt
index 983c168860..4dec9d0ad1 100644
--- a/share/templates/header/rules_list.tt
+++ b/share/templates/header/rules_list.tt
@@ -1,98 +1,35 @@
 [% site_config.title = c.loc('Header Rules for [_1]', set_result.name) -%]
 
-<div class="row">
-    <span>
-        <a class="btn btn-primary btn-large" href="[% c.uri_for('/back') %]"><i class="icon-arrow-left"></i> [% c.loc('Back') %]</a>
-    </span>
-    [% back_created = 1 -%]
-    [% UNLESS c.user.read_only -%]
-    <span>
-    <a class="btn btn-primary btn-large" href="[% c.uri_for_action('/header/rules_create', [c.req.captures.0]) %]"><i class="icon-star"></i> [% c.loc('Create Header Rule') %]</a>
-    </span>
-    [% END -%]
-</div>
+[%
+    helper.name = c.loc('Header Rules');
+    helper.identifier = 'header_rules';
+    helper.messages = messages;
+    helper.dt_columns = rule_dt_columns;
+    helper.length_change = 1;
 
-[% IF messages -%]
-<div class="row">
-    [% FOREACH m IN messages -%]
-        <div class="alert alert-[% m.type %]">[% m.text %]</div>
-    [% END -%]
-</div>
-[% END -%]
+    helper.close_target = close_target;
+    helper.create_flag = create_flag;
+    helper.edit_flag = edit_flag;
+    helper.form_object = form;
+    helper.ajax_uri = c.uri_for_action( "/header/rules_ajax", [c.req.captures.0] );
 
-<div class="ngcp-separator"></div>
-<table class="table table-bordered table-striped table-highlight table-hover">
-    <thead>
-        <tr>
-            <th></th>
-            <th>[% c.loc('Name') %]</th>
-            <th>[% c.loc('Direction') %]</th>
-            <th>[% c.loc('Description') %]</th>
-            <th>[% c.loc('Stopper') %]</th>
-            <th>[% c.loc('Enabled') %]</th>
-            <th class="ngcp-actions-column"></th>
-        </tr>
-    </thead>
-    <tbody>
-    [% FOR r IN rules %]
-        <tr class="sw_action_row">
-            <td>
-                    [% IF r != rules.first %]
-                    <a href="[% c.uri_for_action('/header/rules_root',[set_result.id], 'move' => r.id, 'where' => 'up') %]">
-                        <i class="icon-arrow-up"></i>
-                    </a>
-                    [% END %]
-                    [% IF r != rules.last %]
-                    <a href="[% c.uri_for_action('/header/rules_root',[set_result.id], 'move' => r.id, 'where' => 'down') %]">
-                        <i class="icon-arrow-down"></i>
-                    </a>
-                    [% END %]
-            </td>
-            <td>[% r.name %]</td>
-            <td>[% r.direction %]</td>
-            <td>[% r.description %]</td>
-            <td>[% r.stopper %]</td>
-            <td>[% r.enabled %]</td>
-            <td class="ngcp-actions-column">
-            [% UNLESS c.user.read_only -%]
-                <div class="sw_actions pull-right">
-                    [%- FILTER null;
-                            backuritmp=c.req.uri;
-                            backuritmp.query_param_delete('back');
-                            backuritmp.query_param_delete('move');
-                            backuritmp.query_param_delete('where');
-                        END;
-                    %]
-                    <a class="btn btn-small btn-primary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/rules_edit',[set_result.id, r.id]) %]">
-                        <i class="icon-edit"></i> [% c.loc('Edit') %]
-                    </a>
-                    <a class="btn btn-small btn-tertiary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/conditions_root',[set_result.id, r.id]) %]">
-                        <i class="icon-glass"></i> [% c.loc('Conditions') %]
-                    </a>
-                    <a class="btn btn-small btn-tertiary" data-backuri="[%-backuritmp-%]" href="[% c.uri_for_action('/header/actions_root',[set_result.id, r.id]) %]">
-                        <i class="icon-play"></i> [% c.loc('Actions') %]
-                    </a>
-                    <a data-confirm="Delete" class="btn btn-small btn-secondary" href="[% c.uri_for_action('/header/rules_delete',[set_result.id, r.id]) %]">
-                        <i class="icon-trash"></i> [% c.loc('Delete') %]
-                    </a>
-                </div>
-            [% END -%]
-            </td>
-        </tr>
-    [% END %]
-    </tbody>
-</table>
+    UNLESS c.user.read_only;
+        helper.dt_buttons = [
+            { uri = "/header/" _ set_result.id _ "/rules/?move='+full.id+'&where=up", class = 'btn-small btn-primary', icon = 'icon-arrow-up' },
+            { uri = "/header/" _ set_result.id _ "/rules/?move='+full.id+'&where=down", class = 'btn-small btn-primary', icon = 'icon-arrow-down' },
+            { name = c.loc('Edit'), uri = "/header/" _ set_result.id _ "/rules/'+full.id+'/edit", class = 'btn-small btn-primary', icon = 'icon-edit' },
+            { name = c.loc('Conditions'), uri = "/header/"_ set_result.id _ "/rules/'+full.id+'/conditions", class = 'btn-small btn-tertiary', icon = 'icon-glass' },
+            { name = c.loc('Actions'), uri = "/header/"_ set_result.id _ "/rules/'+full.id+'/actions", class = 'btn-small btn-tertiary', icon = 'icon-play' },
+            { name = c.loc('Delete'), uri = "/header/" _ set_result.id _ "/rules/'+full.id+'/delete", class = 'btn-small btn-secondary', icon = 'icon-trash' },
+        ];
+        helper.top_buttons = [
+            { name = c.loc('Create Header Rule'), uri = c.uri_for_action('/header/rules_create', [c.req.captures.0]), icon = 'icon-star' },
+        ];
+    END;
 
-[% IF edit_flag || create_flag -%]
-[%
-    PROCESS "helpers/modal.tt";
-    modal_header(m.name = c.loc('Header Rule'),
-                 m.create_flag = create_flag);
-    form.render;
-    modal_footer();
-    modal_script(m.close_target = rules_uri);
+    PROCESS 'helpers/datatables.tt';
 -%]
-[% END -%]
+
 
 
 [% # vim: set tabstop=4 syntax=html expandtab: -%]