This is a migrated thread and some comments may be shown as answers.

Client side validation before server side events

4 Answers 272 Views

ToolBar

This is a migrated thread and some comments may be shown as answers.

Shannnon asked on 04 Jun 2011, 09:33 PM

I have a Telerik AJAX Radtoolbar act against a RadGrid. I have code behind to do something when I click items on the ToolBar base on row selected in the grid, but before the post back, I need some client side validation, post back won't happen if validation fails. I tried to use

<telerik:RadToolBar runat="server" Width="100%" ID="RadToolBar1" EnableRoundedCorners="true" OnClientButtonClicked="javascript:if(!PageValidation()){return false;}" OnButtonClick="RadToolBar1_ButtonClick" EnableShadows="true" Skin="Office2007" Height="27px" AutoPostBack="false">

<Items>

<telerik:RadToolBarButton Text="Export" Value="1" PostBack="true" />

<telerik:RadToolBarButton IsSeparator="true" />

function PageValidation() {

var IsValid = false;

                      var error = document.getElementById("errorMsg");

var mastertableView = $find("<%= RadGrid1.MasterTableView.ClientID %>");

var count = mastertableView.get_selectedItems().length;

if (count < 1) {

                                 error.style.display = "inherit";

IsValid = false;

}

else {

                         error.style.display = "none";

IsValid = true;

}

return IsValid;

}

However, this causes the RadToolBar unclickable and even jam all other AJAX functions on the page. if I changed the OnClientClicked to "OnClientButtonClicked="PageValidation" ", the client side validation works with the error msg pop up but it cannot stop the post back.

Are there any other ways that I can work around or did I miss something using this method?

Thanks!

4 Answers, 1 is accepted

answered on 08 Jun 2011, 11:53 AM

Hi Shannnon,

Have you tried to put the same code in the OnClientButtonClicking event? That way you can cancel the event if the page is not valid and still be able to show the error message. Here's an example:

function OnClientButtonClicking(sender, args) {

var IsValid = false;

var error = document.getElementById("errorMsg");

var mastertableView = $find("<%= RadGrid1.MasterTableView.ClientID %>");

var count = mastertableView.get_selectedItems().length;

if (count < 1) {

error.style.display = "inherit";

IsValid = false;

args.set_cancel(true;)

}

else {

error.style.display = "none";

IsValid = true;

}

return IsValid;

}

Hope this helps.

Regards,
Veronica Milcheva
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.