33 lines
No EOL
1.1 KiB
HTML
33 lines
No EOL
1.1 KiB
HTML
{% extends 'base.html' %}
|
|
{% load crispy_forms_tags %}
|
|
|
|
{% block title %}Add Friend Code{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container mx-auto max-w-md mt-6">
|
|
<h1 class="text-3xl font-bold mb-4">Add Friend Code</h1>
|
|
<form method="post" class="space-y-4">
|
|
{% csrf_token %}
|
|
{{ form|crispy }}
|
|
<button type="submit" class="btn btn-primary w-full">Add Friend Code</button>
|
|
</form>
|
|
|
|
<div class="mt-4">
|
|
<a href="{% url 'list_friend_codes' %}" class="btn btn-secondary">Back to Friend Codes</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Include Cleave Zen from a CDN -->
|
|
<script src="https://unpkg.com/cleave-zen@0.0.17/dist/cleave-zen.umd.js"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function(){
|
|
// Initialize Cleave Zen on the friend code input field.
|
|
// Make sure that the input ID is correct (e.g., provided by Django's widget rendering).
|
|
new CleaveZen('#id_friend_code', {
|
|
delimiters: ['-', '-', '-'], // Inserts dashes between the blocks.
|
|
blocks: [4, 4, 4, 4],
|
|
numericOnly: true
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %} |