Reset Form to initial values

6 posts, 0 answers
  1. Dima
    Dima avatar
    9 posts
    Member since:
    May 2016

    Posted 28 May 2018 Link to this post

    Hello,

    the default form-reset behaviour with preloaded inputs in HTML5 is setting the value back to the loaded value. For example: I open the customer-form and the name input is loaded with value = "Hans Müller". When i change the value to "Wilfried" and reset the form, the value is changed back to "Hans Müller".

     

    With kendo-controls however, the behaviour is different. Resetting the form clears all fields, the value in the examples becomes empty.

    Is it possible to change that behaviour to the "default" behaviour (Back to loaded values)?

     

    Any help is much appreciated.

    Dima.

  2. Dima
    Dima avatar
    9 posts
    Member since:
    May 2016

    Posted 28 May 2018 in reply to Dima Link to this post

    In addition: This "missbehaviour" occurs using the taghelper. Using the razor html-helper, at least textboxes work fine. Dropdowns however are also being resettet to empty, no matter if taghelper or html-helper.
  3. Dima
    Dima avatar
    9 posts
    Member since:
    May 2016

    Posted 28 May 2018 in reply to Dima Link to this post

    Sorry for correcting myself again: HTML-Helper works fine for all input-types.
  4. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    1241 posts

    Posted 31 May 2018 Link to this post

    Hello Dima,

    Attached you will find a simple .Net Core application having a form with four Telerik helpers - two TagHelpers and two HtmlHelpers. While testing the reset behaviour at my end, the inputs are properly returned to their initial values. May I ask you to modify the attached so it reproduces the issue observed at your end and send it back to us?

    Regards,
    Veselin Tsvetanov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Dima
    Dima avatar
    9 posts
    Member since:
    May 2016

    Posted 06 Jun 2018 Link to this post

    Hello Veselin,

    your example with hardcoded values works as expected. But when you add a ViewModel and bind a control to a model property, then the missbehaviour appears. 

    I added a simple ViewModel class with a single property "Name" and defined the Tag/Html-Helpers as follow:

    <kendo-maskedtextbox for="Name"></kendo-maskedtextbox>

    @(Html.Kendo().TextBoxFor(m => m.Name))

    The HtmlHelper works fine, the TagHelper does not. Sadly i can not attach a .zip file here ("allowed: .jpg, .jpeg, .gif, .png"). Otherwise i would attach the modified project.

    Thanks in advance.

     

    Regards,

    Dima.

     

  6. Angel Petrov
    Admin
    Angel Petrov avatar
    1154 posts

    Posted 11 Jun 2018 Link to this post

    Hello,

    Indeed your observations are correct. The reason for this behavior is that the rendered contents of the MaskedTextBox hold the value in the scripts not in the input.

    In order to resolve the matter you can add a script which to initially render an value attribute to the MaskedTextBox input which to hold the initial value. That way when the form gets reset the value will be correctly updated.

    Regards,
    Angel Petrov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top