diff --git a/t/ui/12-needle-edit.t b/t/ui/12-needle-edit.t
index a878aa7192e..12eea7a9349 100644
--- a/t/ui/12-needle-edit.t
+++ b/t/ui/12-needle-edit.t
@@ -334,6 +334,18 @@ my $needlename = 'test-newneedle';
 my $xoffset = my $yoffset = 200;
 
 subtest 'Create new needle' => sub {
+    subtest 'invalid needle tag is rejected' => sub {
+        $elem = $driver->find_element_by_id('newtag');
+        $elem->send_keys('123');
+        my $button = $driver->find_element_by_id('tag_add_button');
+        ok !$button->is_enabled, 'tag too short, Add button not enabled';
+        $elem->send_keys('4');
+        ok $button->is_enabled, 'tag valid, Add button enabled';
+        $elem->send_keys('!');
+        ok !$button->is_enabled, 'tag invalid, Add button not enabled';
+        $elem->clear;
+    };
+
     add_needle_tag();
 
     # check needle name input
diff --git a/templates/webapi/step/edit.html.ep b/templates/webapi/step/edit.html.ep
index 516c57c960c..ad981ead409 100644
--- a/templates/webapi/step/edit.html.ep
+++ b/templates/webapi/step/edit.html.ep
@@ -191,7 +191,7 @@
                             <div class="mb-3 row">
                                 <div class="col-sm-10">
                                     <input type="text" class="form-control" id="newtag" placeholder="Add new tags here"
-                                            pattern="^[A-Za-z0-9-_]+$" minLength=4 title="[A-Za-z0-9-_], at least 4 characters">
+                                            pattern="^[A-Za-z0-9\-_]+$" minLength=4 title="[A-Za-z0-9-_], at least 4 characters">
                                 </div>
                                 <div class="col-sm-2">
                                     <button type="button" class="btn btn-secondary form-control" id="tag_add_button" disabled>Add</button>