Web Development
Forms
Custom Leadbank

Custom Leadbank


PHP

<?php
$output = '';
if(!empty($_POST)) {
    // Type of Lead Override
    global $statusOverride;
    $statusOverride = 8;
    
    global $siteDefineData;
    $siteDefineData['cms_tracking_sessions']['source_type.id'] = 6;
     // Type of Lead Override end
    
 
    // Auto populate State input field
    if(empty($_POST['State']) and !empty($_POST['StateHiddenInput'] )) {
    	$_POST['State'] = $_POST['StateHiddenInput'];
    }
    // Auto populate State input field end
 
    // Submit to Leadbank
	require_once ENV_ROOT.'/portal/process_leads.php';
    if(@$processLeadsError) {
        $output = '
        <div class="wrapper">
            <h1>Bummer! There was an error.</h1>
            <p>'.$processLeadsError.'</p>
        </div>';
    } else {
 
        // Custom email address submission
        require_once ENV_ROOT .'/includes/class/class.massMailer.php';
 
        $emailBody = "<strong>First Name: </strong>".$_POST['First_Name']."<br>";
        $emailBody .= "<strong>Last Name: </strong>".$_POST['Last_Name']."<br>";
        $emailBody .= "<strong>Phone: </strong>".$_POST['Phone']."<br><br>";
        $emailBody .= '<strong>Email Address: </strong>'.$_POST['Email_Address']."<br>";
        $emailBody .= '<strong>Street: </strong>'.$_POST['Street']."<br>";
        $emailBody .= '<strong>City: </strong>'.$_POST['City']."<br>";
        $emailBody .= '<strong>State: </strong>'.$_POST['State']."<br>";
        $emailBody .= '<strong>Zip Code: </strong>'.$_POST['Zip_Code']."<br>";
        $emailBody .= '<strong>Message: </strong>'.$message."<br>";
        $emailBody .= '<strong>Preferred Date: </strong>'.$_POST['Preferred_Date']."<br>";
        $emailBody .= '<strong>Preferred Time of Day: </strong>'.$_POST['Preferred_Time_Of_Day']."<br>";
 
        $config = array();
        $config[] = array('email' => 'xxxx@gmail.com', 'body' => $emailBody);
        $mailer = new massMailer($config);
        $mailer->setHeaders('Return-Path: '.'no-reply@contractornation.com');
        $mailer->replyTo = 'no-reply@contractornation.com';
        $mailer->from = 'no-reply@contractornation.com';
        $mailer->fromLabel = 'Company Name';
        $mailer->subject = 'New Lead';
        $mailer->message = '[[body]]';
        $mailer->send();
        // Custom email address submission end
 
        $output = '<div class="wrapper">
        <h1>Thank you for contacting us!</h1>
        <p>We have received your information, and one of our specialists will contact you soon.</p>
        </div>';
    }
} else {
    $output = '<h2>Oops! Looks ike you forgot something.</h2>
        <p>You have not filled in all required fields.  Please try again.</p>';
}
echo $output;
// Submit to Leadbank end
?>  

HTML

<link rel="stylesheet" href="https://cdn.treehouseinternetgroup.com/cms_core/assets/modules/contact-4step.css">
<style>
.contact_form button.next, .contact_form input.next {
    margin: 2rem 0 0 !important;
}
 
