Question

My jquery:

$("#sample_form").validate({
    rules: {
        name: "required"
    },
    messages: {
        name: "This field is required."
    }
});

Form:

<?php   $form_att = array('id' => 'sample_form');
        echo form_open('Controller/function',$form_att); ?>
      <input type='text' name='name' id='name'/>
    <?php echo form_close(); ?>

Am i doing it right? The name field should not be empty. Though its not working. Do i need to download another jquery plugin? i downloaded jquery. Though if this requires a specific jquery like how games have mods/expansions. Not entirely sure, but i wanted to do client-side validation .

EDIT:

After adding the validation jquery, the other functions wont work. If i take out the code snippet of the validation, the others work again.

I have buttons to append input types.

Sample,

$("#add").click(function(){
        $("#sample_td").append("<p><input type='text' id='sample[]' name='sample[]' size='60' placeholder='Instruction line'/></p>");
    });

If the button with id add is clicked it appends an input type inside the TD with id sample_td.

the [] in the id is to group all the appended input types so if i want to validate for sample to be required and there are varying number of how many was appended so it would be

rules: { sample[]: "Required" }, messages: { sample[]: "This field is required." }

so if any of the input types of sample will be validated. I got this idea from the same function as to adding [] to the name field so if i $_POST[sample']; it would return all the values of all the fields with name "sample[]" as an array.

Was it helpful?

Solution 2

Quote OP Comment:

"I thought clicking on download jquery would give me the whole package."

There is no "package". jQuery is a JavaScript framework. (It's a single JavaScript file and nothing else. It cannot possibly include every plugin on the planet.) Refer to jQuery API documentation to see the only methods that are provided.

jQuery Validate is a third-party jQuery plugin, not a method built into jQuery. (There are likely millions of third-party jQuery plugins.)


You must always include jQuery first and then include any third-party plugins next.

<script type="text/javascript" src="your-path-to/jquery.min.js"></script>
<script type="text/javascript" src="your-path-to/jquery.validate.min.js"></script>

Download or hot-link to jQuery Validate v1.11.1 from the CDN here.

You only need to use the minified OR the un-minified version of a plugin... not both. Unless you're tinkering with the code or would like to read the code, just use the minified version.


And then only after you include jQuery and jQuery plugins, you'll include your own jQuery code.

Your code looks correct for the HTML markup you provided, but you should enclose it within a DOM ready event handler to make sure the HTML is ready before your function is fired.

<script type="text/javascript">
    $(document).ready(function() {  // ensures HTML markup has been constructed

        $("#sample_form").validate({
            rules: {
                name: "required"
            },
            messages: {
                name: "This field is required."
            }
        });

    });
</script>

OTHER TIPS

I found a nice jquery validation plugin here http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Or you can use html5 validation. <input type='text' name='name' id='name' required/>

You need to load jQuery and jQuery Validation Plugin.

jQuery Validation Plugin is available at jqueryvalidation.org

You can use an elegant solution for this if the question is always that the field is require or not require. This is working in the newest browsers.

http://www.the-art-of-web.com/html/html5-form-validation/

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top