0
私はvue.jsの新機能です。データベースにアキシャスを持つフォームのデータを保存する方法を探しています。私はspringとthymeleafテンプレートエンジンを使用しています。ここでアキシャスとバネを使ったポストメソッド
は私のコードは次のとおりです。
HTMLページ：
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Getting Started: Handling Form Submission</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<div id="app">
<h1>TEST FORM</h1>
<form action="#" method="post">
<p>Type description: <input type="text" v-model="description" /></p>
<p><button v-on:click="addType()"> Send </button><input type="reset" value="Reset" /></p>
</form>
</div>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="http://cdn.jsdelivr.net/vue/1.0.10/vue.min.js"></script>
<script>
Vue.prototype.$http = axios;
new Vue({
el: '#app',
data:{
description: ' '
},
methods:{
addType(){
var vm = this;
this.$http.post('/insert', {
body:vm.description
}).then(response => {})
}
}
});
</script>
</body>
</html>
私は私のテーブル内の記述フィールドがNOT NULLを宣言し、私はこのコードを実行するとき、私は、コンソールでこの例外があります：
org.sqlite.SQLiteException: [SQLITE_CONSTRAINT_NOTNULL] A NOT NULL constraint failed (NOT NULL constraint failed: type.description)
フォームフィールドに入力された値が取得されないとします。どうすればこの問題を解決できますか？ここで
は、スプリングを使用して、私のinsertメソッドです：
@RequestMapping(value = "/insert",method = RequestMethod.POST)
public @ResponseBody void createType(@ModelAttribute Type type) {
if(Objects.equals(type.getDescription(), "")) {
throw new NullPointerException("The description should not be empty.");
}
typeService.createType(type);
}
@RequestMapping(value = "/insert",method = RequestMethod.GET)
public String createTypeForm(Model model) {
model.addAttribute("insertType", new Type());
return "insertType";
}
はあなたの助けのために事前にありがとうございます。