在SuiteCommerce中创建弹出窗口
在SuiteCommerce中创建弹出窗口
提问于 2016-05-04 17:23:27
我想创建一个点击标签的弹出对话框。
<a href='mailto:test@test.com'> test@test.com </a>单击此标签显示弹出对话框以发送电子邮件。它应该有电子邮件地址字段，名称字段，消息字段等。
这个站点是用SuiteCommerce构建的。
回答 2
Stack Overflow用户
发布于 2016-05-06 03:21:14
一种方法是使用像jQuery这样的库来轻松地显示通常隐藏的弹出式div。
您的代码将类似于下面的代码，并假设您已经在页面上加载了一个jQuery库，以及一个要向其提交表单的端点/destination。你还需要应用stying来使弹出窗口居中显示，否则看起来没问题。
<html>
<body>
<a href='mailto:test@test.com' id="email_to_click"> test@test.com </a>
<div id="popup" style="display:none">
<form action="/destination">
Name: <input type="text" name="my_name"><br>
Email: <input type="text" name="email"><br>
Message <input type="text" name="message"><br>
<input type="submit" value="Submit">
</form>
</div>
<style>
#popup
{
position:absolute;
width:400px;
top: 50%;
left: 50%;
margin-left: -200px; // 1/2 width
margin-top: -200px; // 1/2 height }
</style>
<script>
$.ready(
$("#email_to_click").click(function(){
$("#popup").show();})
)
</script>
</body>
</html>Stack Overflow用户
发布于 2018-12-08 01:39:39
您需要在适当的位置设置几个组件
- 带有链接的按钮，该按钮将显示弹出窗口和数据切换=“以模式显示”。该链接应指向定义为实例化视图的路由
- 将上述路由与要创建的视图链接的路由器
- 包含带有要创建的逻辑和字段的模板的视图。
如果您想要一个示例，请看一下address_details.tpl，它使用相同的方案打开地址的编辑模式。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37023565
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号