Kotlin API を叩く際に Enum を JSON から変換する

SpringBoot2
Thymeleaf
Jackson （Jsonのシリアライズ・デシリアライズで利用）
パラメータで渡すのが一番簡単ですが、折角（？）なので JSON で渡してみる
Jsonで渡すと書いてありますが実際は、Json -> Enum 変換
Kotlin

実施環境

開発PC: Windows 10
Java: 8
Kotlin: 0.8.19
Eclipse: 2019-06 (4.12.0)

想定される場面

連動するセレクトボックスなど
- １つ目のセレクトボックスの選択によって２つ目のセレクトボックスの内容が変わる場合
- Enum の入れ子でやってみる
- Enum は継承出来ないのが今ひとつ

１つ目のセレクトボックス用 Enum

JsonSerialize, JsonDeserialize アノテーションでシリアライズ・デシリアライズのクラスを指定

@JsonSerialize(using = EnumSerializer::class)
@JsonDeserialize(using = EnumDeserializer::class)
enum class Select1Enum(val text:String, val arr:Array<*>) {

    SELECT1("セレクト２－１", Select21Enum.values()),
    SELECT2("セレクト２－２", Select22Enum.values()),
    SELECT3("セレクト２－３", Select23Enum.values()),
    ;
        // 名称により Enum 取得
        fun getByText(text: String):Select1Enum? {

            var result: Select1Enum? = null
            enumValues<Select1Enum>().forEach {
                if (it.text == text) {
                    result = it
                }
            }
            return result
        }

    }

    override fun toString():String {
        return ReflectionToStringBuilder.toString(this)
   }
}

2つめのセレクトボックス用 Enum

同様に複数用意

enum class Select21Enum(val text:String) {

    SELECT1("セレクト２－１ー１"),
    SELECT2("セレクト２－１－２"),
    SELECT3("セレクト２－１－３"),
    ;
        // 名称により Enum 取得
        fun getByText(text: String):Select21Enum? {

            var result: Select21Enum? = null
            enumValues<Select21Enum>().forEach {
                if (it.text == text) {
                    result = it
                }
            }
            return result
        }

    }
}

シリアライズ・デシリアライズ用のクラス

簡単に Enum の text で enum の項目が指定できるように

class EnumDeserializer:JsonDeserializer<Any>() {

	@Throws(IOException::class)
	override fun deserialize(jp:JsonParser, ctxt:DeserializationContext):Select1Enum? {

        val jsonNode:JsonNode = jp.getCodec().readTree(jp)

	    val jsonValue = jsonNode.get("text").asText()
	    for (enumValue in Select1Enum.values()) {
	    	if (enumValue.text.equals(jsonValue)) {
	    		return enumValue
	    	}
	    }
	    return null
  	}
}

class EnumSerializer:JsonSerializer<Select1Enum>() {

    @Throws(IOException::class)
    override fun serialize(value:Select1Enum, jgen:JsonGenerator, provider:SerializerProvider) {
        jgen.writeStartObject()
        jgen.writeFieldName("text")
        jgen.writeString(value.text)
        jgen.writeEndObject()
    }
}

APIで出力するテンプレートを用意

fragment_select2.html（thymeleaf）

<!DOCTYPE html>

<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>Insert title here</title>
</head>
<body id="fragmentBody" th:fragment="fragmentBody()">
            <select name="select2" id="select2" th:fragment="fragmentSelect()">
              <option value="">選択してください。</option>
              <option th:if="${select2List != null}" th:each="i : ${select2List}" th:value="${i.text}" th:text="${i.text}" th:selected="${i.text} == *{select2}"> --- </option>
            </select>
            <span th:if="${#fields.hasErrors('select2')}" th:errors="*{select2}" id="select2.errors" class="help-block error" th:style="|display: block;|">正しく入力してください。</span>
</body>
</html>

API出力用コントローラ

/api/select/getSelect2
@RequestBody アノテーションをつける
後述 javascript で呼び出される
Json 形式で受け取ったパラメータを Enum へデシリアライズ

@Controller
@RequestMapping("api/select")
open class SelectApiController {

    @PostMapping(path=["/getSelect2"],
        consumes=[MediaType.APPLICATION_JSON_VALUE])
    open fun getSelect2(@RequestBody(required=false) select1:Select1Enum?, model:Model): String {

    	if (select1 != null) {
            model.addAttribute("select2List", select1.arr)
        }

        return "fragment_select2::fragmentSelect()"
    }
}

入力用フォームのHTML（抜き出し）

            <div>
              <select name="select1" id="select1" th:field="*{select1}">
                <option value="">選択してください。</option>
                <option th:each="i : ${selectList}" th:value="${i.text}" th:text="${i.text}">選択１</option>
              </select>
              <span th:if="${#fields.hasErrors('select1')}" th:errors="*{select1}" id="select1.errors" class="help-block error" th:style="|display: block;|">セレクト１を正しく入力してください。</span>
            </div>
            <div id="fragment_select2" th:include="select/fragment_select2::fragmentBody()">

セレクトボックス連動用 javascript

jquery 利用
Json 形式で渡す
結果は #fragment_select2 に注入

// ページロード後に呼び出す
function initializeSelect1Events() {

	// 業種セレクト連動
	$("#select1").on('change', function(e) {
		select1OnChange();

	});
}

function select1OnChange() {
	var url = contextPath + '/api/select/getSelect2';
	var value = $("#select option:selected").val();
	var data = JSON.stringify({'text': value});

	$.ajax({
		headers: {
			'Content-Type': 'application/json'
		},
		url: url,
		type: 'POST',
		cache: false,
		dataType: 'html',
		data: data,
		traditional: true,
		beforeSend: function(xhr, settings) {}
	})
	.done(function(data, textStatus, xhr) {
		if (data.error !== undefined) {
			alert(data.error);
		}
		else if (data.length == 0) {
			alert("セレクト２が取得できませんでした");
		}
		else {
			$("#fragment_select2").html(data);
		}
	})
	.fail(function(xhr, textStatus, errorThrown){
		alert("セレクト２が取得できませんでした");
	})
	.always(function(xhr, msg){
	});
}

以上、お疲れさまでした！