Home > Mobile >  How can I use specific links and emails for an html form?
How can I use specific links and emails for an html form?

Time:11-20

Is it possible for the link box in an HTML form to accept only links from a specific website? This is the code of the box.

HTML:

<label class="Link"> Link to Tool:</label>
        <input type="url" id="Approval" Placeholder="Tool Link">
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

Also I would like the email box to accept emails only from a specific company how could I do this? I have made this code but it accepts only @company.com emails I would like it to also accept from other countries such as @company.fr, @company.gr etc.

<label class="Email"> Email:</label>
        <input type="email" Placeholder="Email" id="Email" pattern="^[a-zA-Z0-9] @company\.com$" required>
        <script type="text/javascript">
        var input = document.getElementById("Email");
        input.oninvalid = function(event) {
            event.target.setCustomValidity("Please provide an @company email.")
        }
        </script>
<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

For the link this pattern should work : ^https?:\/\/(www\.)?company\.(fr|en|gr|com)\/?([a-zA-Z0-9-] )?$.

  • ? is to allow the previous rule to be null
  • () to catch a group of rules
  • don't forget - so link like http://company.com/contact-us will work to.

For the email you could add all the fr, gr etc ... between parenthesis like that : ^[a-zA-Z0-9] @company\.(com|fr|gr)$. The | is for OR.

(also keep in mind that you can't trust html : similar verifications are necessary in your backend language)

  • Related