Reputation: 213
have an ecommerce store running ExpressionEngine and Expresso store. I'm trying to get proper form validation going on, but I keep hitting roadblocks.
The Expresso Store documentation has this to say:
rules:field_name="rule"
As well as using the require="field_name" parameter, the longer SafeCracker-style syntax is also available. For each field, any of the CodeIgniter Form Validation Rules may be specified. If this syntax is used in addition to the require="field_name" parameter, both will apply. Note that the order_email field is already run through the valid_email rule, you don't need to manually specify it.
Example code given by documentation:
rules:billing_name="required"
rules:billing_phone="numeric"
rules:billing_postcode="required|min_length[5]|max_length[5]"
This means that normal CodeIgniter form field rules can be specified- such as regex_match. But in practice, I cannot get it to work. Perhaps my Regex is faulty, but I haven't really been able to get any of the 'rules' (such as 'numeric' or 'alpha') to work reliably. In fact, I just set billing_name to numeric (so only numbers) and I typed in my full name with a space- absolutely no error.
Before, I was getting some errors- but only when i used alpha-numeric and it would flag spaces I was using. But only for some fields and not others.
Essentially, all I want to really do is simply weed out all special characters except for spaces, "." and "-". So spaces, periods and dashes.
Perhaps I'm just overlooking something minor in my code. This is the first time I've tried applying CodeIgniter form validation rules within Expresso Store.
The code you see below is ultimately the result of me throwing anything I could into the regex just to get something consistently- error or otherwise.
{exp:store:checkout
form_class="form-horizontal"
next="/checkout/confirm"
error_handling="inline"
error_delimiters='<span class="checkoutError">|</span>'
require="name|address1|city|country|postcode|order_email"
rules:billing_address1="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:billing_address2="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:order_custom1="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:billing_name="regex_match[/^[0-9]{10}$/]"
rules:billing_city="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:billing_phone="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:billing_postcode="numeric"
rules:shipping_address1="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:shipping_address2="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:shipping_name="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:shipping_city="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:shipping_phone="regex_match[/[^A-Za-z0-9\-\(\) ]/]"
rules:shipping_postcode="numeric"
}
{if no_items}
{redirect="/checkout/"}
{/if}
<div class="w-row">
<div class="w-col w-col-6 checkoutcolumn1">
<div class="forminfotextblock">
<p class="forminfotext">Contact Details</p>
</div>
<div class="formblock">
<div class="w-form">
<div class="w-clearfix">
{error:billing_name}<label class="checkoutlabel" for="name">Name:</label>
<input class="w-input checkoutfield" id="billing_name" type="text" name="billing_name" value="{billing_name}">
</div>
<div class="w-clearfix">
{error:billing_address1}<label class="checkoutlabel" for="name-3">Address:</label>
<input class="w-input checkoutfield" id="billing_address1" type="text" name="billing_address1" value="{billing_address1}">
</div>
<div class="w-clearfix">
{error:billing_address2}<label class="checkoutlabel" for="name-4">Address 2:</label>
<input class="w-input checkoutfield" id="billing_address2" type="text" name="billing_address2" value="{billing_address2}">
</div>
<div class="w-clearfix">
{error:billing_city}<label class="checkoutlabel" for="name-5">City:</label>
<input class="w-input checkoutfield" id="billing_city" type="text" name="billing_city" value="{billing_city}">
</div>
<div class="w-clearfix">
{error:billing_postcode} <label class="checkoutlabel" for="name-6">Postcode:</label>
<input class="w-input checkoutfield" id="billing_postcode" type="number" name="billing_postcode" value="{billing_postcode}">
</div>
<div class="w-clearfix">
<label class="checkoutlabel" for="billing_state">State:</label>
<select class="w-select checkoutfield" id="billing_state" name="billing_state" value="{billing_state}">
{billing_state_options}
</select>
</div>
<div class="w-clearfix">
{error:billing_country}<label class="checkoutlabel" for="billing_country">Country:</label>
<select class="w-select checkoutfield" id="billing_country" name="billing_country" value="{billing_country}">
{billing_country_options}
</select>
</div>
<div class="w-clearfix">
{error:order_email}<label class="checkoutlabel" for="name-9">Email:</label>
<input class="w-input checkoutfield" id="order_email" type="text" name="order_email" value="{order_email}">
</div>
<div class="w-clearfix">
{error:billing_phone} <label class="checkoutlabel" for="name-10">Phone:</label>
<input class="w-input checkoutfield" id="billing_phone" type="text" name="billing_phone" value="{billing_phone}">
</div>
<div class="w-clearfix">
{error:order_custom1}<label class="checkoutlabel" for="name-11">Instructions:</label>
<input class="w-input checkoutfield" id="order_custom1" type="text" name="order_custom1" value="{order_custom1}">
</div>
<div class="w-checkbox">
<input type="hidden" name="shipping_same_as_billing" value="0" />
<input class="w-checkbox-input" id="shipping_same_as_billing" type="checkbox" name="shipping_same_as_billing" value="1" {shipping_same_as_billing_checked}>
<label class="w-form-label" for="shipping_same_as_billing">Same details for shipping</label>
</div>
</div>
</div>
</div>
<div class="w-col w-col-6 checkoutcolumn2">
<div class="forminfotextblock">
<p class="forminfotext">Shipping Address</p>
</div>
<div class="formblock">
<div class="w-form">
<div class="w-clearfix">
{error:shipping_name}<label class="checkoutlabel" for="name-14">Name:</label>
<input class="w-input checkoutfield" id="shipping_name" type="text" name="shipping_name" value="{shipping_name}">
</div>
<div class="w-clearfix">
{error:shipping_address1}<label class="checkoutlabel" for="name-15">Address:</label>
<input class="w-input checkoutfield" id="shipping_address1" type="text" name="shipping_address1" value="{shipping_address1}">
</div>
<div class="w-clearfix">
{error:shipping_address2} <label class="checkoutlabel" for="name-16">Address 2:</label>
<input class="w-input checkoutfield" id="shipping_addres2" type="text" name="shipping_address2" value="{shipping_address2}">
</div>
<div class="w-clearfix">
{error:shipping_city}<label class="checkoutlabel" for="name-17">City:</label>
<input class="w-input checkoutfield" id="shipping_city" type="text" name="shipping_city" value="{shipping_city}">
</div>
<div class="w-clearfix">
{error:shipping_postcode}<label class="checkoutlabel" for="name-23">Postcode:</label>
<input class="w-input checkoutfield" id="shipping_postcode" type="number" name="shipping_postcode" value="{shipping_postcode}">
</div>
<div class="w-clearfix">
<label class="checkoutlabel" for="field-3">State:</label>
<select class="w-select checkoutfield" id="shipping_state" name="shipping_state" value="{shipping_state}">
{shipping_state_options}
</select>
</div>
<div class="w-clearfix">
{error:shipping_country}<label class="checkoutlabel" for="field-4">Country:</label>
<select class="w-select checkoutfield" id="shipping_country" name="shipping_country">
{shipping_country_options}
</select>
</div>
<div class="w-clearfix">
{error:shipping_phone} <label class="checkoutlabel" for="name-22">Phone:</label>
<input class="w-input checkoutfield" id="shipping_phone" type="text" name="shipping_phone" value="{shipping_phone}">
</div>
</div>
</div>
<div class="forminfotextblock">
<p class="forminfotext">Shipping Method</p>
</div>
<div class="formblock">
<div class="w-form">
{shipping_methods}
<div class="w-radio">
<label class="w-form-label" for="shipping_method">
<input type="radio" class="w-radio-input" name="shipping_method" value="{method_title}" id="{method_id}" />
{method_title}
</label>
</div>
{/shipping_methods}
</div>
<span id="overnightInfo" style="display:none">
<input class="w-input overnightaccountinfo" id="field" type="text" placeholder="Enter your account number" name="field">
<br/>
<input class="w-input overnightaccountinfo" id="field-2" type="text" placeholder="Enter your account carrier" name="field-2" data-name="Field 2">
</span>
<br/>
<input class="button" name="next" type="submit" value="Review Order">
</div>
</div>
</div>
</div>
<script>
//on click displays the account and carrier fields
$('#2').click(function() {
$("#overnightInfo").toggle(this.checked);
});
//on click hides the account and carrier fields
$('#1').click(function() {
$("#overnightInfo").toggle(this.hidden);
});
//copy billing information over to shipping information fields
$(function(){
$("#shipping_same_as_billing").change(function() {
if ($("#shipping_same_as_billing:checked").length > 0) {
bindGroups();
} else {
unbindGroups();
}
});
});
var bindGroups = function() {
// First copy values
$("input[name='shipping_name']").val($("input[name='billing_name']").val());
$("input[name='shipping_address1']").val($("input[name='billing_address1']").val());
$("input[name='shipping_address2']").val($("input[name='billing_address2']").val());
$("input[name='shipping_city']").val($("input[name='billing_city']").val());
$("input[name='shipping_postcode']").val($("input[name='billing_postcode']").val());
$("select[name='shipping_state']").val($("select[name='billing_state']").val());
$("select[name='shipping_country']").val($("select[name='billing_country']").val());
$("input[name='shipping_phone']").val($("input[name='billing_phone']").val());
// Then bind fields
$("input[name='billing_name']").keyup(function() {
$("input[name='shipping_name']").val($(this).val());
});
$("input[name='billing_address1']").keyup(function() {
$("input[name='shipping_address1']").val($(this).val());
});
$("input[name='billing_address2']").keyup(function() {
$("input[name='shipping_address2']").val($(this).val());
});
$("input[name='billing_city']").keyup(function() {
$("input[name='shipping_city']").val($(this).val());
});
$("input[name='billing_postcode']").keyup(function() {
$("input[name='shipping_postcode']").val($(this).val());
});
$("select[name='billing_state']").keyup(function() {
$("select[name='shipping_state']").val($(this).val());
});
$("select[name='billing_country']").keyup(function() {
$("select[name='shipping_country']").val($(this).val());
});
$("input[name='billing_phone']").keyup(function() {
$("input[name='shipping_phone']").val($(this).val());
});
};
var unbindGroups = function() {
$("input[name='billing_name']").unbind("keyup");
$("input[name='billing_address1']").unbind("keyup");
$("input[name='billing_address2']").unbind("keyup");
$("input[name='billing_city']").unbind("keyup");
$("input[name='billing_postcode']").unbind("keyup");
$("select[name='billing_state']").unbind("keyup");
$("select[name='billing_country']").unbind("keyup");
$("input[name='billing_phone']").unbind("keyup");
};
</script>
{/exp:store:checkout}
Upvotes: 1
Views: 498
Reputation: 213
Figured it out. Essentially, CodeIgniter validation rules were firing just not in ways I was expecting. Certain characters were being screened, while others (') were not. So, this was complete user error.
Upvotes: 0