Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Jonathan Roberts 372 posts 1005 karma points
    Jan 16, 2018 @ 14:32
    Jonathan Roberts
    0

    Grid control validation

    Hi,

    I am building a simple Grid control and I wondered if it was possible to make any of the fields "Required" ? If it is possible does anyone have any sample code to put validation into the grid?

    <div ng-controller="sgrid.quotecontroller">
<textarea rows="1"
          umb-auto-resize
          umb-auto-focus
          class="textstring input-block-level" id="{{control.uniqueId}}_text"
          ng-model="control.value.quote"
          ng-attr-style="{{control.editor.config.style}}" style="font-weight:bold; font-size:20px;" placeholder="Quote text..."></textarea>

<textarea rows="1"
          umb-auto-resize
          class="textstring input-block-level" id="{{control.uniqueId}}_text"
          ng-model="control.value.source"
          ng-attr-style="{{control.editor.config.style}}" placeholder="Quote Source..."></textarea>
</div>

    Thanks

    Jon

    Copy Link
  • Anders Bjerner 448 posts 2601 karma points MVP 4x admin c-trib
    Jan 23, 2018 @ 09:13
    Anders Bjerner
    0

    Hi Jonathan,

    Umbraco uses Angular for validation, so the fields will be required if you add a required attribute - eg:

    <textarea rows="1"
          umb-auto-resize
          umb-auto-focus
          required
          class="textstring input-block-level" id="{{control.uniqueId}}_text"
          ng-model="control.value.quote"
          ng-attr-style="{{control.editor.config.style}}" style="font-weight:bold; font-size:20px;" placeholder="Quote text..."></textarea>

    Alternatively you can use ng-required instead to use a condition - if a setting telling whether the field you in fact be required.

    Copy Link
  • Jonathan Roberts 372 posts 1005 karma points
    Jan 23, 2018 @ 09:20
    Jonathan Roberts
    0

    That is great - how do you set a Required warning next to the correct field in the Grid?

    Copy Link
  • Anders Bjerner 448 posts 2601 karma points MVP 4x admin c-trib
    Jan 23, 2018 @ 09:27
    Anders Bjerner
    100

    A required field will get a red border if you hit Save, and the field doesn't have a value. Is that sufficient?

    Otherwise it gets a bit more complex. I did this for one of my packages - you can see that here:

    https://github.com/skybrud/Skybrud.ImagePicker/blob/master/src/Skybrud.ImagePicker/App_Plugins/Skybrud.ImagePicker/Directives/ImagePicker.js#L23

    The trick is to give the element (field) a unique ID, and you can then check whether that element has some of the classes added by Angular during validation.

    Copy Link
  • Jonathan Roberts 372 posts 1005 karma points
    Jan 23, 2018 @ 09:53
    Jonathan Roberts
    0

    Fantastic - thanks again for all your help

    :)

    Copy Link

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies