对话框passingin check values to empty选择框
对话框passingin check values to empty选择框
提问于 2018-06-20 01:08:54
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
var $dialog = $('<div></div>')
.html('<form id="myform" action=""><input type="checkbox" id="completeCheck" name="completeCheck" value="truck" />Complete check<br /><input type="checkbox" name="view" value="Car" /> View report <br /><input type="checkbox" name="consist" value="van" />Consistency check<br /><input type="checkbox" name="other" value="bike" />Other checks<br /><input type="checkbox" name="keyCheck" value="scooter" />Key check<br /><input type="checkbox" name="compareCheck" value="skate" />Compare check<br /></form>')
.dialog({
autoOpen: false,
title: 'Data check',
buttons: {
"Submit Form": function() {
$('form#myform').submit();
},
"Cancel": function() {
$(this).dialog("close");
}
}
});
$('#createNew').click(function() {
$dialog.dialog('open');
// prevent the default action, e.g., following a link
return false;
});
$('form#myform').submit(function() {
$(this).find(':checkbox').each(function() {
if (this.checked) {
//alert(this.value + ' is checked');
var sel = $('<select>').appendTo('body');
sel.append($("<option>").attr('value', this.value).text(this.name));
} else
alert(this.name + ' is not checked');
});
$dialog.dialog('close');
});
});
</script>
<a id="createNew" href="#">open</a>
</body>
</html>在弹出框中有一个弹出框，当您选中那些复选框时，您将拥有复选框，它们会用您在弹出框中选择的项目填充一个空的选择框。然后，当您逐个选择这些项时，将为所选的每个项显示一个输入框。然后，您必须将选择框中填充的那些项与相应的输入字段一起传递给数据库。
我在从复选框对话框中获取要填充到选择框中的值时遇到问题。它正在通过url并重新加载页面。还希望将所有的值从选择框传递到mysql数据库。
回答 1
Stack Overflow用户
发布于 2018-06-20 01:43:18
试试这个：
<html>
<head>
<title></title>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
var $dialog = $('<div></div>')
.html('<form id="myform" action=""><input type="checkbox" id="completeCheck" name="completeCheck" value="truck" />Complete check<br /><input type="checkbox" name="view" value="Car" /> View report <br /><input type="checkbox" name="consist" value="van" />Consistency check<br /><input type="checkbox" name="other" value="bike" />Other checks<br /><input type="checkbox" name="keyCheck" value="scooter" />Key check<br /><input type="checkbox" name="compareCheck" value="skate" />Compare check<br /></form>')
.dialog({
autoOpen: false,
title: 'Data check',
buttons: {
"Submit Form": function() {
$('form#myform').submit();
},
"Cancel": function() {
$(this).dialog("close");
}
}
});
$('#createNew').click(function() {
$dialog.dialog('open');
// prevent the default action, e.g., following a link
return false;
});
$('form#myform').submit(function(e) {
var sel = $('<select>').appendTo('body');
$(this).find(':checkbox').each(function() {
if (this.checked) {
sel.append($("<option>").attr('value', this.value).text(this.name));
} else {
alert(this.name + ' is not checked');
}
});
$.ajax({
type: 'POST',
url: 'url',
data: $(this).serialize()
});
$dialog.dialog('close');
e.preventDefault();
});
});
</script>
<a id="createNew" href="#">open</a>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50933626
复制相关文章
相似问题