validate specific controls from Submit button

4 posts, 0 answers
  1. Sanjay
    Sanjay avatar
    12 posts
    Member since:
    Apr 2020

    Posted 02 Apr 2020 Link to this post

    Hi Team,

    We have requirement where we want to validate some set of controls from one specific button.

    <form OnSubmit="handleSubmit">

    <Control1 />

    <div> // This is specific section like repeater

    <Control2 />

    <Button2 />

    </div>

    <Control3 />

    <Button1 />

    </form>

     

    The requirement is

    1. Button1 will validate only Control1 and Control3 but not Control2.

    2. Button2 will validate only Control2

     

    I tried to implement this via enclosing Button2 and Control2 inside another form tag but react dom is giving warning of nested form tag.

    Please let me know is there any way to achieve this functionality in Kendo React.

     

    Regards,

    Sanjay

     

     

  2. Stefan
    Admin
    Stefan avatar
    3008 posts

    Posted 03 Apr 2020 Link to this post

    Hello, Sanjay,

    This is theoretically possible, but it will require a custom logic that will determine if the validation will be applied to some fields.

    We create an example showcasing a possible approach:

    https://stackblitz.com/edit/react-ebex7j-yc6lsy?file=app/main.jsx

    I hope this proves helpful.

    Regards,
    Stefan
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  3. Sanjay
    Sanjay avatar
    12 posts
    Member since:
    Apr 2020

    Posted 09 Apr 2020 in reply to Stefan Link to this post

    Hi Stefan,

    Thanks for your response.

    I checked the shared approach and it is working only for the first time. If I click again in "validate email" button, it  also validates the second text box.

     

    Regards,

    Sanjay

  4. Stefan
    Admin
    Stefan avatar
    3008 posts

    Posted 09 Apr 2020 Link to this post

    Hello, Sanjay,

    In the example indeed this is expected as we never set the "validateEmailOnly" variable back to false. There is should be done on an event that will set it back to false, for example clicking the other submit button:

    https://stackblitz.com/edit/react-ebex7j-yc6lsy?file=app/main.jsx

    Also, please have in mind that this is not an approach that is supported out of the box as in a standard form there is only a single submit button,  and the behavior will strongly depend on the custom logic added to achieve this.

    Regards,
    Stefan
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top