取消弹出而不是预先填充

Question

我想在我的取消感谢页面中预先填写Calendly表格。我正在使用选项，但是信息丢失了。

这是URL：

https://try.demopage.com/demothankyou/?first_name=john&email=test%40gmail.com

​

<script>
    const params = (new  URL(window.location)).searchParams

    Calendly.initInlineWidget({
        url: 'https://calendly.com/d/dns-sg1-kc3/try-demo?hide_event_type_details=1&hide_gdpr_banner=1',
        prefill: {
            name: params.get('first_name'),
            email: params.get('email')
        }         
    });
 </script>

<!-- this is inside a HTML box in unbounce -->

<!-- Calendly inline widget begin -->
<div class="calendly-inline-widget" id="my-calendly-embed" data-url="https://calendly.com/d/dns-sg1-kc3/try-demo?hide_event_type_details=1&hide_gdpr_banner=1&email=email&name=first_name" style="min-width:320px;height:830px;"></div>
<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js" async></script>
<!-- Calendly inline widget end -->

​

我把Calendly not defined放在控制台上

谢谢你的帮助！

Answer 1

这很可能是因为内联script标记中的代码是在Calendly的脚本(https://assets.calendly.com/assets/external/widget.js)初始化之前执行的。

尝尝这个

<!-- this is inside a HTML box in unbounce -->

<!-- Calendly inline widget begin -->
<div id="my-calendly-embed" style="min-width:320px;height:830px;"></div>
<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js"></script>
<!-- Calendly inline widget end -->

<script>
    const params = (new  URL(window.location)).searchParams

    Calendly.initInlineWidget({
        url: 'https://calendly.com/d/dns-sg1-kc3/try-demo?hide_event_type_details=1&hide_gdpr_banner=1',
        parentElement: document.getElementById('my-calendly-embed"'),
        prefill: {
            name: params.get('first_name'),
            email: params.get('email')
        }         
    });
 </script>

您的示例中的主要更改：

• 从托管小部件的div中删除了class="calendly-inline-widget"和data-url。这些属性用于自动初始化，但相反，我们是通过Calendly.initInlineWidget()在
• 下面的脚本块中手动初始化小部件，从加载widget.js的脚本中删除了async属性。这将确保Calendly的脚本在自定义script
• Placed之前加载自定义init脚本，然后将widget.js
• Added缺失的parentElement属性加载到initInlineWidget()调用中。它应该指向小部件的容器.