CODEWITHSUNDEEP
regexhtmlformsvalidationthymeleaf
Abbas Tolgay Yılmaz
Abbas Tolgay Yılmaz

Reputation: 93

Form validation, HTML5 pattern does not match

I am new in Thymeleaf, had searched on the web and SO for usage of html regex. I am not passing a th:object to my frontend for this page, hence What I would like is to handle validation with a pattern attribute in the form input. Would like to warn user if they don't enter extension for the file. (".xml" in this case). So I'd like to see if string contains substring or not.

However could not see why following fails. (Used the fileName field with pattern="/xml/", since static value is being checked on the regex. Also tried th:pattern but no luck.)

<html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout" layout:decorator="@{layouts/main}">
<div layout:fragment="content" class="container">
  <div class="page-header">
    <h2>Add New Project</h2>
  </div>
  <!-- multistep form -->
  <div id="msform">
    <!-- progressbar -->
    <ul id="progressbar">
      <li class="active">Project Details</li>
      <li>Choose operations</li>
      <li>Save operations</li>
      <li>project saved</li>
    </ul>
    <form id="project-details" class="project" method="post">
      <h2 class="fs-title">Project Details</h2>
      <h3 class="fs-subtitle">This is step 1</h3>
      <input type="text" th:field="${testSuitProject.name}" placeholder="Project Name" />
      <input type="text" th:field="${testSuitProject.endpoint}" placeholder="Service End Point" />
      <input type="text" th:field="${testSuitProject.fileName}" placeholder="FileName ex: sample_project.xml" pattern="/xml/" />
      <input type="submit" name="next" id="btn-first" class="next action-button" value="Next" />
    </form>
  </div>
</div>

Any suggestions appreciated.

Upvotes: 0

Views: 644

Answers (1)

holmis83
holmis83

Reputation: 16644

Your regex is simply wrong. To match string to end with ".xml":

<input type="text" placeholder="FileName ex: sample_project.xml" pattern=".*\.xml" />

.* = match any characters (in the beginning of the string).

\. = a literal dot, since dot means any character in regex.

(Maybe you confuse with JavaScript where reg expression is surrounded by /:es to create a regex object.)

Upvotes: 1

Related Questions