# Loader.js Example

See MyFormConnect's loader.js in action with form processing and validation

## Try It Live

Fill out this form to see real-time validation in action:

## Validation Features Demo

### Try These Invalid Inputs:

- • Email: `invalid-email`
- • Phone: `abc123`
- • Website: `not-a-url`
- • Name: `<script>alert('xss')</script>`

### Security Protection:

- • Blocks HTML tags
- • Prevents XSS attacks
- • Validates email format
- • Checks phone number format
- • Validates URL format

## Implementation Code

Here's how to add this validation to your own forms:

          HTML + JavaScript

```
<!-- Add the loader script -->
<script src="https://myformconnect.io/loader.js" data-client-id="your-form-uuid"></script>

<!-- Your form with validation -->
<form id="my-form">
  <input type="text" name="name" placeholder="Your Name" required>
  <input type="email" name="email" placeholder="Your Email" required>
  <input type="tel" name="phone" placeholder="Phone Number">
  <textarea name="message" placeholder="Your Message"></textarea>
  <button type="submit">Submit</button>
</form>

<script>
  // Initialize validation when page loads
  document.addEventListener('DOMContentLoaded', function() {
    var form = document.getElementById('my-form');
    if (window.MyFormCapture && form) {
      MyFormCapture.utils.initializeForm(form);
    }
  });
</script>
```