Wordpress Contact Form 7 动态 select 下拉字段基于 url

Question

我有以下案例。我有 Contact Form 7 插件和几个提供不同服务的页面。每个页面都有一个联系表，边栏中的 select 下拉菜单包含所有服务。当您在特定服务中时，我如何实现这一点，下拉字段默认根据服务自动 selected（可能由 URL 编辑）？我没有找到这样的话题，我对这是如何发生的很感兴趣。最好不用插件。提前致谢:)

Answer 1

假设您有 3 个服务，服务 A、服务 B、服务 C，这样如果您在属于服务 B 的页面中，URL domain.com/service-b/my-page，换句话说, URL 本身有足够的信息来识别此页面是服务 B 的一部分。有两种方法可以继续实现下拉列表中的自动 selection,

1 在 client-side 上，在页面加载后使用 JavaScript，

使用以下脚本select正确的选项，

(function($){
$(document).ready(function(){
  //determine the current page,
  let page = window.location.href, opt='';
  //comment the following line for your site, this is only for this example test.
  page = 'http://example.com/service-b/my-page';

  switch(true){
    case page.indexOf('service-b')>0:
      opt='serviceb';
      break;
    case page.indexOf('service-c')>0:
      opt='servicec';
      break;
    case page.indexOf('service-a')>0:
      opt='servicea';
      break;
  }

  $('select[name="select-services"]').find('option[value="'+opt+'"]').prop('selected', 'selected');
})
})(jQuery)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="select-services">
 <option value="">select a service</option>
 <option value="servicea">Service A</option>
 <option value="serviceb">Service B</option>
 <option value="servicec">Service C</option>
</select>

2 另一种方法是在页面加载之前修改服务器端的 select 选项，使用 php 并挂钩过滤器 'do_shortcode_tag' 一旦 cf7 表单简码具有被执行了。将以下代码放入您的主题 functions.php 文件中，

add_filter('do_shortcode_tag','set_service',10,3);
function set_service($html, $attr, $tag){
  //check this is a cf7 shortcode.
  if('contact-form-7' !== $tag){
    return $output;
  }
  //if you have several forms, you can also check this is the right form using $attr['id']
  //determine which page you are on
  global $wp;
  $serv='';
  switch(true){
    case false !== strpos($wp->request, 'service-a' ):
      $serv='servicea';
      break;
      case false !== strpos($wp->request, 'service-b' ):
      $serv='serviceb';
      break;
    case false !== strpos($wp->request, 'service-c' ):
      $serv='servicec';
      break;
  }
  return str_replace('value="'.$serv.'"', 'value="'.$serv.'" selected="selected"', $html);
}

Answer 2

你可以试试 wp filter hook :

add_filter( 'do_shortcode_tag','sercice_check',10,3);

function sercice_check($output, $tag, $attr){

// Checking your contact form id
// [contact-form-7 id="659" title="My Service"]

  if(  isset( $attr['id'] ) &&  $attr['id'] == 659 ){ //you can even check for specific attributes
    global $wp;

    $service='';

    // Site url like : www.mysite.com/service/service-a/
    switch(true){

        case false !== strpos($wp->request, 'service-a' ):
            $service='Service A';
        break;

        case false !== strpos($wp->request, 'service-a' ):
            $service='Service B';
        break;
    }

    return str_replace('value="'.$service.'"', 'value="'.$service.'" selected="selected"', $output);
  }

  return $output;
}

Wordpress Contact Form 7 动态 select 下拉字段基于 url

Wordpress Contact Form 7 dynamically select dropdown field based on url

wordpress

contact-form-7