form validation within a panel?

[Clive Hoggar]

Hi

I have a registration form split into sub sections, one section to a panel.
Can you suggest a way to ensure that the section in each panel is validated 
when the next one is clicked, so the visitor can't move on if it that section
is not valid?

Thanks for ideas on this!

Clive

[Atanas Korchev]

Hi Clive Hoggar,

This can be achieved using some JavaScript. Find attached a sample page which demonstrates the required approach.

Regards,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Clive Hoggar]

Thanks for this. It works a treat!

Clive

[Clive Hoggar]

There is one puzzle for me.
Although it works fine, I am getting an error message in IE7 on my remote server
(which is IIS6) but not on my local server (iis5).

When the page loads, a windows alert pops up
 'Assertion Failed: length of elements and json must be the same'
and if it goes on to debug:
'Line 8112 this._element is null or not an object'

This does not happen on my local machine so it is tough to figure out what is going on.
Can you suggest where to start?

There is no error with Firefox 3.

I can give you the url, but it is password protected. Please let me have an email
where I can send it to you.

Thanks

Clive

[Clive Hoggar]

Further info on this.

After clearing all caches etc - the panel bar elements do NOT open in IE (IE7)
and the error message I reported above occurs.

I went into debug mode and the offending line is deep into some Telerik script that
is not normally visible.

Firefox DOES still work and shows no errors.

Help!

Thanks

Clive

[Atanas Korchev]

Hi Clive Hoggar,

This error may occur if you are adding a panel item twice to the panelbar. Please verify this is not the case.

You can open a support ticket in order to exchange private information such as passwords or public URLs.

Regards,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Charles]

I am trying to do the same thing, that is validate the panel before allowing the next panel to open. The script panelbarformvalidation.zip works good if you click the item bar but does not cause validation if the expand button is clicked. I tried adding OnClientItemExpand="onClicking" but the this event does not seem to support the set_cancel method. Can you tell me how to trigger validation with the expand/collapse button?

Thanks

Charles

[Plamen]

Hi,

Yes indeed the expand event can not be easily cancelled in the current version of the control. I have added it as a feature request and you can vote for it here.

Here is the code that I used as a temporary workaround:

Telerik.Web.UI.RadPanelItem.prototype._onExpandHandleClick= function(e)
                {
                    if (!this.get_isEnabled())
                    {
                        return true;
                    }

                    var panelBar = this.get_panelBar();
                    var expandedItems = panelBar.get_expandedItems();
                    var rootExpandedCount = 0;

                    for (var i = 0; i < expandedItems.length; i++) {
                        if (expandedItems[i].get_level() === 0)
                            rootExpandedCount++;
                    }

                    if (this.get_expanded()) {
                        if (this.get_level() === 0) {
                            if (panelBar.get_singleExpandedItem() || panelBar.get_fullExpandedItem()) {
                                if (!panelBar.get_allowCollapseAllItems() && rootExpandedCount > 1) {
                                    this.set_expanded(false);
                                } else
                                    if (panelBar.get_allowCollapseAllItems())
                                        this.set_expanded(false);

                                return true;
                            }
                        }

                        this.set_expanded(false);
                    } else {
                        for (var i = 0; i < panelBar.get_items().get_count() ; i++) {
                            var validationGroup = "ValidationGroup" + (i + 1);
                            var item = panelBar.get_items().getItem(i);
                            if (item.get_expanded()) {
                                Page_ClientValidate(validationGroup);
                            }
                        }

                        if (!Page_IsValid) {
                            this.set_expanded(false);

                        }
                        else {
                            this.set_expanded(true);
                        }
                    }
                    return true;
                }

Hope this will help you solve the issue.

Regards,
Plamen
Telerik