mirror of
https://github.com/prurigro/hypothetical.git
synced 2024-11-09 11:16:39 -05:00
Move the subscription form to its own blade so it can be imported, remove the address/location as that's not standard, get things working correctly, add errors, and use name instead of id for the form fields so it can be used on any page
This commit is contained in:
parent
e4cab7cb86
commit
32bef04ced
6 changed files with 31 additions and 29 deletions
|
@ -10,22 +10,19 @@ class SubscriptionController extends Controller {
|
|||
{
|
||||
$this->validate($request, [
|
||||
'name' => 'required',
|
||||
'email' => 'required|email',
|
||||
'address' => array('required', 'regex:/^([A-Za-z][0-9][A-Za-z] *[0-9][A-Za-z][0-9]|[0-9][0-9][0-9][0-9][0-9])$/')
|
||||
'email' => 'required|email'
|
||||
]);
|
||||
|
||||
$name = $request['name'];
|
||||
$fname = preg_replace('/ .*$/', '', $name);
|
||||
$lname = preg_match('/. ./', $name) === 1 ? preg_replace('/^[^ ][^ ]* /', '', $name) : '';
|
||||
$email = $request['email'];
|
||||
$address = $request['address'];
|
||||
|
||||
if (env('MAILCHIMP_APIKEY', '') != '' && env('MAILCHIMP_LISTID', '') != '') {
|
||||
// Submit the subscription request
|
||||
Newsletter::subscribe($email, [
|
||||
'FNAME' => $fname,
|
||||
'LNAME' => $lname,
|
||||
'ADDRESS' => $address
|
||||
'LNAME' => $lname
|
||||
]);
|
||||
}
|
||||
|
||||
|
@ -33,7 +30,6 @@ class SubscriptionController extends Controller {
|
|||
$subscriptions = new Subscriptions;
|
||||
$subscriptions->name = $name;
|
||||
$subscriptions->email = $email;
|
||||
$subscriptions->location = $address;
|
||||
$subscriptions->save();
|
||||
|
||||
return 'success';
|
||||
|
|
|
@ -17,7 +17,6 @@ class AddSubscriptionTable extends Migration
|
|||
$table->increments('id');
|
||||
$table->string('name');
|
||||
$table->string('email');
|
||||
$table->string('location');
|
||||
$table->timestamps();
|
||||
});
|
||||
}
|
||||
|
|
26
resources/assets/js/subscription.js
vendored
26
resources/assets/js/subscription.js
vendored
|
@ -2,21 +2,24 @@
|
|||
function subscriptionFormInit() {
|
||||
const $form = $("#subscription-form"),
|
||||
$input = $form.find(":input"),
|
||||
$notify = $("#notification");
|
||||
$name = $form.find("[name='name']"),
|
||||
$email = $form.find("[name='email']"),
|
||||
$token = $form.find("[name='_token']"),
|
||||
$submit = $form.find("[name='submit']"),
|
||||
$notify = $form.find(".notification");
|
||||
|
||||
let subscribe = {},
|
||||
submitting = false;
|
||||
|
||||
const getSubscribeData = function() {
|
||||
subscribe = {
|
||||
name: $("#name").val(),
|
||||
email: $("#email").val(),
|
||||
address: $("#address").val(),
|
||||
_token: $("#token").val()
|
||||
name: $name.val(),
|
||||
email: $email.val(),
|
||||
_token: $token.val()
|
||||
};
|
||||
};
|
||||
|
||||
$("#submit").on("click", function(e) {
|
||||
$submit.on("click", function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
if (!submitting) {
|
||||
|
@ -25,10 +28,10 @@ function subscriptionFormInit() {
|
|||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: "/subscription-submit",
|
||||
url: "/api/subscription-submit",
|
||||
data: subscribe
|
||||
}).always(function(response) {
|
||||
let responseJSON, errors, prop;
|
||||
let errors;
|
||||
|
||||
$form.find(".error").removeClass("error");
|
||||
$notify.removeClass("visible").removeClass("error");
|
||||
|
@ -41,13 +44,12 @@ function subscriptionFormInit() {
|
|||
$input.fadeOut(150);
|
||||
}, 1000);
|
||||
} else {
|
||||
responseJSON = response.responseJSON;
|
||||
errors = 0;
|
||||
|
||||
// add the error class to fields that haven't been filled out
|
||||
for (prop in responseJSON) {
|
||||
if (responseJSON.hasOwnProperty(prop)) {
|
||||
$("#" + prop).addClass("error");
|
||||
for (let errorName in response.responseJSON.errors) {
|
||||
if ($form.find(`[name='${errorName}']`).length) {
|
||||
$form.find(`[name='${errorName}']`).addClass("error");
|
||||
errors++;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
#subscription-form {
|
||||
$trans-speed: 100ms;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0px;
|
||||
|
@ -12,5 +13,11 @@
|
|||
margin: 5px;
|
||||
width: calc(100% - 10px);
|
||||
padding: 3px;
|
||||
border: 1px solid lighten($c-accent, 50%);
|
||||
transition: border-color $trans-speed;
|
||||
|
||||
&.error {
|
||||
border-color: $c-error;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
7
resources/views/elements/subscription-form.blade.php
Normal file
7
resources/views/elements/subscription-form.blade.php
Normal file
|
@ -0,0 +1,7 @@
|
|||
<form id="subscription-form" action="#" method="POST" accept-charset="UTF-8">
|
||||
<div class="notification"></div>
|
||||
<input type="hidden" name="_token" value="{{ csrf_token() }}" />
|
||||
<input type="text" name="email" placeholder="Email" />
|
||||
<input type="text" name="name" placeholder="Name" />
|
||||
<input type="submit" name="submit" value="Subscribe" />
|
||||
</form>
|
|
@ -1,14 +1,5 @@
|
|||
@extends('layouts.public', [ 'title' => 'Home' ])
|
||||
|
||||
@section('content')
|
||||
<div id="subscription-form">
|
||||
<form action="#" method="POST" accept-charset="UTF-8">
|
||||
<input type="hidden" name="_token" id="token" value="{{ csrf_token() }}" />
|
||||
<input type="text" name="email" id="email" placeholder="Email" />
|
||||
<input type="text" name="name" id="name" placeholder="Name" />
|
||||
<input type="text" name="address" id="address" placeholder="Postal / ZIP" />
|
||||
<div id="notification"></div>
|
||||
<input id="submit" type="submit" value="Subscribe" />
|
||||
</form>
|
||||
</div>
|
||||
@include('elements.subscription-form')
|
||||
@endsection
|
||||
|
|
Loading…
Reference in a new issue