Jquery url validation / Allow only specific urls

[mudmin]

i have a url form input where users cann add youtube videos.

if users try to add this url i need to echo a validation error
"https://youtube.com/channelname"

echo a validation error too on this example
"https://otherdomain.com"



i need to allow only values thats contain youtube video urls like this
"https://www.youtube.com/watch?v="



But users needs to type the fully youtube url ... not only the video id

I made a quick demo for you. You can save it in users/whatever.php and then run that file.  https://pastebin.com/01x5GZuT

Essentially what you need to do is give your form an id of "myform"  and your url input an id of "url"  Then add this javascript to the bottom of the page.

Code:

<script type="text/javascript">
$( document ).ready(function() {
   $('#myform').submit(function (e) {
           var url = $("#url").val(); //get the url from the input by the id url
           console.log(url);
           var lowercase = url.toLowerCase(); //temporarily convert to lowercase to avoid issues
           if(lowercase.startsWith('https://www.youtube.com/watch?v=') == false && lowercase.startsWith('https://m.youtube.com/watch?v=') == false) {
               e.preventDefault();
               alert("Invalid youtube url.  Must be https://www.youtube.com/watch?v=xxxxxxx.");
           }
   })

});
</script>

Again, there's a full demo if you want to see it in action.