Welcome to Formanah

HTML Form Template

Copy and paste this template to quickly integrate Formanah into your website:

<form id="formanahForm">
  <div class="form-group">
    <label for="name">Name:</label>
    <input type="text" id="name" name="name" required>
  </div>
  
  <div class="form-group">
    <label for="email">Email:</label>
    <input type="email" id="email" name="email" required>
  </div>
  
  <div class="form-group">
    <label for="message">Message:</label>
    <textarea id="message" name="message"></textarea>
  </div>
  
  <button type="submit">Submit</button>
</form>

<script>
document.getElementById('formanahForm').addEventListener('submit', async (e) => {
  e.preventDefault();
  
  const formData = {
    name: document.getElementById('name').value,
    email: document.getElementById('email').value,
    message: document.getElementById('message').value,
    recipientEmail: 'your@email.com' // Replace with your email
  };

  try {
    const response = await fetch('https://formanah.alifbay.in/submit', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(formData)
    });

    if (response.ok) {
      alert('Form submitted successfully!');
      e.target.reset();
    } else {
      throw new Error('Submission failed');
    }
  } catch (error) {
    alert('Something went wrong. Please try again.');
  }
});
</script>

<style>
.form-group {
  margin-bottom: 15px;
}

label {
  display: block;
  margin-bottom: 5px;
}

input, textarea {
  width: 100%;
  padding: 8px;
  border: 1px solid #ddd;
  border-radius: 4px;
}

textarea {
  height: 100px;
}

button {
  background-color: #007bff;
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 4px;
  cursor: pointer;
}

button:hover {
  background-color: #0056b3;
}
</style>