首页 > 解决方案 > jQuery 将选定值从一种形式应用到另一种形式

问题描述

我正在尝试使用 jQuery 将多列表表单中的选定值传递到 HubSpot 表单中。我构建的表单如下所示:

区域,未通过,而是多列表表单的第一部分。

<div class="form-group">
 <label for="region">Global Region</label>
  <select class="form-control" name="region" id="region">
    <option value="">Please choose a region</option>
    <option value="North America">North America</option>
    <option value="Africa">Africa</option>
    <option value="Asia">Asia</option>
    <option value="Carribean">Carribean</option>
    <option value="Central America">Central America</option>
    <option value="Europe">Europe</option>
    <option value="Middle East">Middle East</option>
    <option value="Oceania">Oceania</option>
    <option value="South America">South America</option>
</select>
</div>

国家,需要通过。仅包括此处的北美部分:

<div class="form-group country-north-america hidden">
 <label for="country-north-america">Country</label>
    <select class="form-control" name="country" id="country-north-america">
        <option value="">Please select a country</option>
        <option value="CA">Canada</option>
        <option value="PM">St. Pierre and Miquelon</option>
        <option value="US">United States</option>
        <option value="Virgin Islands (non-U.S.)">Virgin Islands (non-U.S.)</option>
    </select>
    </div>

然后美国的州是另一个层次。

所以我一直在尝试将值从国家传递到 HubSpot 表单以减少输入重复。我已经更新了所有值以实际匹配 HubSpot 的值。因此美国的期权价值是 US 以匹配 HubSpot 的期权价值。

我有以下似乎不起作用,我无法弄清楚需要发生什么:

var country = $('select[name="country"] option:selected').val()
$(window).load(function(){
 $('select[name="country"]').val(country).change();
});

我也尝试过使用 HubSpot 的 onFormReady 来获得类似的结果。

hbspt.forms.create({
    portalId: "123",
    formId: "321-123",
    onFormReady($form){
       $('select[name="country"]', $form).val($(country).change());
       $('select[name="state"]', $form).val(state).change(); 
       $('input[name="email"]', $form).val('test@foobar.com').change();
    });

如何使用 jQuery 将国家从一种形式传递到另一种形式?

编辑:我也试过做:

var country = $('select#country-africa option:checked').val() - Nothing
var country = $('select#country-africa').val('') - I get jQuery.fn.init [select#country-africa.form-control, prevObject: jQuery.fn.init(1), context: document, selector: "select#country-africa"]

附加编辑:

如果我使用以下变量,我将获得与正在记录但未应用更改的区域相关的国家/地区的完整列表。

var country = $('select#country-africa').text()

尝试了以下方法:

 var country = $('select#country-africa option:checked').val() 
 $(document).ready(function(){ $('select[name="country"]').val(country).trigger('change'); }) 

没用。在我的 onFormReady 中尝试了以下操作:

$('select[name="country"]').val('select#country-africa').prop("selected", true).trigger('change');

没用。

标签: jquery

解决方案


不得不做类似的事情:

$(document).ready(function(){
 $('.country').on('change', function(e){
    $('select.hs-input[name="country"]').val(e.target.value).trigger('change');
    })
})

推荐阅读