jQuery UI Widgets Forums ASP .NET MVC jqxValidator rules in a counter loop

This topic contains 2 replies, has 2 voices, and was last updated by  Martin 5 years, 2 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • jqxValidator rules in a counter loop #104457

    RobWarning
    Participant

    Hi,
    I have a dynamically generated table in witch i put a jqxdropdownlist on every row.
    I need to validate each dropdown.

    I have followed the instructions in your topic https://www.jqwidgets.com/community/topic/dynamic-adding-to-validator-rules/
    witch is working very nice.
    Then in the loop where I create my table I do this:

     for (i = 1; i <= duration; i++) {
                firstDate = firstDate + 1000 * 60 * 60 * 24; //Add one day to the date.
                $('#scheduleTable').append('<tr><td> ' + i + ' </td><td>' + $.format.date(firstDate, 'ddd dd/MM/yyyy') + '</td><td><div class="shiftdd" id="shiftdd' + i + '"></div> </td></tr>'); //Add a table row
                $('#shiftdd' + i).jqxDropDownList({ source: Shifts, placeHolder: "Select shift", displayMember: 'text', width: '120px', height: '25px' }); //Create the dropdownList
                //Set the validation for this dropdownlist to the rules collection.
                rules.push({
                    input: '#shiftdd' + i, message: 'Select a shift', action: 'select', rule: function () { //here I get the right reference.
                        var index = $('#shiftdd' + i).jqxDropDownList('getSelectedIndex'); //here i stays refering to the counter value
                        if (index < 0) { return false; }
                        else { return true; }
                    }
                });
            }
            console.log(rules);
            //Update the validation rules collection to the Validator.
            $('#testForm').jqxValidator('rules', rules);

    The problem is now that the first occurrence of “#shiftdd’ + i” in the input parameter works fine. But the second one, to get the ‘getSelectedIndex’, the value of i will not translate to a value.

    I do understand by now that I need a javascript Closure, but I am breakeng my head what the syntax should be.
    Could you please help me?

    jqxValidator rules in a counter loop #104458

    RobWarning
    Participant

    Very proud to solve this myself…
    following code works:

     for (i = 1; i <= duration; i++) {
                firstDate = firstDate + 1000 * 60 * 60 * 24; //Add one day to the date.
                $('#scheduleTable').append('<tr><td> ' + i + ' </td><td>' + $.format.date(firstDate, 'ddd dd/MM/yyyy') + '</td><td><div class="shiftdd" id="shiftdd' + i + '"></div> </td></tr>'); //Add a table row
                $('#shiftdd' + i).jqxDropDownList({ source: Shifts, placeHolder: "Select shift", displayMember: 'text', width: '120px', height: '25px' }); //Create the dropdownList
                //Set the validation for this dropdownlist to the rules collection.
                (function (index) {  //put it in a immediately-invoked function expression
                    rules.push({
                        input: '#shiftdd' + [index], message: 'Select a shift', action: 'select', rule: function () {
                            var indexe = $('#shiftdd' + [index]).jqxDropDownList('getSelectedIndex');
                            if (indexe < 0) { return false; }
                            else { return true; }
                        }
                    });
                })(i);  //this (i) is important!!!
            }
            console.log(rules);
    jqxValidator rules in a counter loop #104484

    Martin
    Participant

    Hello RobWarning,

    Thank you for the update!

    Best Regards,
    Martin

    jQWidgets Team
    http://www.jqwidgets.com/

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.