sumbitButton이 params이 invalid 한 경우에 disabled 상태로 표시되지 않음

버그 리포트
3

sumitButton의 disabledFn 은 따로 작성하지 않았습니다.

params 마다 있는 조건을 종합적으로 작성하면 되긴 한데, 아래 링크 드린 글에서
’1개 이상 폼에러가 있으면 submit button이 disabled 된다’ 라고 설명되어 있어서 sumitButton의 disabledFn을 명시하지 않으면 되는 줄 알았습니다.

하지만 이상한 점은, sumitButton의 disabledFn은 없음에도 특정 param이 validateFn에 의해 에러메세지가 노출될때 버튼이 비활성화 안되는데, 모달을 다시 열면 param이 validateFn에 의해 submit button이 비활성화 되어 있습니다.

코드도 공유드립니다.

modals:
  - path: edit-end_date-:pid
    name: 종료일 변경
    header: false
    mode: center
    height: 200px
    useColumn:
      - pid
      - name
      - start_at
      - end_at
    blocks:
      - type: query
        subtitle: |
          현재 종료일은 "{{ end_at }}" 입니다.
        resource: pt_prod
        sqlType: update
        sql: >
          {{생략}}
        sqlConfirm: true
        confirmText: |
          워크스페이스를 확인하세요!
          [[ {{name}} ]]
          변경하시겠습니까?
        reloadAfterSubmit: true
        display: form
        formOptions:
          firstLabelWidth: 100px
        submitButton:
          type: primary
          label: 변경하기
        params:
          - key: id
            valueFromRow: pid
          - key: start_at
            valueFromRow: start_at
          - key: end_at_umlimit
            required: true
            label: 종료일
            radio:
              - value: Y
                label: 무기한
              - value: N
                label: 종료일 지정
            radioButtonGroup: true
            defaultValue: N
            validateFn: |
              const end_at = params.find(e => e.key == 'end_at')
              if(param.value == 'Y'){
                end_at.disabled = true
                end_at.value = ''
              } else{
                end_at.disabled = false 
              }
              return true
          - key: end_at
            label: 날짜 선택
            format: date
            width: 180px
            disabled: false
            defaultValueFromRow: end_at
            validateFn: |
              if(param.value != ""){
                const startDate = new Date(params.find(e => e.key == 'start_at').value);
                const endDate = new Date(param.value);
                if (startDate > endDate) {
                  return '시작일보다 과거일 수 없습니다.'
                }
              }
              return true
1개의 좋아요