Loop through all controls and checking valid

140

quan chip posted over 8 years ago

I have some ignite controls put in 2 tabs and I used popover to notify invalid data, I got problem with position of message showing when the tab changed

Is there a simple way to know if control invalid and I can prevent switch tab?

ps: I'm using ignite 15.2

2895

Marina Stoyanova posted over 8 years ago in reply to quan chip

Hello,

I'm glad to hear that you found a solution. If you need further assistance, let me know.

Regards,

Marina Stoyanova

Software Developer,

Infragistics, Inc.
Cancel
Reply

Cancel
140

quan chip posted over 8 years ago in reply to Marina Stoyanova

Thank you for your suggestions and I found the event that help me shorter code

var isValid = true;
$(document).delegate("#frmTest", "igvalidatorformerror", function (evt, ui) {
isValid = false;
});

$('a[data-toggle="tab"]').on('show.bs.tab', function (e) { //switch tab

isValid = true;

$("#frmTest").submit();

if (!isValid) {

e.preventDefault();

return false;

}

});

$("#frmTest").submit(function (e) {
e.preventDefault(); //prevent default form submit
return false;
});
Cancel
Reply

Cancel
2895

Marina Stoyanova posted over 8 years ago in reply to quan chip

Hello Quan,

There are two ways to do is. As I mentioned you can use only one validator for all of the editors in your application and it will do the loop for you. As it will be a global validator it will be easier to check whether all inputs are valid or not. Look at the Standalone igValidator with multiple fields section in this topic http://www.igniteui.com/help/igvalidator-overview#setting-up for more information and sample code how to achieve that.

The other approach is to use the validated event on every editor you have and attach it to a single handler that will check whether the input is valid or not.

    var prevent = false;

    function editorValidated(evt, ui) {

       if (!ui.valid) {

              prevent = true;

       }

    }

Then on switch of the tags you can check whether the flag has changed and if yes then cancel the switch event.

        if (prevent) {

            e.preventDefault();

            return false;

        }

Please take a look at the provided link and If you have questions let me know.

Best Regards,
Marina Stoyanova,
Software Developer,
Infragistics, Inc.
Cancel
Reply

Cancel
140

quan chip posted over 8 years ago in reply to Marina Stoyanova

Thanks for answer me,

But I mean is on a form that have many controls(over 100) with diffrence types such igTextEditor, igDatePicker, igCombo, igNumericEditor ... and the controlid not indexed. So, how can I loop through all controls and call isValid function (I used igEditors control for input valus)

Regards.
Cancel
Reply

Cancel
2895

Marina Stoyanova posted over 8 years ago in reply to quan chip

Hello Quan,

Thank you for providing me a sample. What you can do is create a loop on the swap switching event and check whether all of the editors are valid and if not then cancel the event like this:

$('a[data-toggle="tab"]').on('show.bs.tab', function (e) { //switch tab

            var tabKey = e.target.hash;

            tabKey = tabKey.replace('#', '');

            for (var i = 1; i < 21; i++) {

            if (!$("#txt" + i).igTextEditor("validator").isValid()) {

                     e.preventDefault();

                     return false;

            }

            }

        });

Another solution can be using a single validator on multiple fields. You can find more about that approach in our online documentation: http://www.igniteui.com/help/igvalidator-overview#setting-up

Attached you can find a modified version of your sample. If you need further assistance let me know.

Best Regards,
Marina Stoyanova,
Software Developer,
Infragistics, Inc.

WebApplication1.zip
Cancel
Reply

Cancel