SitePoint Sponsor

User Tag List

Page 4 of 8 FirstFirst 12345678 LastLast
Results 76 to 100 of 184
  1. #76
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    Ok now I am getting it slowly sorry new student. How about this code can you disect for me
    var suffix = /\[.*\]/.exec(field),
    name = 'name' + suffix,
    col3 = 'col3' + suffix,
    col4 = 'col4' + suffix;
    return {
    required: filledFields([name, col3, col4]),
    number: (field === col3)
    }; and
    var selectors = [];
    $(array).each(function (i, name) {
    selectors.push('[name="' + name + '"]:filled');
    });
    return selectors.join(', ');
    Thank you so much.

  2. #77
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    Dear Paul,
    Ok now I am getting it slowly sorry new student. How about this code can you disect for me
    Thank you so much.
    Sure thing, although this may be going over the same ground that was covered in the larger post earlier.

    The function uses the name of the name field as a template to create the validation rules for the entire row.

    First, the function finds the suffix, which for "name[2]" would be "[2]"
    It then creates "name[2]", "col3[2]" and "col4[2]" so that we can easily refer to them later on.

    Code javascript:
    var suffix = /\[.*\]/.exec(field),
    name = 'name' + suffix,
    col3 = 'col3' + suffix,
    col4 = 'col4' + suffix;

    When validating a field called "username", the way you would set up validation for it would be something like this:

    Code javascript:
    var rules = {
        username: required
    };
    form.validate({rules});

    If the required username is only required when the password has been filled in, you could use required with a dependency expression for the rule:

    Code javascript:
    var rules = {
        username: {
            required: '[name="password"]:filled'
        }
    };

    So the object that defines the rules for the username would be:

    Code javascript:
    {
        required: '[name="password"]:filled'
    }

    You can use :filled in the selector because the validator adds some custom selectors, which are, :filled :blank and :unchecked

    Returning back to your form, the validation rule for just one of the validation tests could be:

    Code javascript:
    {
        required: '[name="col4[2]"]:filled'
    }

    That's number 4 in this list of rules we need for each row.

    1. Name is required if col3 is filled
    2. Name is required if col4 is filled
    3. Col3 is required if Name is filled
    4. Col3 is required if Col4 is filled
    5. Col3 must be a number
    6. Col4 is required if Name is filled
    7. Col4 is required if Col3 is filled


    Effectively, those seven rules declare that those three fields must be filled in if any of the others are filled in. They are allowed to be blank only if the other fields are also blank.

    What this means for the name field, is that its required validation must check if two different fields are filled in.

    Code javascript:
    {
        required: '[name="col3[2]"]:filled, [name="col4[2]"]:filled'
    }

    But we don't know which field we're creating the rule for. Fortunately, it's okay for a field to validate itself. We can declare that the name field is required if it's filled too, which allows us to use the one rule for all three columns.

    Using the variables that contain the fields name, we have:

    Code javascript:
    {
        required: '[name="' + name + '"]:filled, [name="' + col3 + '"]:filled, [name="' + col4 + '"]:filled'
    }

    If in the future the validation requirements change, an alternative is to set up an array which specifies which validation rules to use for which row. That kind of expansion is not yet required though.

    To help simplify things though, a function is used that takes an array of names, and returns the comma separated string that you see above.

    This code accepts an array such as [name, col3, col4] which then creates the selectors you see in the above code, and returns it ready to use.
    There are even some comments in the filledFields function to act as a helpful reminder.

    Code javascript:
    function filledFields(array) {
        // when given ['name', 'age'] this function will return the following string
        // '[name="name"]:filled, [name="age"]:filled'
        var selectors = [];
        $(array).each(function (i, name) {
            selectors.push('[name="' + name + '"]:filled');
        });
        return selectors.join(', ');
    }

    Finally we deal with the number requirement on the col3 field.

    The validation allows number: true to say that a number is required,
    and number: false to say that a number is not required.

    We can get true or false for the number by checking that the field for which we're creating the rule, has the same name as the one for col3

    Code javascript:
    number: (field === col3)

    Putting that all together, we get the returned object of the function.

    Code javascript:
    return {
        required: filledFields([name, col3, col4]),
        number: (field === col3)
    };

    which would result in something like this for one of the rows:

    Code javascript:
    {
        required: '[name="name[2]"]:filled, [name="col3[2]"]:filled, [name="col4[2]"]:filled',
        number: true
    }
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #78
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    Ok so in this case when I call createSingleRowRule(this.name) the this.name will be the name of the first field is it that is name[2] ? Then in that function we get out [2] right. Then next we called filledFields([name[2],col[3],col[4]). This part I am not so clear $(array).each(function (i, name) . Can you give me more details on this? Thank you.

  4. #79
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    I got another similar problem at this link http://183.78.169.54/v3/class.php. The problem here is that I need to build different class and their number range. For instance classA 0 to 10,classB 11 to 20,class 21 to 35 etc. I have managed to create 3 column one is class name then start range e.g for class A is 0 and end range e.g. for class A is 10. I know we can do it via the rules but I dont know how to set the rules where I check the range is ok and the next row start range must start after +1 to the previous end range.

  5. #80
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    Then next we called filledFields([name[2],col[3],col[4]). This part I am not so clear $(array).each(function (i, name) . Can you give me more details on this? Thank you.
    The suffix is identical on all of them, they are strings, and there's a closing square bracket too.

    filledFields(['name[2]','col3[2]','col4[2]'])

    The array each method just loops through each of those strings in the array, and inside the function the array index is passed to the variable i, and the array item is passed to the variable name.

    The index variable isn't used in this case, its just the name that we're interested in, so that we can wrap it with the appropriate form validation rule.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  6. #81
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    I know we can do it via the rules but I dont know how to set the rules where I check the range is ok and the next row start range must start after +1 to the previous end range.
    The validator methods lists several different methods, among which are min, max and range
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #82
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    Correct me so the end results the selector variable will it be something like this '[name="name[2]"]:filled, [name="col3[2]"]:filled, [name="col4[2]"]:filled'. But why can not build this in the createSingleRowRule function itself why do we need separate function for that ya.

  8. #83
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    why can not build this in the createSingleRowRule function itself why do we need separate function for that ya.
    At first it was:

    Code:
    required: '[name="' + name + "]:filled, [name="' + col3 + '"]:filled, [name="' + col4 + '"]:filled',
    which looked somewhat messy. Encapsulating that behaviour within a function tends to make the code more readable and easier to understand.

    Code:
    required: filledFields([name, col3, col4]),
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  9. #84
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    What is the line doing exactly. Why we dont apply it for the multiple role. Another thing what is it the debug:true means? Thank you.
    var nameField = $('tr td input[name^="name"]', form); and $(form).validate({
    /*rules: singleRowRules,*/
    debug: true
    });

  10. #85
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    I have started on my own to code the class.php at this link http://183.78.169.54/v3/class.php. The problem I have modified my previous codes and try to set the required for all and also number for the last 2 columns. I notice there is any error some where here $('td:notfirst) input', form).each(function () { and the error comes when I remove the setupSingleRowValidation function? I thought that is a separate function right?

  11. #86
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    Dear Paul,
    I have started on my own to code the class.php at this link http://183.78.169.54/v3/class.php. The problem I have modified my previous codes and try to set the required for all and also number for the last 2 columns. I notice there is any error some where here $('td:notfirst) input', form).each(function () { and the error comes when I remove the setupSingleRowValidation function? I thought that is a separate function right?
    The setupSingleRowValidation function is called form setupFormValidation, so you would need to change:

    Code:
    if ($('tbody tr', form).length > 1) {
        setupMultipleRowValidation(form);
    } else {
        $(form).validate().resetForm();
        setupSingleRowValidation(form);
    }
    to just:

    Code:
    setupMultipleRowValidation(form);
    The debug stuff you were asking about before allows you to prevent the form from submitting, to give you a change to see scripting errors and to debug issues. I must have been really tired to have left that in there.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  12. #87
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    So why the setupMultipleRowValidation dont have the debug stuff there any reason for it or it should be there? Thank you.

  13. #88
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    Dear Paul,
    So why the setupMultipleRowValidation dont have the debug stuff there any reason for it or it should be there? Thank you.
    It shouldn't be there. It was only there for development and testing purposes.
    I have already removed it from the post where it was there, and you can remove it from your code too.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  14. #89
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    Can you visit this link now http://183.78.169.54/v3/class.php. If you notice the error is still there even though I just left as this
    function setupFormValidation(form) {
    setupMultipleRowValidation(form);

    }

  15. #90
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    Dear Paul,
    Can you visit this link now http://183.78.169.54/v3/class.php. If you notice the error is still there even though I just left as this
    The error is:
    TypeError: Cannot read property 'settings' of undefined

    That happens when this rule method occurs:

    Code:
    $('td:not(:first) input', form).each(function () {
        $(this).rules('add', {required: true});
    });
    The error is the validator's way of telling you that you're trying to access a field that has not yet been set up for validation.
    You need to run the validate() method on the form, before you can access the rules for a field in the form.

    Previously it was the setupSingleRowValidation function that did that. Now you need to ensure that it occurs no matter what. So do it as the first statement of the setupFormValidation function.

    That way the function will initialise the validation on the form, and then run setupMultipleRowValidation to provide the details.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  16. #91
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    I have put like this $(this.form).validate(); still got error. What must I put exactly? Actually when I say form validate means it will validate it immediately is it.

  17. #92
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    I have put like this $(this.form).validate(); still got error.
    That's because you've put it in the wrong place. It should be put in the setupFormValidation function.

    Code javascript:
    function setupFormValidation(form) {              
            $(form).validate();
            setupMultipleRowValidation(form);
    }

    Quote Originally Posted by newtomysql View Post
    Actually when I say form validate means it will validate it immediately is it.
    The documentation page is a good place to get an answer to that. I just repeat what they have to say there. For example:

    The validate() page says:
    This method sets up event handlers for submit, focus, keyup, blur and click to trigger validation of the entire form or individual elements.

    and there is also the valid() page which says:
    Checks whether the selected form is valid or whether all selected elements are valid.

    So the impression that I get is that validate() does not actually validate the form. It just sets up the form so that it can be validated later on.
    If you want to actually validate the form, you would use the valid() method instead to trigger that process.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  18. #93
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    Ok that solve the problem. So now I have added this additional logic for my new problem. First I run a loop for each tr then in it for each td. Then for the first row and third column ( if(rowCount==1 && columnCount==3) ) I check the value. Now I am stuck here how to assign the rule where the first start value must be 0. Must I use the range method is it. Next in else if(rowCount>1 && columnCount==3) I will try to calculate the difference between the current start value and previous row end value if the difference is not 1 then I again want to raise a rule here. Can you help me how to assign the necessary rules. Thank you.



    var previousEndValue=0;
    if ($('tbody tr', form).length > 0)
    {
    //alert("TEST: ");
    var rowCount =0;
    $('tbody tr').each(function()
    {
    rowCount++;
    var columnCount =0;
    $(this).find('td').each(function()
    {
    columnCount++;
    if(rowCount==1 && columnCount==3)
    {
    var firstStartValue = $(this).find('input[name^="start"]').val();
    //alert("Testing:"+firstValue);
    }
    else if(rowCount==1 && columnCount==4)
    {
    previousEndValue = $(this).find('input[name^="end"]').val();
    }
    else if(rowCount>1 && columnCount==3)
    {
    var currentStartValue = $(this).find('input[name^="start"]').val();
    var differenceInValue = currentStartValue-previousEndValue;
    if(differenceInValue!=1)
    {
    //must show an error.
    }
    }
    else if(rowCount>1 && columnCount==4)
    {
    var previousEndValue = $(this).find('input[name^="end"]').val();

    //alert("currentStartValue:"+currentStartValue);
    //alert("previousEndValue:"+previousEndValue);
    }
    })
    }
    )

    }

  19. #94
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    Now I am stuck here how to assign the rule where the first start value must be 0.
    If the first value must be 0, when why do you even allow the user the possibility to change it?

    Make the ID field readonly and you don't need any validation there at all.

    You could even just make it text and use a hidden field to store the id value.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  20. #95
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    I dont know how to fix it such a way because then when I clone it will follow that too right. Another then how to assign the rule when I check the previous end and the next start row.

  21. #96
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    Can you visit this link http://183.78.169.54/v3/class.php. If you try to add you will notice the "Start" column value is now always zero and I am not allowed to edit it. I want onlt the first row "Start" column zero.

  22. #97
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    I want onlt the first row "Start" column zero.
    I want to understand what you are saying but I can't.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  23. #98
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    Sorry for the miscommunication. Ok if you visit this site http://183.78.169.54/v3/class.php. You will notice there is a column "Classification" and besideis the column "Start". You can try to add rows and notice each of the column "Start" value is 0 but I just want the first row "Start" column to be 0. How to settle that ya. Secondly how to settle in such the previous "End" column and current "Start" column value difference is just 1.

  24. #99
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,717
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by newtomysql View Post
    Dear Paul,
    Sorry for the miscommunication. Ok if you visit this site http://183.78.169.54/v3/class.php. You will notice there is a column "Classification" and besideis the column "Start". You can try to add rows and notice each of the column "Start" value is 0 but I just want the first row "Start" column to be 0. How to settle that ya. Secondly how to settle in such the previous "End" column and current "Start" column value difference is just 1.
    It's not too difficult to look at the previous row and get the number from the end column, but there are likely to be other situations that you may not have considered yet.

    What happens when you have three rows, and the middle row is removed?

    The start and end numbers could be:
    Code:
    Start       End
    [0       ] [4       ]
    [5       ] [8       ]
    [9       ] [14      ]
    When the middle row with 5 8 is removed, how do you want the numbers on the other rows to be affected?


    Would it not be better to have a single "number of items" field for people to enter, and a text start/end after it that automatically update themself?
    Code:
    # of Items   Start   End
    [5       ]   0       4
    [4       ]   5       8
    [6       ]   9       14
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  25. #100
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    874
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dear Paul,
    How about I only validate when the button Submit is press meaning that is final before is it being submit. So in that event if the row is removed then when is submit then is properly validated right. Can we do that way ? So what is you solution for this matter?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •