带有嵌套表单的 jQuery 对话框
我有一个 jQuery 对话框,其中有一个嵌套表单。该表单包含一个输入框和一个提交按钮。当对话框弹出时,我希望用户只能填写它,而页面上没有其他内容。我的 css 在这里完成:
.ui-widget-overlay
{
height: 1339px !important;
width: 595px !important;
}
这允许用户不在页面上执行任何其他操作,但问题是输入字段也被禁用。
有什么建议吗?
编辑:这是我制作对话框的方法
function dialog(left, top) {
//Creates a new dialog
$('#dialog').dialog({
position: [left, top],
height: 90,
width: 200,
resizable: false,
modal: true,
title: '<span class="ui-icon ui-icon-home"></span> Enter Info',
});
}
这是我用于对话框的表单:
<!-- Store Location Dialog -->
<div id = "dialog">
<form id = "info" method = "post" action = "Default.aspx" \>
<input type = "text" id = "changeDialogText" name = "changeLocation" /> <!-- THIS IS DISABLED -->
<input type = "button" id = "changeDialogSubmit" value = "" onclick = "function()"/>
</form>
</div>
I have a jQuery dialog with a nested form inside of it. The form contains an input box and a submit button. When the dialog pops up I want the user to only be able to fill it out, and nothing else on the page. My css for that is done here:
.ui-widget-overlay
{
height: 1339px !important;
width: 595px !important;
}
This works in allowing the user not to do anything else on the page, but the problem is that the input field is also disabled.
Any suggestions?
Edit: Here is how I make the dialog
function dialog(left, top) {
//Creates a new dialog
$('#dialog').dialog({
position: [left, top],
height: 90,
width: 200,
resizable: false,
modal: true,
title: '<span class="ui-icon ui-icon-home"></span> Enter Info',
});
}
Here is the form I use for the dialog:
<!-- Store Location Dialog -->
<div id = "dialog">
<form id = "info" method = "post" action = "Default.aspx" \>
<input type = "text" id = "changeDialogText" name = "changeLocation" /> <!-- THIS IS DISABLED -->
<input type = "button" id = "changeDialogSubmit" value = "" onclick = "function()"/>
</form>
</div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我想通了这个问题。我的表单的
z-index
低于页面的z-index
。这会导致对话框出现问题,因为不确定输入是在对话框中还是在页面上I figured out the issue. I had the
z-index
of my form lower then thez-index
of the page. This caused issues with the dialog because it was unsure if the input was in the dialog or on page以上并没有提供正确的字面答案。
z-Index
auto 不会削减它。The above does not provide a literal answer that is correct.
z-Index
auto does not cut it.