devsam/core
3
6
Fork 1
Code Issues 60 Pull Requests Releases 1 Wiki Activity

fix: jqValidateForm에서 복합 타입(radio, checkbox) 처리 오류 수정

Browse Source
This commit is contained in:
Hide_D
2021-08-20 01:30:34 +09:00
parent e3c3afe809
commit 17c83f8db9
1 changed files with 38 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
hwe/ts/util/jqValidateForm.ts
+38 -11
View File
@@ -5,7 +5,7 @@ import $ from 'jquery';
type Option = { type Option = {
preParse?: ($target?: JQuery<HTMLElement>)=>void, preParse?: ($target?: JQuery<HTMLElement>)=>void,
postParse?: (values:Record<string, string | string[]>, $target?: JQuery<HTMLElement>)=>Record<string, string | string[]> postParse?: (values:Record<string, string | string[]>, $target?: JQuery<HTMLElement>)=>[Record<string, string | string[]>, Map<string, string>]
} }
export class JQValidateForm { export class JQValidateForm {
@@ -13,7 +13,7 @@ export class JQValidateForm {
public readonly inputs: JQuery<HTMLElement>; public readonly inputs: JQuery<HTMLElement>;
constructor(public readonly target: JQuery<HTMLElement>, public readonly rule: Rules, public readonly option?:Option) { constructor(public readonly target: JQuery<HTMLElement>, public readonly rule: Rules, public readonly option?:Option) {
this.validator = new Schema(rule); this.validator = new Schema(rule);
this.inputs = target.find('input'); this.inputs = target.find(':input');
} }
public clearErrMsg():void { public clearErrMsg():void {
@@ -34,30 +34,57 @@ export class JQValidateForm {
this.option.preParse(this.target); this.option.preParse(this.target);
} }
let rawValues = mergeKVArray(this.inputs.serializeArray()); let rawValues = mergeKVArray(this.inputs.serializeArray());
let optMap: Map<string, string>;
if(this.option?.postParse !== undefined){ if(this.option?.postParse !== undefined){
rawValues = this.option.postParse(rawValues, this.target); [rawValues, optMap] = this.option.postParse(rawValues, this.target);
} }
else{
optMap = new Map();
}
console.log(rawValues);
const validateResult = await this.validator.validate(rawValues).catch(({ fields }) => { const validateResult = await this.validator.validate(rawValues).catch(({ fields }) => {
this.clearErrMsg(); this.clearErrMsg();
for(const key of Object.keys(fields)){ for(const rawKey of Object.keys(fields)){
let $item: JQuery<HTMLElement>; let $item: JQuery<HTMLElement>;
const errMsg = fields[key][0].message; const key = rawKey.split('.')[0];
if(isArray(rawValues[key])){ console.log(`ErrorType: ${key}:${rawValues[key]}`);
$item = $(`#db_form input[name='${key}[]']`); const errMsg = fields[rawKey][0].message;
if(optMap.has(key)){
$item = this.target.find(optMap.get(key) as string);
}
else if(isArray(rawValues[key])){
$item = this.target.find(`:input[name='${key}[]']`);
} }
else{ else{
$item = $(`#db_form input[name='${key}']`); $item = this.target.find(`:input[name='${key}']`);
}
if($item.length == 0){
continue;
} }
$item.addClass('is-invalid');
const $error = $(`<span>${errMsg}</span>`); const $error = $(`<span>${errMsg}</span>`);
$error.addClass( "invalid-feedback" ); $error.addClass( "invalid-feedback" );
if ( $item.prop( "type" ) === "checkbox" ) { if ("radio" == $item.prop( "type" )) {
$error.insertAfter( $item.parent( "label" ) ); const $target = $item.parents( ".btn-group" );
$error.insertAfter( $target );
$target.addClass('is-invalid');
}
else if ("checkbox" == $item.prop( "type" )) {
let $target = $item.parent( "label" );
if($target.parent(".btn-group").length){
$target = $target.parent('.btn-group');
}
$error.insertAfter( $target );
$target.addClass('is-invalid');
} else { } else {
$error.insertAfter( $item ); $error.insertAfter( $item );
$item.addClass('is-invalid');
} }
} }