Enabling validation when inserting

[Erik]

Hi,

I cannot seem to enable client-side validation when I am inserting new records using AJAX binding. When I click Insert the data is simply posted to the Controller, which then (correctly) rejects it but I would like to see the error messages on the client-side. I cannot find any tutorials anywhere and the MVC demo's aren't giving up their secrets either. Could you point me in the right direction? I am using version 2010.2.902 which is a hotfix release for an earlier problem described here.

I am sure I am missing something completely obvious here :)

Thanks and best regards,

Erik

[Atanas Korchev]

Hello Erik,

 Validation is enabled by default and should work with insert only scenarios. I am sending a sample project showing a simple setup.

Regards,
Atanas Korchev
the Telerik team

[Erik]

Hello Atanas,

Your example works perfectly but I cannot see any difference between my own code and yours. The only thing I notice is that while the 'Add new record' button in my code does refer to the url 'http://localhost.../Accounts/1?Accounts-mode=insert' the page address does not change but remains 'http://localhost.../Accounts/1'. In your example the page address changes (to 'http://localhost.../?Grid-mode=insert')just before the pop-up is shown. Could that be the problem? And if so, what could cause it to happen? Could there be a bug with the route containing an id?

The code in question is below. The Model here is a Company object.

Html.Telerik().Grid<RingCredible.Portal.Domain.Models.Account>()
    .Name("Accounts")
    .ToolBar(commands => commands.Insert().ButtonType(GridButtonType.Text))
    .DataKeys(keys => keys.Add(a => a.Id))
    .DataBinding(binding =>
      binding.Ajax()
              .Select("GetAccounts", "Company", new { id = Model.Id })
              .Insert("AddAccount", "Company", new { id = Model.Id })
              .Update("EditAccount", "Company")
              .Delete("DeleteAccount", "Company"))
    .Columns(columns =>
      {
        columns.Bound(a => a.ContactName);
        columns.Bound(a => a.MobileNumber);
        columns.Bound(a => a.Email);
        columns.Bound(a => a.IMEI);
        columns.Bound(a => a.SipAccountName);
        columns.Command(commands =>
          {
            commands.Edit().ButtonType(GridButtonType.Text);
            commands.Delete().ButtonType(GridButtonType.Text);
          }).Width(180);
      })
    .ClientEvents(events =>
    {
      events.OnRowDataBound("onAccountsGridRowDataBound");
    })
    .Editable(editing => editing.Mode(GridEditMode.PopUp))
    .Footer(false)

Again, I am sure it's something obvious. Not obvious enough though :)

Best Regards,

Erik

[Erik]

As a side not, this is not an insert-only scenario. I have one of those at a different location and it works perfectly.

[Erik]

Hi Atanas,

Being rather an idiot, I missed the obvious difference between your example and my code. I am using AJAX binding whereas you are using Server binding. Could that be the issue? I have done a quick search but didn't find a conclusive answer just yet. Then again, it was a VERY quick search...

Best Regards,

Erik

[Atanas Korchev]

Hello Erik,

 The method of binding should not make a difference. In the attached example I changed "Server()" to "Ajax()" and validation still works. I suggest you isolate your problem in a sample application and attach it here. We will investigate what has gone wrong.

All the best,
Atanas Korchev
the Telerik team

[Erik]

Hi Atanas,

I am so sorry for wasting your time, I am a right idiot. I dug a little deeper and suddenly realized I am using a custom EditorTemplate to modify the Insert form. In this template I was missing the <%= Html.ValidationMessage(prop.PropertyName) %> directive. Apparently if you do not specify this, validation will not be triggered. Makes perfect sense in retrospect.

Validation is working like a charm now. Thank you so much for you help and I hope my trials will save you or someone else some time in the future :)

Best Regards,

Erik