Javascript 如何将复选框值从HTML发送到节点JS?
我尝试将一些复选框值从HTML发送到节点JS。在我的HTML文件中,表中有一些复选框。我得到的复选框值如下所示Javascript 如何将复选框值从HTML发送到节点JS?,javascript,jquery,html,node.js,checkbox,Javascript,Jquery,Html,Node.js,Checkbox,我尝试将一些复选框值从HTML发送到节点JS。在我的HTML文件中,表中有一些复选框。我得到的复选框值如下所示 $("#createSS").click(function (event) { event.preventDefault(); var searchIDs = $("#imgTable input:checkbox:checked").map(function () { return $(this).val(); }).get(); co
$("#createSS").click(function (event) {
event.preventDefault();
var searchIDs = $("#imgTable input:checkbox:checked").map(function () {
return $(this).val();
}).get();
console.log("selected::::" + searchIDs);
});
我的HTML表单是
<form action="/addSlideShow" method="POST">
<table id="imgTable" class="table">
{{#images}}
<tr>
<td><input id={{imgURL}} type="checkbox" name="ch" value={{imgURL}}/></td>
</tr>
{{/images}}
</table>
<input id="createSS" type="submit" value="Create Slide Show" class="btn btn-success pull-left" disabled/>
</form>
当我在HTML中单击按钮时,for没有提交。我怎样才能解决这个问题
提前谢谢
<input id="createSS" type="submit" value="Create Slide Show" class="btn btn-success pull-left" disabled/>
“提交”按钮已禁用。最后删除禁用的
属性。这是因为您没有将数据发布到表单url。正如您使用的event.preventDefault()
一样,它永远不会提交数据,也不会发布数据
尝试使用类似ajax的方式发布数据
$("#createSS").click(function (event) {
event.preventDefault();
var searchIDs = $("#imgTable input:checkbox:checked").map(function () {
return $(this).val();
}).get();
console.log("selected::::" + searchIDs);
$.ajax({
url:'/addSlideShow',type:'post',
data:{searchid:searchIDs},
success:function(response){
console.log(response);
}
});
});
在node js中,您将获得
app.post('/addSlideShow', function(req, res) {
console.log(req.body); //Output=> like { searchid: 'Array of checked checkbox' }
console.log(req.body.searchid); // to get array of checked checkbox
});
您正在使用event.preventDefault()
,它告诉浏览器不要在单击时执行它应该执行的操作。删除该行,您的表单将被提交。我不是节点忍者,但您在req.body中的数据不会是html格式。查询$(“td”)是前端逻辑。您需要为每个复选框指定不同的名称,如name=“ch-{{{$index}}”
(在重复操作中也是如此)。或者,您应该通过ajax发送{searchid:searchid}
。不,您不需要,您只需侦听从不触发的事件。简化示例:默认情况下,我的url是http://dashboard.mybluemix.net/deletePage
。单击按钮时,应将其更改为http://dashboard.mybluemix.net/addSlideShoe
。但这并没有改变。我删除了禁用
。但按钮动作未触发。首先清除。你到底要不要ajax?如果没有,那么为什么您将deletePage
更改为addSlideShoe
好吧,如果您preventDefault()
,您的表单将不会被发送,因为您要求它不要做他应该做的事情。通过使用它,您需要以某种方式将数据发送到/addSlideShoe
,因此使用Ajax。@codebot尝试我的代码,然后让我们知道您面临的下一个问题。
app.post('/addSlideShow', function(req, res) {
console.log(req.body); //Output=> like { searchid: 'Array of checked checkbox' }
console.log(req.body.searchid); // to get array of checked checkbox
});