我正在尝试使用RESTful express路由在HTML中创建一个帖子表单,类似于/ game /:gameID / node /:nodeRow /:nodeCol / update来更新给定游戏中的给定节点。
这是路线代码:
app.post("/game/:gameID/node/:nodeRow/:nodeCol/update", function(request, response) {
gameHandler.updateNode(request, response)
});
我在HTML中这样做的原因是因为我还没有在实际的客户端(手机游戏)中创建功能,所以我需要一些东西来测试它。但是,我还没弄清楚如何制作HTML表单,以便我可以在表单中输入数据来替换:gameID,:nodeRow和:nodeCol,而不必手动转到URL,例如/ game / 3 / node / 2/5 /更新。
这是一个帖子请求,我希望表单中包含其他数据,以指定要更新的属性以及新值。
我怎么能这样做,或者我在想错了?
修改
将问题标题更改为更有用。
答案 0 :(得分:0)
在POST请求中传递数据的方法是从html表单控件中推送数据,并从请求正文中检索值。下面的HTML定义了一个包含变量的表单,您可以从浏览器手动输入:
<html><body>
<form method="post" action="/game/update" role="form">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">gameID</span>
<input type="text" class="form-control" name="gameID" placeholder="<gameID>" value="123456">
</div>
</div>
<div class="input-group">
<span class="input-group-addon">nodeRow</span>
<input type="text" class="form-control" name="nodeRow" placeholder="<nodeRow>" value="1">
</div>
</div>
<div class="input-group">
<span class="input-group-addon">nodeCol</span>
<input type="text" class="form-control" name="nodeCol" placeholder="<gameID" value="1">
</div>
</div>
<hr>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</body></html>
然后你可以按照下面的内容编写一个处理程序。单击“提交”将关闭POST请求,并将变量拉出请求正文,如下所示。
app.post("/game/update", function(request, response) {
updateNodeHandler(request, response)
});
function updateNodeHandler(request, response) {
var nodeID = request.body.nodeID;
var nodeRow = request.body.nodeRow;
var nodeCol = request.body.nodeCol;
// Additional logic goes here...
}
答案 1 :(得分:0)
尝试
app.post("/game/:gameID/node/:nodeRow/:nodeCol/update", function(request, response) {
console.log({gameID: request.params.gameID, nodeRow: request.params.nodeRow,nodeCol: request.params.nodeCol, body: request.body});
response.send({gameID: request.params.gameID, nodeRow: request.params.nodeRow,nodeCol: request.params.nodeCol, body: request.body});
});
<小时/> 对不起,我误解了你的问题。我认为你在节点中解析节点参数时遇到了困难。
无论如何,有不同的方法可以实现这一目标。当然,您需要支持javascript,无论是纯javascript
还是jQuery
。
这是一个例子
<form id="myform">
<input name="gameID" id="gameID" />
<input name="nodeRow" id="nodeRow" />
<input name="nodeCol" id="nodeCol" />
<button name="action" value="bar" onclick="submitForm();">Go</button>
</form>
和javascript(使用jQuery)将是
<javascript>
function submitForm(){
$("#myform").attr('action',
'/game/' + $("#gameID").val() + '/node/' + $("#nodeRow").val()
+ '/' + $("nodeCol").val() + '/update');
$("#myform").submit();
}
</javascript>