@media only screen and (max-width: 640px) {
    #content-wrap {
    padding: 15px !important;
}
}
</style>
<div class="contact_form us">
    <form action="/schedule-confirmation.html" method="post" id="contact_form">
        <input type="hidden" name="save" value="1">
        <input type="hidden" name="What_Prompted_Id" value="3">
        <h1>Get a FREE Estimate</h1>
        <div class="bar">
            Fill out the form below to have [company] contact you shortly, or call <span
                class="phone"><span id="numberassigned_3" class="mongoose_phone">[[phone]]</span></span> to contact
            [company] immediately.
        </div>
        <div class="step step_1 current">
            <div class="title">Enter your Zip Code</div>
            <div class="form_fields">
                <label for="Zip">Your Zip Code: </label>
                <input id="Zip" class="four_step_zip_field" type="text" name="Zip_Code" pattern="^\d{5}$"
                    data-validate-zip="us" maxlength="10" value="" required>
            </div>
            <button class="next" onclick="contactFormNextStep(); return false;">Continue &raquo;</button>
        </div>
        <div class="step step_2">
            <div class="title">Address Information</div>
            <div class="form_fields">
                <label id="Street-label" for="Street">Street:</label>
                <input id="Street" required type="text" name="Street" maxlength="300">
                <label id="City-label" for="City">City and State:</label>
                <input id="City" required type="text" name="City" maxlength="255" value="">
                <select name="State" id="State" required>
                    <option value="">Please select...</option>
                    <option value="AL">Alabama</option>
                    <option value="AK">Alaska</option>
                    <option value="AZ">Arizona</option>
                    <option value="AR">Arkansas</option>
                    <option value="CA">California</option>
                    <option value="CO">Colorado</option>
                    <option value="CT">Connecticut</option>
                    <option value="DE">Delaware</option>
                    <option value="DC">District of Columbia</option>
                    <option value="FL">Florida</option>
                    <option value="GA">Georgia</option>
                    <option value="HI">Hawaii</option>
                    <option value="ID">Idaho</option>
                    <option value="IL">Illinois</option>
                    <option value="IN">Indiana</option>
                    <option value="IA">Iowa</option>
                    <option value="KS">Kansas</option>
                    <option value="KY">Kentucky</option>
                    <option value="LA">Louisiana</option>
                    <option value="ME">Maine</option>
                    <option value="MD">Maryland</option>
                    <option value="MA">Massachusetts</option>
                    <option value="MI">Michigan</option>
                    <option value="MN">Minnesota</option>
                    <option value="MS">Mississippi</option>
                    <option value="MO">Missouri</option>
                    <option value="MT">Montana</option>
                    <option value="NE">Nebraska</option>
                    <option value="NV">Nevada</option>
                    <option value="NH">New Hampshire</option>
                    <option value="NJ">New Jersey</option>
                    <option value="NM">New Mexico</option>
                    <option value="NY">New York</option>
                    <option value="NC">North Carolina</option>
                    <option value="ND">North Dakota</option>
                    <option value="OH">Ohio</option>
                    <option value="OK">Oklahoma</option>
                    <option value="OR">Oregon</option>
                    <option value="PA">Pennsylvania</option>
                    <option value="RI">Rhode Island</option>
                    <option value="SC">South Carolina</option>
                    <option value="SD">South Dakota</option>
                    <option value="TN">Tennessee</option>
                    <option value="TX">Texas</option>
                    <option value="UT">Utah</option>
                    <option value="VT">Vermont</option>
                    <option value="VA">Virginia</option>
                    <option value="WA">Washington</option>
                    <option value="WV">West Virginia</option>
                    <option value="WI">Wisconsin</option>
                    <option value="WY">Wyoming</option>
                </select>
            </div>
            <button class="next" onclick="contactFormNextStep(); return false;">Continue &raquo;</button>
        </div>
        <div class="step step_3">
            <div class="title">Contact Information</div>
            <div class="form_fields">
                <label id="First_Name-label" for="First_Name">Your First Name: </label>
                <input id="First_Name" required type="text" name="First_Name" maxlength="50" data-validate-name>
                <br />
                <label id="Last_Name-label" for="Last_Name">Your Last Name: </label>
                <input id="Last_Name" required type="text" name="Last_Name" maxlength="50"
                    data-validate-notequal="#First_Name" data-validate-name>
                <br />
                <label id="Phone-label" for="Phone">Your Phone Number: </label>
                <input id="Phone" type="text" name="Phone" pattern="^[01]?[- .]?\(?[2-9]\d{2}\)?[- .]?\d{3}[- .]?\d{4}$"
                    data-validate-phone="us" required>
                <br />
                <label id="Email_Address-label" for="Email_Address">Your Email Address: </label>
                <input id="Email_Address" type="email" name="Email_Address" maxlength="200"
                    pattern="^([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22))*\x40([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d))*(\.\w{2,})+$"
                    title="Please enter a valid email address." required>
            </div>
            <button class="next" onclick="contactFormNextStep(); return false;">Continue &raquo;</button>
        </div>
        <div class="step step_4">
            <div class="title">Items to Remove</div>
            <div class="form_fields">
                <label id="Message-label" for="Message">List the items you'd like to remove.</label>
                <textarea id="Message" type="text" name="Message"></textarea>
            </div>
            <input class="next" type="submit" value="Send">
        </div>
    </form>
</div>  

Javascript

<script type="text/javascript"
    src="https://cdn.treehouseinternetgroup.com/cms_core/assets/js/th_form_listener.js?v=1"></script>
<script type="text/javascript"
    src="https://cdn.treehouseinternetgroup.com/cms_core/assets/js/th_form_validator.js?v=1"></script>
<script>
    const form = document.querySelector("#contact_form");
    const listener = new ThFormListener("contact_form", {
        id: "660421506",
        c: "3aae8f3fb72e832034b25988652f3c84",
        ignoreFields: ['user_password', 'hidden_company', 'save', 'send'],
        disableSubmit: true
    });
    const validator = new ThFormValidator("contact_form", { disableSubmit: true });
 
    form.addEventListener("submit", async function (e) {
        e.preventDefault();
        const errorFields = validator.validateAll();
        if (errorFields.length) {
            errorFields[0].focus();
            errorFields[0].scrollIntoView({ behavior: "smooth", block: "center" });
            return;
        }
        document.querySelector('#contact_form [type="submit"]').setAttribute("disabled", "disabled");
        const p = listener.initializePostData();
        p["submit_form"] = 1;
        await listener.sendData(p);
        this.submit();
    });
</script>
<script>
    function contactFormNextStep() {
        cur = document.querySelector(".step.current");
        next = cur.nextElementSibling;
        if (validator) {
            const err = validator.validateAll(cur);
            if (err.length) {
                err[0].focus();
                err[0].scrollIntoView({ behavior: "smooth", block: "center" });
            } else {
                cur.querySelector(".next").style.display = "none";
                cur.classList.remove("current");
                next.classList.add("current");
                next.style.display = "block";
                next.scrollIntoView({ behavior: "smooth", block: "center" });
            }
        }
    }
</script>
<script type="text/javascript" src="https://cdn.treehouseinternetgroup.com/cms_core/assets/js/contact-zip-lookup.js"></script>