我正在尝试为 D & D 创建字符表,但希望能够将两个下拉框的值传递到查询(服务类)中,然后将数据添加到另一个选项列表中。我尝试了多种发布数据的方法,但我得到的都是空字符串。我正在使用 MVC 方法,因为这是我们在我所任教的大学中一直使用的方法。
纯粹使用 GET 方法从数据库获取列表没有问题,但我无法理解如何在不使用按钮的情况下从表单获取实际数据。一旦值就位,实际的查询也不再是问题。我发现了很多使用 PHP 的解决方案,但这不是我们正在使用的。
HTML
<html>
<head>
<title>D&D 3.5 Character Sheet</title>
<link rel="stylesheet" href="css/index.css">
<script src="/client/js/jquery-3.3.1.min.js"></script>
<script src="/client/js/popper.min.js"></script>
<script src="/client/js/bootstrap.min.js"></script>
<script src="/client/js/js.cookie.min.js"></script>
<script src="/client/js/character.js"></script>
</head>
<body bgcolor="#ffe4c4" onload="pageLoad()">
<form id="characterBasicsForm">
<h1 align="center" style="color: peru; font-size: 75px">Dungeons & Dragons 3.5 Character Sheet</h1>
<div class="container">
<div class="basic">
<div class="cn">
<input id="characterName" class="largest character-input-basics" type="text" required>
<small>Character name</small>
</div>
<div class="pn">
<input id="playerName" class="largest character-input-basics" type="text">
<small>Player name</small>
</div>
<div id="cl" class="cl">
</div>
<div class="level">
<input id="characterLevel" class="medium character-input-basics" type="number" required>
<small>Level</small>
</div>
<div id="race" class="race">
</div>
<div id="alignment" class="al" onchange="test()">
</div>
<div id="deity" class="de">
>
</div>
<div class="size">
<select id="characterSize" class="small character-select-basics">
<option value="small">Small</option>
<option value="medium">Medium</option>
<option value="large">large</option>
</select>
<small>Size</small>
</div>
<div class="age">
<input id="characterAge" type="text" class="small character-input-basics">
<small>Age</small>
</div>
<div class="gender">
<select id="characterGender" class="small character-select-basics">
<option value="male">Male</option>
<option value="female">Female</option>
</select>
<small>Gender</small>
</div>
<div class="height">
<input id="characterHeight" type="text" class="small character-input-basics">
<small>Height</small>
</div>
<div class="weight">
<input id="characterWeight" type="text" class="small character-input-basics">
<small>Weight</small>
</div>
<div class="eyes">
<input id="characterEyes" type="text" class="small character-input-basics">
<small>Eyes</small>
</div>
<div class="hair">
<input id="characterHair" type="text" class="small character-input-basics">
<small>Hair</small>
</div>
<div class="skin">
<input id="characterSkin" type="text" class="small character-input-basics">
<small>Skin</small>
</div>
</div>
<div class="ability" id="abilities">
ABILITIES
</div>
<div class="content1">
COLUMN 1
</div>
<div class="content2">
COLUMN 2
</div>
<div class="attack">
ATTACK STATS
</div>
<div class="skill" id="skills">
SKILLS
</div>
</div>
<input type="button" value="Save Character">
</form>
</body>
</html>
Javascript
function populateDeity(){
let formData = {'alignment': $('option[name=alignment]').val(), 'characterClass': $('option[name=characterClass]').val()};
alert(formData.toString());
$.ajax({
url: '/character/deity/list',
type: 'GET',
success: deityList => {
let deityHTML = `<select id="deity" class="medium character-select-basics">`;
for (let deity of deityList) {
deityHTML += `<option value = "${deity.deity}">${deity.deity}</option>`;
}
deityHTML += `</select>`;
deityHTML += `<small>Deity</small>`;
alert(deityHTML);
$('#deity').html(deityHTML);
}
})
}
Java - Controller 类
@GET
@Path("/deity/list")
@Produces(MediaType.APPLICATION_JSON)
public String getDeities() {
String status = CharacterService.selectAllDeityInto(Deity.deityList);
Console.log(status);
if (status.equals("OK")) {
JSONArray deityList = new JSONArray();
for (Deity d : Deity.deityList) {
deityList.add(d.toJSON());
}
return deityList.toString();
} else {
System.out.println("An error occurred! " + status);
return "";
}
}
最佳答案
GET 请求不接收表单数据。将它们添加为 URL 参数,并在 Java 代码中使用 @PathParam 来读取它们。
@GET
@Path("/deity/list")
@Produces(MediaType.APPLICATION_JSON)
public String getDeities(@PathParam("alignment") final String alignment, @PathParam("characterClass") final String characterClass) {
...
}
关于javascript - 我希望能够根据角色类别及其阵营选择神灵列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56649977/