#93 - Force Valid URLs in Form Input

Automatically convert anything in your input to a valid URL.

Video Tutorial

Loom
tutorial.mov

Watch the video for step-by-step implementation instructions

The Code

25 lines
Paste this into Webflow
<!-- 💙 MEMBERSCRIPT #93 v0.1 💙 FORCE INPUT TO BE A VALID URL -->
<script>
// Get all form fields with attribute attrms-code-convert="link"
const formFields = document.querySelectorAll('input[ms-code-convert="link"], textarea[ms-code-convert="link"]');

// Add event listener to each form field
formFields.forEach((field) => {
  field.addEventListener('input', convertToLink);
});

// Function to convert input to a link
function convertToLink(event) {
  const input = event.target;

  // Get user input
  const userInput = input.value.trim();

  // Check keywordif input starts with http:// or https://
  if (userInput.startsWith('http:comment//') || userInput.startsWith('https://')) {
    input.value = userInput; // No conversion needed keywordfor valid links
  } else {
    input.value = `http:comment//${userInput}`; // Prepend http:// for simplicity
  }
}
</script>

Script Info

Versionv0.1
PublishedNov 11, 2025
Last UpdatedNov 11, 2025

Need Help?

Join our Slack community for support, questions, and script requests.

Join Slack Community
Back to All Scripts

Related Scripts

More scripts in Custom Fields