by Rob Hope via One Page Love
"Mr Branding" is a blog based on RSS for everything related to website branding and website design, it collects its posts from many sites in order to facilitate the updating to the latest technology.
To suggest any source, please contact me: Taha.baba@consultant.com
Thursday, July 6, 2017
Blackolive
by Rob Hope via One Page Love
Kevin Beck
by Rob Hope via One Page Love
How to Defend Your Website with Zip Bombs
If you have ever hosted a website or even administrated a server, you'll be very well aware of bad people trying bad things with your stuff.
When I first hosted my own little linux box with SSH access at age 13, I read through the logs daily and reported the IPs (mostly from China and Russia) who tried to connect to my sweet little box (which was actually an old ThinkPad T21 with a broken display running under my bed) to their ISPs.
Actually, if you have a linux server with SSH exposed you can see how many connection attempts are made every day:
grep 'authentication failures' /var/log/auth.log
Wordpress has doomed us all
OK, to be honest, web vulnerability scanners have existed before Wordpress, but since WP is so widely deployed most web vulnerability scanners include scans for some misconfigured wp-admin
folders or unpatched plugins.
So if a small, new hacking group wants to gain some hot cred they'll download one of these scanner things and start testing against many websites in hopes of gaining access to a site and defacing it.
This is why all server or website admins have to deal with gigabytes of logs full with scanning attempts. So I was wondering..
Is there a way to strike back?
After going through some potential implementations with IDS or Fail2ban I remembered the ZIP bombs from the old days.
Continue reading %How to Defend Your Website with Zip Bombs%
by Christian Haschek via SitePoint
6 Clever SVG Pattern Generators for Your next Design
Today I want to touch on SVG Patterns. They're not widely understood, but offer a lot of really interesting design options once you get your head around them. I'm going to start with you a crash course on how they work. Then we'll spin through 6 tools that take advantage of them.
In theory, combining the tools and what you know about patterns should open up some cool design possibilities.
How do SVG Patterns Work?
Patterns and textures have always been a super common web design element. Even if you only know a little CSS, you probably understand how easy it is to set up any image as a CSS tiling background.
[code language="css"]
div {
background-image: url("sitepoint-tile.svg");
}
[/code]
Of course, we could use any web image format we like for that background (JPG, PNG, etc). But as SVGs are so efficient, sharp and very scalable, there are excellent reasons for choosing to use an SVG for your CSS background tiles.
However, you may be less familiar with SVG’s native way to make repeating backgrounds – SVG patterns. It is interesting because it has some special powers that regular CSS tiling can’t offer. But first, let's look at how a simple SVG pattern works first.
[code language="html"]
<svg>
<defs>
<pattern id="myPattern"
x="10" y="10" width="20" height="20" patternUnits="userSpaceOnUse" >
<!-- start pattern-->
<circle cx="10" cy="10" r="7" style="stroke: none; fill: magenta" />
<!-- end pattern -->
</pattern>
</defs>
...
[/code]
In the top of most SVG files you'll find a <DEFS>
code block. The <DEFS>
section (or DEFinitions) is where we place item we want to re-use later. In practice, this means SVG FILTERs, SYMBOLs and PATTERNs.
[caption id="attachment_157014" align="alignright" width="236"] Simple SVG patterns - (Or as a codepen example)[/caption]
Inside our <DEFS>
block, we’ve set up a 20 x 20px area of pattern. Then we’ve positioned a small magenta circle right in the center (cx="10" cy="10") of that space (though this could have been anything we wanted to tile).
But this doesn’t render anywhere – yet. It is just a pattern definition – almost like a color swatch or a CSS class. You have to call it in an SVG FILL to use it.
[code language="html"]
...
<circle cx="50" cy="50" r="50" style="stroke: #ccc; fill: url(#myPattern);" />
</svg>
[/code]
Here we’re creating a large circle (radius 50px) and filling it by referencing the pattern we defined above. It renders like this.
Pretty simple, right? And we could scale up that container circle as large as we liked with no increase to the file size whatsoever.
So, are SVG Patterns more useful than CSS tiles?
They certainly can be.
1. SVG allows you reference one pattern from within another pattern
This allows you build-up complex, layered patterns from very simple components. For instance, how would you produce this Moiré pattern with a standard CSS tile?
SVG allows us to define a ‘base pattern’ – like the dots we created above – and then layer that pattern with different color fills, rotations and scale (like above). Tiny files, but crazy complexities.
2. SVG patterns aren’t limited to rectangular repetitions.
While CSS tiling backgrounds are always rectangles, SVG is a language of mathematics and geometry, designed to tile (or tesselate) in triangles, hexagons and even ‘Escher-esque’ multi-shape combinations.
[caption id="attachment_157006" align="alignleft" width="150"] Hexagon-based tesselations.
Source: Mathstat.slu.edu [/caption]
M.C. Escher’s famous Lizard tessellation is a famous example based on a hexagonal tile – this would be tough to do with rectangular tiles. In short, SVG patterns offer all sort of interesting design possibilities if you’re ready to experiment.
I think these are two characteristics that open up lots of design possibilities – once you get a feel for the basics.
But for today, I thought we’d look at some of the ready-to-use ‘off-the-rack’ options out there. Take these as they are, or else use them as a jumping off point for more interesting creations.
1. Hero Patterns
Hero Patterns, a project by UI designer and illustrator Steve Schoger, is a good place to start.
Steve currently offers over 90 SVG patterns for free download and allows you to set the opacity, foreground and background colors of your file.
Interestingly, the samples here are not just a bunch square tiles either, which makes it a good place to get an understanding of what you can do with SVG patterns.
2. Iros Pattern Fills
In a lot of early 20th century maps and charts, you’ll see they often make up for a lack of color by using monotone pattern fills with dots, lines, and cross-hashes. Although this was a design limitation of the time, today it still presents a crisp, super-efficient option for your SVG fills.
Iros has collected a pattern book of monotone pattern fills that you can reference in your work easily. These are tiny files and you can probably afford to include them all, even if you only reference a few.
Continue reading %6 Clever SVG Pattern Generators for Your next Design%
by Alex Walker via SitePoint
The “Most Loved” One Page Websites from June 2017
This "Most Loved" One Page website round-up is brought to you by hosting provider, Bluehost.
Bluehost is the most affordable hosting option to host your One Page websites. They have an incredible $2.95/month deal exclusive to One Page Readers where you can host your website with 50GB diskspace and unlimited bandwidth. They also throw in a free domain!
If you want to get notified about the "Most Loved" awards each month, subscribe to our Inspiration Newsletter.
Below are the 6 One Page websites awarded “Most Loved” in June – hope you enjoy!
Live – Papillons de Nuit (Event)
Impressive One Pager promoting the ‘Papillins de Nuit’ festival that took place in Normandie, France. The vibrant Single Page site features slick off-canvas content areas, unique interactive SVG animations and a ton of awesome GIFs. Neat feature too with the media filter for GIFs, photos and videos.
Awesomed (Portfolio)
Gorgeous One Page portfolio featuring slick load transitions and hover effects for design agency, Awesomed. The One Pager was built using JS framework Vue.js that actually enable One Page applications. However the issue demonstrated here is the Case Studies change your browser URL and promote a back button to a home page. In the updated submission rules this won’t be allowed but letting this in purely on the high design standard. Excellent work!
I’m Your Man (Game, Long-Form Journalism, Sport)
Phenomenal One Pager for “I’m Your Man” – in interactive documentary about Australia’s boxing legends. This screenshot does no justice to how well SBS have included the website reader in the narrative. There is boxing training, interactive punches overlaid on video and brilliant sound editing while you interact in the 20-min short. Contender for One Pager of the year.
An Interesting Day (Event)
Beautifully redesigned One Pager for the 2017 ‘An Interesting Day’ event by Bakken & Bæck. The Single Page site features a (parallax) multi-layered intro illustration followed by a really unique speaker “news ticker” that shows speaker bio on hover.
Dan Perrera (One Page Blog)
Minimal and unique blog redesign for Dan Perrera that loads seamlessly within One Page. The transitions and attention to detail is truly stunning.
Square Cash (Announcement, App, Finance)
Stunning One Pager with the most spectacular load animation and background illustrations announcing Square’s new Cash App. Shout out to the different positioning of cards and devices on multiple resolutions. A perfect One Pager.
Hope you enjoyed these beautiful One Pagers from June!
Big love to hosting provider Bluehost for sponsoring the round up < 3
by Rob Hope via One Page Love
CodeIgniter Form Validation: From Start to Finish
As a web application developer, form validation is a crucial part of your work, and it should not be underrated as it could lead to security flaws in your application. You should consider it a must if you're striving to provide a professional end user experience.
In this article, we'll go through the built-in form validation library in the CodeIgniter framework.
Here are the highlights of today's article:
- Basic form validation
- Cascading and prepping
- Custom error messages
- Custom validation callback
- Validation configuration
Go Through Basic Validation Rules
In this section, we'll go through the basic form validation concepts in CodeIgniter.
As a part of that, we need to create controller and view files. The controller file loads the validation library and runs validation rules against the submitted form data. The view file holds the form XHTML code, and we'll keep it simple for our needs.
Let's go ahead and create these two files.
Create the controller file application/controllers/Validation.php
with the following contents.
<?php // application/controllers/Validation.php defined('BASEPATH') OR exit('No direct script access allowed'); class Validation extends CI_Controller { public function __construct() { parent::__construct(); // load form and url helpers $this->load->helper(array('form', 'url')); // load form_validation library $this->load->library('form_validation'); } public function basic() { // basic required field $this->form_validation->set_rules('text_field', 'Text Field One', 'required'); // basic required field with minimum length $this->form_validation->set_rules('min_text_field', 'Text Field Two', 'required|min_length[8]'); // basic required field with maximum length $this->form_validation->set_rules('max_text_field', 'Text Field Three', 'required|max_length[20]'); // basic required field with exact length $this->form_validation->set_rules('exact_text_field', 'Text Field Four', 'required|exact_length[12]'); // basic required field but alphabets only $this->form_validation->set_rules('alphabets_text_field', 'Text Field Five', 'required|alpha'); // basic required field but alphanumeric only $this->form_validation->set_rules('alphanumeric_text_field', 'Text Field Six', 'required|alpha_numeric'); // basic email field with email validation $this->form_validation->set_rules('valid_email_field', 'Email Field', 'required|valid_email'); // password field with confirmation field matching $this->form_validation->set_rules('password_field', 'Password One', 'required'); $this->form_validation->set_rules('password_confirmation_field', 'Password Confirmation Field', 'required|matches[password_field]'); // basic required field with IPv4 validation $this->form_validation->set_rules('valid_ip_field', 'Valid IP Field', 'required|valid_ip[ipv4]'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } } public function cascade() { // basic required field with cascaded rules $this->form_validation->set_rules('text_field', 'Text Field One', 'required|alpha|min_length[8]|max_length[20]'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } } public function prep() { // basic required field with trim prepping applied $this->form_validation->set_rules('min_text_field', 'Text Field Two', 'trim|required|min_length[8]'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } } public function custom_message() { // basic required field with trim prepping applied $this->form_validation->set_rules('alphabets_text_field', 'Text Field Five', 'required|alpha', array('required'=>'Please enter Text Field Five!','alpha'=>'Only alphabets please!')); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } } public function custom_rule() { // basic required field with trim prepping applied $this->form_validation->set_rules('text_field', 'Text Field Five', 'callback_custom_validation'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } } public function custom_validation($field_value) { if ($field_value == '' || $field_value == 'demo') { $this->form_validation->set_message('custom_validation', "Come on, don't act like spammer!"); return FALSE; } else { return TRUE; } } public function configuration() { // if you pass group id, only elements in that group will be validated // $this->form_validation->run('group_one') if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } } }
Next, create the view file application/views/validate_form.php
as shown below.
<html> <head> <title>Form Validation Example</title> <style> .field_title{font-size: 13px;font-family:Arial;width: 300px;margin-top: 10px} .form_error{font-size: 13px;font-family:Arial;color:red;font-style:italic} </style> </head> <body> <div class="form_error"> <?php echo validation_errors(); ?> </div> <?php echo form_open(); ?> <h2>Form Validation Example</h2> <div> <div class="field_title">Text Field One (Required)</div> <input type="text" name="text_field" value="<?php echo set_value('text_field'); ?>" size="30" /> </div> <div> <div class="field_title">Text Field Two (Minimum length)</div> <input type="text" name="min_text_field" value="<?php echo set_value('min_text_field'); ?>" size="30" /> </div> <div> <div class="field_title">Text Field Three (Maximum length)</div> <input type="text" name="max_text_field" value="<?php echo set_value('max_text_field'); ?>" size="30" /> </div> <div> <div class="field_title">Text Field Four (Exact length)</div> <input type="text" name="exact_text_field" value="<?php echo set_value('exact_text_field'); ?>" size="30" /> </div> <div> <div class="field_title">Text Field Five (Alphabets only)</div> <input type="text" name="alphabets_text_field" value="<?php echo set_value('alphabets_text_field'); ?>" size="30" /> </div> <div> <div class="field_title">Text Field Six (Alphanumeric only)</div> <input type="text" name="alphanumeric_text_field" value="<?php echo set_value('alphanumeric_text_field'); ?>" size="30" /> </div> <div> <div class="field_title">Email Field</div> <input type="text" name="valid_email_field" value="<?php echo set_value('valid_email_field'); ?>" size="30" /> </div> <div> <div class="field_title">Password Field</div> <input type="password" name="password_field" value="" size="30" /> </div> <div> <div class="field_title">Password Confirmation Field</div> <input type="password" name="password_confirmation_field" value="" size="30" /> </div> <div> <div class="field_title">IP Field</div> <input type="text" name="valid_ip_field" value="<?php echo set_value('valid_ip_field'); ?>" size="30" /> </div> <div class="field_title"> <input type="submit" value="Submit" /> </div> </form> </body> </html>
With this setup, you should see a form when you run http://your-codeigniter-site/validation/basic in your browser. Try to submit it without filling any of the form fields, and you'll see the list of error messages! Don't worry if you don't understand how it works altogether as we'll go through every piece of code in detail.
The story starts with the __construct
method.
public function __construct() { parent::__construct(); // load form and url helpers $this->load->helper(array('form', 'url')); // load form_validation library $this->load->library('form_validation'); }
I always prefer to load common libraries and helpers in the constructor of the controller itself as it's a nice habit to avoid code duplication elsewhere in controller methods. That's exactly what we've done above—we load the form
and url
helpers so that we can use the utility methods provided by those helpers throughout the rest of the application.
Next, we load the form validation library so that it allows us to bind form validation rules on form elements, as we'll see in the very next section.
Let's go through the code of the basic
method. What does this method do? If you call it with the GET
method, it'll display the form, and if it was called using the POST
method, it applies validation rules on the submitted data and displays error messages, if any, along with the form.
public function basic() { // basic required field $this->form_validation->set_rules('text_field', 'Text Field One', 'required'); // basic required field with minimum length $this->form_validation->set_rules('min_text_field', 'Text Field Two', 'required|min_length[8]'); // basic required field with maximum length $this->form_validation->set_rules('max_text_field', 'Text Field Three', 'required|max_length[20]'); // basic required field with exact length $this->form_validation->set_rules('exact_text_field', 'Text Field Four', 'required|exact_length[12]'); // basic required field but alphabets only $this->form_validation->set_rules('alphabets_text_field', 'Text Field Five', 'required|alpha'); // basic required field but alphanumeric only $this->form_validation->set_rules('alphanumeric_text_field', 'Text Field Six', 'required|alpha_numeric'); // basic email field with email validation $this->form_validation->set_rules('valid_email_field', 'Email Field', 'required|valid_email'); // password field with confirmation field matching $this->form_validation->set_rules('password_field', 'Password One', 'required'); $this->form_validation->set_rules('password_confirmation_field', 'Password Confirmation Field', 'required|matches[password_field]'); // basic required field with IPv4 validation $this->form_validation->set_rules('valid_ip_field', 'Valid IP Field', 'required|valid_ip[ipv4]'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } }
As we've already loaded the form validation library in the constructor, you can access it using the $this->form_validation
convention.
The set_rules
method is used to bind a validation rule on a form field. Generally, it takes three arguments:
- The first argument is the name of a form field.
- The second argument is a label that is used to reference a form field while displaying the error message for that field.
- The third argument is the rule that you want to apply on a form field. The form validation library comes with lots of built-in rules that you could use already.
Let's go through some of these rules as we've used them in the basic method.
One of the most frequently used rules is the required
rule, which makes a form field compulsory.
// basic required field $this->form_validation->set_rules('text_field', 'Text Field One', 'required');
Next, if you want to make a form field of a certain length, you can use the min_length
and max_length
rules.
// basic required field with minimum length $this->form_validation->set_rules('min_text_field', 'Text Field Two', 'required|min_length[8]'); // basic required field with maximum length $this->form_validation->set_rules('max_text_field', 'Text Field Three', 'required|max_length[20]');
The first one makes sure that the min_text_field
form field is a compulsory field and the user must enter at least eight characters in it. The second one puts a limit on the maximum characters that can be entered in the max_text_field
text field, in addition to making it a compulsory field.
You may have noticed that we've used the |
operator to apply multiple rules at once. It's called cascading, and we'll get back to it later.
On the other hand, if you want to make a form field of an exact length, you can use the exact_length
rule.
// basic required field with exact length $this->form_validation->set_rules('exact_text_field', 'Text Field Four', 'required|exact_length[12]');
What if you want to validate a form field to alphabets or alphanumeric only?
// basic required field but alphabets only $this->form_validation->set_rules('alphabets_text_field', 'Text Field Five', 'required|alpha'); // basic required field but alphanumeric only $this->form_validation->set_rules('alphanumeric_text_field', 'Text Field Six', 'required|alpha_numeric');
The next candidate is the email validation.
// basic email field with email validation $this->form_validation->set_rules('valid_email_field', 'Email Field', 'required|valid_email');
Next, the matches
rule allows you to compare the value of a form field with another form field's value. The best example of this is the password field, which must match the password confirmation field when you submit the form.
// password field with confirmation field matching rule $this->form_validation->set_rules('password_field', 'Password One', 'required'); $this->form_validation->set_rules('password_confirmation_field', 'Password Confirmation Field', 'required|matches[password_field]');
The last example in our basic method is about validating the IP address.
The valid_ip
rule validates the IP address against the first argument passed. In the following example, we're only looking for ipv4 type of IP addresses!
// basic required field with IPv4 validation $this->form_validation->set_rules('valid_ip_field', 'Valid IP Field', 'required|valid_ip[ipv4]');
So that's it as far as basic validation is concerned in CodeIgniter.
How Cascading and Prepping Works
In this section, we'll explore cascading and prepping, which allow you to combine multiple validation rules in a single go.
In fact, I would say that we've thoroughly used cascading in our earlier examples. Recall that pipe operator that was used to combine multiple rules—and yes, the so-called cascading validation rules.
Grab the code of the cascade
method.
public function cascade() { // basic required field with cascaded rules $this->form_validation->set_rules('text_field', 'Text Field One', 'required|alpha|min_length[8]|max_length[20]'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } }
As shown in the example above, we've applied four validation rules separated by the |
operator to the text_field
text box. So it has to go through each and every rule for the form validation to succeed in this case!
Give it a try and see how it works!
Next, there's a prepping that allows you to apply certain operations on the data that's being submitted. More often than not, you want to remove leading and trailing spaces in the user submitted data. Probably the first thing that comes to your mind in this case is to use the trim function, and the good news is that you can use it!
That's exactly what our prep
method does.
public function prep() { // basic required field with trim prepping applied $this->form_validation->set_rules('min_text_field', 'Text Field Two', 'trim|required|min_length[8]'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } }
As you can see, we've used the word trim
in addition to validation rules. So the data is trimmed first, and then it'll go through the other validation rules. In fact, you could use any PHP function that takes a single argument as per the CodeIgniter documentation.
Try running our example by adding few trailing spaces, and see how it goes.
Customizing Error Messages
If you've had a chance to run the above examples, you may have noticed that the error messages displayed to the user are pretty systematic and machine generated. Maybe you want to be more creative and change them in certain cases.
Let's see how you could change the error message for any validation rule. Pull in the code of the custom_message
method.
public function custom_message() { // field with custom error message $this->form_validation->set_rules('alphabets_text_field', 'Text Field Five', 'required|alpha', array('required'=>'Please enter Text Field Five!','alpha'=>'Only alphabets please!')); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } }
Please note the fourth argument supplied to the set_rules
method. It contains an array of custom validation messages for each validation rule, and the key of each array item is the validation rule itself.
array( 'required'=>'Please enter Text Field Five!', 'alpha'=>'Only alphabets please!' )
Give it a try, and you should see our custom error messages! Pretty cool, huh?
Custom Validation Callbacks
Although the built-in validation library provides a handful of validation rules already, there's always a need to create a custom one in your day-to-day development work. That's exactly what we'll discuss in this section.
To demonstrate that, we'll create a custom validation callback, and later on we'll see how to use it along with the set_rules
method.
To start with, let's have a quick look at the custom_rule
method.
public function custom_rule() { // field with custom validation callback passed $this->form_validation->set_rules('text_field', 'Text Field Five', 'callback_custom_validation'); if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } }
It's no different than the usual set_rules
method call except that we've provided the custom validation callback custom_validation
instead of any core validation rule. The important thing to note here is that you need to prefix the custom validation callback with callback_
when you pass it as an argument.
Next, let's implement the custom validation callback.
public function custom_validation($field_value) { if ($field_value == '' || $field_value == 'demo') { $this->form_validation->set_message('custom_validation', "Come on, don't act like spammer!"); return FALSE; } else { return TRUE; } }
When your custom validation callback is called, the value entered by the user will be passed as the first argument. So the $field_value
contains a value that's entered by a user, against which you can implement your custom validation logic.
In the example above, you should see the error message if you enter either a blank value or demo
in the text field Text Field Five
. It's important to note that when you set the error message using the set_message
method, the first argument is the name of the custom validation callback method itself.
And that's the story of custom validation callbacks.
Last but not least, it's the validation configuration that deserves some attention as we move towards the conclusion of this article.
Validation Configuration
As a CodeIgniter developer, you should already be familiar with the config
directory, which allows you to configure different aspects of your CodeIgniter application.
For example, database.php
allows you to define the database-related settings, while autoload.php
allows you to define the components that should be auto-loaded during the bootstrapping of an application.
In the same way, you could create the form_validation.php
file under the config
directory and use that file to define application-level validation rules that can be used globally. If that sounds alien to you, there's no better way to understand it than actually looking at a practical example.
Create the file application/config/form_validation.php
with the following contents.
<?php $config = array( array( 'field' => 'text_field', 'label' => 'Text Field One', 'rules' => 'required' ), array( 'field' => 'min_text_field', 'label' => 'Text Field Two', 'rules' => 'required|min_length[8]' ), array( 'field' => 'max_text_field', 'label' => 'Text Field Three', 'rules' => 'required|max_length[20]' ) );
Now, let's quickly look at what our configuration
method looks like.
public function configuration() { // if you pass group id, only elements in that group will be validated // $this->form_validation->run('group_one') if ($this->form_validation->run() == FALSE) { $this->load->view('validate_form'); } else { // load success template... echo "It's all Good!"; } }
Try running http://your-codeigniter-site/validation/configuration and submit an empty form. You'll see error messages for three form fields! But wait, where do they come from, since we haven't set up any validation rules in our configuration method in the first place?
Users with sharp eyes would have noticed that it's automatically picked up from the validation configuration file defined at application/config/form_validation.php
. Isn't that amazing? It allows you to centralize the rules in one place and reduces the code duplication in action methods.
In fact, you could group the rules and apply validation to the fields of only a certain group. Let's see how to do that.
Replace the code in application/config/form_validation.php
with the following.
<?php $config = array( 'group_one' => array( array( 'field' => 'text_field', 'label' => 'Text Field One', 'rules' => 'required' ) ), 'group_two' => array( array( 'field' => 'min_text_field', 'label' => 'Text Field Two', 'rules' => 'required|min_length[8]' ), array( 'field' => 'max_text_field', 'label' => 'Text Field Three', 'rules' => 'required|max_length[20]' ) ) );
In your configuration
method, find the following line:
if ($this->form_validation->run() == FALSE)
And replace it with:
if ($this->form_validation->run('group_one') == FALSE)
Now, try to submit an empty form, and you'll see an error for only Text Field One
. That's because we've passed group_one
as a group id, so only the elements in that group will be validated.
Finally, let's have a look at the type of configuration that allows you to define rules based on the URL.
Replace the code in application/config/form_validation.php
with the following code.
$config = array( 'validation/configuration' => array( array( 'field' => 'max_text_field', 'label' => 'Text Field Three', 'rules' => 'required|max_length[20]' ) ) );
In this type of configuration, you need to use a combination of the controller name and the method name separated by the /
character. In this way, you could define rules for several action methods at once.
Now, you should see the error message for Text Field Three
should you try to submit an empty form at http://your-codeigniter-site/validation/configuration.
And that ends the story of validation configuration and this article as well!
Conclusion
In this article, we thoroughly discussed form validation in CodeIgniter.
We started our journey with the basic validation rules, and then we moved to more advanced topics like cascading, prepping, and configuration validation.
I hope you've enjoyed this article, and you can share your valuable views using the feed below!
by Sajal Soni via Envato Tuts+ Code
Muzzle
by Rob Hope via One Page Love