Grow your CSS skills. Land your dream job.

help with creating validation plugin

  • # September 15, 2012 at 11:14 am

    Hello
    This is my first time creating a plugin.I am trying to make a plugin that will validate whether input field is emty or not.
    My problem is with keyup() function if I call it as I did in 1.php it works fine, but I want to put keyup() in plugin as I did in vall.js, it is commented out $(this).keyup(function() it is not working. Should I place keyup() somewhere else or make a separate keyup() function.
    Later I want to add keyup(),focus()… to options so I can just write keyup:true or something like that.
    Thank you
    this is val.js


    ( function($){



    $.fn.validation = function(options) {



    var settings= {required: '',rqrmsg:''};


    if(options){$.extend(settings, options); }
    var options = $.extend(settings, options);

    // $(this).keyup(function() {

    if(options.required == 'true') {
    var error = 0;
    var elem1 = $(this).val();
    if (elem1 == '') {
    error = 1;
    this.css({'border':'Solid 1px Yellow','background-color':'red'}).next().fadeIn('fast').text(options.rqrmsg)

    }else{
    error;

    $(this).css({'border':'Solid 1px Yellow','background-color':'green'}).
    next().fadeOut();
    }
    error;

    }

    //});


    };



    })(jQuery);


    this is where I am calling the main jquery file
    1.php


    < script src="http://code.jquery.com/jquery-latest.js">
    < script src="val.js">

    <form id='targets' name='targets' action='' method='post' >
    <span class="">Email</span>
    <input type='text' name='test' id='email' /><span class="error"></span> </br>
    <input type='text' name='test1' id='miho' /><span class="error"></span> </br>
    <input type='submit' value='Save' id='save'/>
    </form>

    < script>
    $(document).ready(function() {
    $('#email').keyup(function() {

    $('#email').validation({required:'true',rqrmsg:'sdkgjfikshrik'});
    });
    $('#miho').keyup(function() {
    $(this).validation({required:'true',rqrmsg:'miso'});
    });

    });

    < /script>

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".