Настройка раскрывающегося по умолчанию с помощью JavaScript не работает

Question

Я пытаюсь установить два раскрывающихся списка в нашей форме Freshdesk на определенное значение автоматически. У меня есть один раскрывающийся список для поведения, но использование того же кода не влияет на второй раскрывающийся список (значения были изменены, а не буквально тот же код.

Рабочий Раскрывающийся

<select class="  dropdown_blank" id="helpdesk_ticket_product_id" name="helpdesk_ticket[product_id]"><option value="">...</option>
<option value="36000002397">Stack Overflow Community</option>
<option value="36000001553">Stack Overflow for Teams</option>
<option value="36000002396">Stack Overflow Talent</option></select>
</div> 

document.getElementById('helpdesk_ticket_product_id').value=36000002396;

Нерабочий выпадающий

<select class=" required nested_field" id="helpdesk_ticket_custom_field_cf_department_856620" name="helpdesk_ticket[custom_field][cf_department_856620]"><option value="">...</option>
<option value="Talent">Talent</option>
<option value="Teams">Teams</option>
<option value="N/A">N/A</option></select><div class="level_2"><label class="required">Category</label><select class=" required nested_field" id="helpdesk_ticket_custom_field_cf_category_856620" name="helpdesk_ticket[custom_field][cf_category_856620]"><option value="">...</option>
</select></div>

document.getElementById('helpdesk_ticket_custom_field_cf_department_856620').value=Talent;

Есть ли что-то еще, что мне нужно сделать, потому что второй раскрывающийся список вложен? Я хочу указать только первое раскрывающееся меню, но требую, чтобы пользователи сами выбирали второе вложенное поле.

На случай, если это поможет, я добавил весь раздел скриптов:

<script type='text/javascript'>

    var getParameterByName = talent

    var talent = ['helpdesk_ticket_custom_field_cf_teams_url_856620']

    if(getParameterByName= 'talent'){
        talent.map(function(field_id){
          jQuery('#'+field_id).parents('.control-group').remove();
        })
     }

     document.getElementById('helpdesk_ticket_product_id').value=36000002396;

     document.getElementById('helpdesk_ticket_custom_field_cf_department_856620').value=Talent;

</script>

Функция выше document.getElementById представляет собой скрипт для скрытия определенных полей.

HTML источник:

<div class="page">


    <!-- Search and page links for the page -->


    <!-- Notification Messages -->
     <div class="alert alert-with-close notice" id="noticeajax" style="display:none;"></div> 


    <div class="c-wrapper">     
        <div class="new_ticket_page">
        <section class="content main rounded-6 fc-new-ticket">
    <h3 class="heading">Submit a ticket</h3>
    <form accept-charset="UTF-8" action="/support/tickets" class="form-portal ticket-form" enctype="multipart/form-data" id="new_helpdesk_ticket" method="post" rel="validate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="authenticity_token" type="hidden" value="3xOZ+O420PsIskGZYjEEpcyo8pJDgvtEaAVR5YCqsF0=" /></div>


      <div class="control-group " >
         <label class=" required control-label requester-label " for="helpdesk_ticket_email">Requester</label>
            <div class="controls   ">
              <div class="row-fluid">
    <input class="span12 email required" data-check-email-path="/support/tickets/check_email" data-remote-triggers="focusout" data-remote="true" id="helpdesk_ticket_email" name="helpdesk_ticket[email]" placeholder="Email" size="30" type="email" value="" />

    <div id="name_field" class="default_name_field hide">
        <input class="text span12 name_field" placeholder="Your Name" 
            name="helpdesk_ticket[name]" type="text" disabled="disabled" />
    </div>

</div>


            </div> 
      </div>
      <div class="control-group " >
         <label class=" required control-label subject-label " for="helpdesk_ticket_subject">Subject</label>
            <div class="controls   ">
              <input class=" required text span12" id="helpdesk_ticket_subject" name="helpdesk_ticket[subject]" size="30" type="text" />
            </div> 
      </div>
      <div class="control-group " >
         <label class="  control-label product-label " for="helpdesk_ticket_product">Product</label>
            <div class="controls   ">
              <select class="  dropdown_blank" id="helpdesk_ticket_product_id" name="helpdesk_ticket[product_id]"><option value="">...</option>
<option value="36000002397">Stack Overflow Community</option>
<option value="36000001553">Stack Overflow for Teams</option>
<option value="36000002396">Stack Overflow Talent</option></select>
            </div> 
      </div>
      <div class="control-group " >
         <label class=" required control-label cf_department_856620-label " for="helpdesk_ticket_cf_department_856620">Product Categories</label>
            <div class="controls nested_field  ">
              <select class=" required nested_field" id="helpdesk_ticket_custom_field_cf_department_856620" name="helpdesk_ticket[custom_field][cf_department_856620]"><option value="">...</option>
<option value="Talent">Talent</option>
<option value="Teams">Teams</option>
<option value="N/A">N/A</option></select><div class="level_2"><label class="required">Category</label><select class=" required nested_field" id="helpdesk_ticket_custom_field_cf_category_856620" name="helpdesk_ticket[custom_field][cf_category_856620]"><option value="">...</option>
</select></div><script type="text/javascript">
//<![CDATA[
jQuery('#helpdesk_ticket_custom_field_cf_department_856620').nested_select_tag({"data_tree":[["Talent","Talent",[["API &amp; Integrations","API &amp; Integrations",[]],["Banner Ads","Banner Ads",[]],["Candidate Search","Candidate Search",[]],["Company Page Ads","Company Page Ads",[]],["Company Pages","Company Pages",[]],["Control Panel","Control Panel",[]],["Dashboard","Dashboard",[]],["Job Listing","Job Listing",[]],["N/A","N/A",[]],["Recommended Candidates","Recommended Candidates",[]],["User &amp; Team Accounts","User &amp; Team Accounts",[]]]],["Teams","Teams",[["Administration","Administration",[]],["Billing","Billing",[]],["Technical","Technical",[]],["Usage","Usage",[]]]],["N/A","N/A",[["N/A","N/A",[]]]]],"initValues":null,"disable_children":false,"include_blank":"...","selected":null,"pl_value_id":null,"subcategory_id":"helpdesk_ticket_custom_field_cf_category_856620"});
//]]>
</script>
            </div> 
      </div>
      <div class="control-group " >
         <label class=" required control-label cf_customer_account_856620-label " for="helpdesk_ticket_cf_customer_account_856620">Control Panel, Salesforce, or Talent link.</label>
            <div class="controls   ">
              <input class=" required text span12" id="helpdesk_ticket_custom_field_cf_customer_account_856620" name="helpdesk_ticket[custom_field][cf_customer_account_856620]" size="30" type="text" />
            </div> 
      </div>
      <div class="control-group " >
         <label class=" required control-label cf_teams_url_856620-label " for="helpdesk_ticket_cf_teams_url_856620">Teams URL</label>
            <div class="controls   ">
              <input class=" required text span12" id="helpdesk_ticket_custom_field_cf_teams_url_856620" name="helpdesk_ticket[custom_field][cf_teams_url_856620]" size="30" type="text" />
            </div> 
      </div>
      <div class="control-group " >
         <label class=" required control-label description-label " for="helpdesk_ticket_description">Description</label>
            <div class="controls   ">
               <textarea class=" required_redactor html_paragraph span12" cols="40" id="helpdesk_ticket_ticket_body_attributes_description_html" name="helpdesk_ticket[ticket_body_attributes][description_html]" rows="6">
</textarea>  <div class="single_file">
<div class="attach-wrapper row-fluid new-attach" id="attachment-type" data-multifile-enable="true" data-location="portal">
  <div class="attachments-list-wrap">
    <div class="attachments-list-form" id="ticket-container">

      <div class="attachment_contents">
        <div id="ticket-attachments" class="attachments-wrap shared_attachment_list">



        </div>
      </div>
    </div>

Answer 1

Поскольку ваше значение ("Талант") - это строка, которую вы должны использовать

document.getElementById('helpdesk_ticket_custom_field_cf_department_856620').value='Talent';

Другой подход:

document.getElementById('helpdesk_ticket_custom_field_cf_department_856620').querySelector('option[value="Talent"]').selected = true;

Редактировать:

В вашем коде есть еще несколько проблем. Так должно быть:

<script type='text/javascript'>

    var getParameterByName = 'talent';

    var talent = ['helpdesk_ticket_custom_field_cf_teams_url_856620'];

    if(getParameterByName === 'talent'){
        talent.map(function(field_id){
          jQuery('#'+field_id).parents('.control-group').remove();
        });
     }

     document.getElementById('helpdesk_ticket_product_id').value='36000002396';

     document.getElementById('helpdesk_ticket_custom_field_cf_department_856620').value='Talent';

</script>

В строке 3 вы пропустили (одинарные) кавычки.

В строке 7 правильным оператором является "==" или "===" (см. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)

В строке 15 вы также пропустили одинарные кавычки (на самом деле их также следует использовать в строке 13, поскольку значения s всегда являются строками).