Skip to content

Instantly share code, notes, and snippets.

Avatar

Ben Parker rileyrichter

View GitHub Profile
View form-success.js
// Pass form input values through to the success state of the form
// When a user clicks on the submit button run this function
$('#submitButtonId').click(function() {
// set a variable of name that is equal to the name field
let formName = $('#name').val();
// find the span in the success state with an id of namesuccess and write the value that was in the name field
$('#namesuccess').html(formName);
});
View characters-remaining.js
// Show the number of characters remaining
// When the document is ready to execute code
$(document).ready(function() {
// Set the max number of characters
let textMax = 280;
// Write the max number of characters to the element witn an id of #charcount
$('#charcount').html(textMax);
// When someone types into the input with an id of #title
$('#idea').keyup(function() {
// Set a variable of texTLength to the length of the input with an id of #idea
View count-words.js
// Show the number of words in an input
// Set the input with the id of #idea as a variable
let countTarget = document.querySelector("#idea");
// Set the element with an id of #word-cout as wordCount
let wordCount = document.querySelector("#word-count");
// Set count as a function
let count = function () {
// Set characters at the value of the #idea input
let characters = countTarget.value;
// Set characterLength as the lenght of characters
View count-characters.js
// Show the number of characters in an input
// #idea is the id of the input where you want to count characters
$('#idea').keyup(function() {
// Get the # of characters that are in the input
var charCount = $('#idea').val().length;
// Write the # of characters in the input to the element with an id of #charcount
$('#charcount').html(charCount);
});
View hide-collection-action-on-submit.html
<!--
I keep a collection field with a unique identifier to control this. You could use the ITEM Id field.
Then, wherever my submit button on my form is I wrap in a div with an id of that UUID
-->
<!-- This goes in the embed in the Collection list -->
<div id="UUID-FROM-CMS-HERE">
<input type="submit" value="Vote" data-wait="..." onClick="myVote('UUID-FROM-CMS-HERE');" class="button vote-button w-button" style="cursor: pointer;">
<!-- I include my other form elements here too in the embed -->
<input type="hidden" name="Item ID" value="YOURCOLLECTIONINFOHERE">
View slider-style.html
<!-- Add this code to the before body section of your site or page. Swap out the image URL's for your own! -->
<style>
.w-slider-nav {
display: flex;
justify-content: space-between;
height: 20px !important;
}
.w-slider-nav .w-slider-dot:first-child {
margin-left: 0px !important;
View button-code.html
<!-- For the home page button -->
<a href="#" class="button w-button" onClick="openSite();">Generate a quote</a>
<!-- For the collection page button -->
<a href="#" class="button w-button" onClick="setTimeout(openSite, 3000)">Get another quote</a>
View before-body-generator.html
<script>
var links = [
"quote-1",
"quote-2",
"quote-3",
"quote-4",
"quote-5",
"quote-6",
"quote-7",
"quote-8",
View before-body-code.html
<script>
function myVote(shortcode) {
$(document).on('submit', 'form', function() {
// Set product in local storage
localStorage.setItem(shortcode, "true");
// Refresh page after 3000 milliseconds
setTimeout(function() { location.reload(true); }, 3000);
});
};
</script>
View form-block.html
<div id="DYNAMIC">
<input type="submit" value="Vote" data-wait="..." onClick="myVote('DYNAMIC');" class="button vote-button w-button ">
<input type="hidden" name="name" value="DYNAMIC">
<input type="hidden" name="itemid" value="DYNAMIMC">
</div>
You can’t perform that action at this time.