[英]auto populating contact 7 form with link to anchor on same page
我按照本教程动态自动填充使用联系表单7创建的表单。要自动填写表单,我正在使用插件Contact Form 7 Dynamic Text Extension 。
首先,我将以下函数附加到function.php
// chalet name for enquiry form
function parameter_queryvars( $qvars ) {
$qvars[] = 'chalet';
return $qvars;
}
add_filter('query_vars', 'parameter_queryvars' );
function echo_chalet() {
global $wp_query;
if (isset($wp_query->query_vars['chalet']))
{
print $wp_query->query_vars['chalet'];
}
}
联系人7表单具有主题的动态字段:
[dynamictext enquiry-chalet "CF7_GET key='chalet'"]
有了这个,我可以使用不同主题的相同表单,根据点击的链接自动填写。 该链接只需包含chalet的查询。
www.mysitexyz.com/link/to/page/with/form.php?chalet=request
www.mysitexyz.com/link/to/page/with/form.php?chalet=cancellation
表格的主题填写“请求”或“取消”。 这很好用。
该链接现在包含一个锚: www.mysitexyz.com/link/to/page/with/form.php?chalet=chaletname#myFormDownHere
单击该链接,页面将向下滚动到锚点。 我的wordpress主题顺利向下滚动。 但该字段不是自动填充的。 单击带有浏览器功能的页面可在新选项卡中打开。 然后页面向下滚动到锚点并正确填写表单字段。但这不是人们通常所做的。
如何通过正常点击链接获得相同的结果?
使用jQuery,您可以这样做:
<a href="#" data-chalet="YOUR-VALUE" class="chalet-choser">Click here</a>
接着
$('.chalet-choser').on('click', function(e) {
e.preventDefault();
$('input[name="enquiry-chalet"]').val( $(this).data('chalet') );
return false;
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.