Validate a link in input

Asked

Viewed 737 times

1

Good people, I wanted to make a form where an input is required to enter a Steam link. How do I do? Thank you.

  • Meter, what context hahaha. Have you tried HMTL5 Pattern? What type of link do you want to validate from Steam? There are several. Example: The user profile link?

  • I’ve used Pattern, profile link

  • Why don’t you just ask for the user id and mount the link yourself, since it’s a default link? It would be much more practical than leaving this dependency in the hands of those who sign up for this form.

  • What do you mean? how do I mount the link?

  • Each person has a specific Steam link

  • My link from Stem: http://steamcommunity.com/id/damondudek2 My other link: http://steamcommunity.com/id/damondudek1 See what changes is just the id? Just enter the Steam ID field in your form. You would mount the link: http://steamcommunity.com/id/ + "Input value"

  • But in some cases the Steam link looks like this: http://steamcommunity.com/profiles/78125979852/

Show 2 more comments

2 answers

1

By tag I assume you are using Plguin jquery jquery.validationEngine.js, if that’s so, then first download the files in https://github.com/posabsolute/jQuery-Validation-Engine (if necessary).

If the field is required:

class="validate[required,custom[url]] text-input"

If the field is optional:

class="validate[custom[url]] text-input"

The use should be something like:

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="../css/validationEngine.jquery.css" type="text/css"/>
    <script src="../js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="../js/languages/jquery.validationEngine-pt-br.js" type="text/javascript"></script>
    <script src="../js/jquery.validationEngine.js" type="text/javascript"></script>
    <script>
    jQuery(document).ready(function(){
        jQuery("#meuFormulario").validationEngine();
    });
    </script>
</head>
<body>

    <form id="meuFormulario" class="formular" method="post">
        <label>
            <span>Field is optional : </span>
            <input value="" class="validate[custom[url]] text-input" type="text" name="optional" id="optional" />
        </label>
        <button>Enviar</button>
    </form>
</body>
</html>

Now if you want to actually check if the link is from Steam, you can create your own validator, for example in HTML do something like:

 <input value="" class="validate[required,funcCall[checarLinkSteam]] text-input" type="text" id="linksteam" name="linksteam" />

If the link is from a profile you can validate with regex like this (in this example it accepts the id and the url with profile):

/^http://steamcommunity\.com/(id|profile)/([^/]+)$/.test(...)

If it is any Steam link you can validate like this:

/^http://steamcommunity\.com/([^/]+)$/.test(...)

In the script add:

    <script>
    jQuery(document).ready(function(){
        jQuery("#meuFormulario").validationEngine();
    });

    function checarLinkSteam(field, rules, i, options){

        //Valida se é um profile (o ! na frente é para negação, basico uso de IFs)
        if (!/^http://steamcommunity\.com/(id|profile)/([^/]+)$/.test(field.val())) {
            return options.allrules.validate2fields.alertText;
        }
    }
    </script>
</head>

Based on examples: https://github.com/posabsolute/jQuery-Validation-Engine/blob/master/demos/demoValidators.html

0

Specifically the field being a Steam link there is nothing ready that I know, but at first you can use the , to specifically check if the user is inputando a link , you can later do a check of the typed string using some javascript function, follow some solutions. How can I check if one string contains another in Javascript?

  • The field must be the link thus: http://steamcommunity.com/id/NeroParty/ or so http://steamcommunity.com/profile/417421894982

Browser other questions tagged

You are not signed in. Login or sign up in order to post.