Блог

Главная - Вопросы по программированию - Как изменить значение поля формы Contact 7 в зависимости от другого значения поля с помощью javascript

Как изменить значение поля формы Contact 7 в зависимости от другого значения поля с помощью javascript

#javascript #contact-form-7 #contact-form

#javascript #contact-form-7 #contact-form

Вопрос:

Я хотел бы потребовать от пользователя ввести свой веб-сайт, если пользователь выбирает в раскрывающемся списке что-либо еще, кроме профиля посетителя.

Значение поля Url по умолчанию пустое. Если в раскрывающемся списке профиля пользователя выбрано значение «Посетитель», слушатель устанавливает для поля url значение «https://example.com » else url имеет значение пустой, чтобы потребовать от пользователя ввода URL-адреса перед отправкой формы.

Пожалуйста, помогите с приведенным ниже кодом:

  1. Независимо от выбранного профиля пользователя, в функции прослушивателя всегда по умолчанию используется значение «не-посетитель».
  2. Если пользователь выбирает not-Visitor, я проверил, чтобы установить URL на некоторый фиктивный https, но значение поля url не меняется, что означает, что мой код также не может установить URL на определенное значение.

К вашему сведению — вы заметите использование [group] для скрытия / отображения поля ввода Url в соответствии с условными полями Contact Form 7, которые косметически скрываются / отображаются.

Спасибо за вашу помощь

[РЕДАКТИРОВАТЬ] — рабочий код ниже. В итоге я удалил и использовал id: для назначения и использования переменных.

Форма контакта 7 -> Код вкладки формы:

 <div class="wpcf7-inline-wrapper">
<p class="wpcf7-inline-field">[text* your-firstname watermark "First Name"]</p>
<p class="wpcf7-inline-field">[text* your-lastname placeholder "Last Name"]</p>
</div>

<div class="wpcf7-inline-wrapper">
<p class="wpcf7-inline-field">[email* your-email "Email"] </p>
</div>

<div class="wpcf7-inline-wrapper">
<p class="wpcf7-inline-field">
<label id="dropDownProfile">
[select* your-profile id:dropDownProfile first_as_label "-- Choose Profile Type --" "Visitor" "Engineer"]
</label>
</p></div>

[group PortfolioWebsite]
<p class="wpcf7-inline-field">[url* your-url id:userWebsite] </p>
[/group]

<p>[textarea your-message "Message"] </p>

[submit class:btn class:btn-accent "Contact"]

<script>
document.getElementById("dropDownProfile").addEventListener("change", displayUrl);
function displayUrl() 
{
var currProfile=document.getElementById("dropDownProfile").value;
console.log(currProfile);
if (currProfile == "Visitor") 
    {
        document.getElementById("userWebsite").value = "https://dummyplaceholder.com";
} 
else 
    {
        console.log("at Exhibt");
        document.getElementById("userWebsite").value = "";
    }
}
</script>

Комментарии:

1. ваш код содержит множество очевидных ошибок, что наводит меня на мысль, что вы просто скопировали и вставили большую его часть и на самом деле не понимаете javascript DOM. прежде всего, вам необходимо использовать тот же идентификатор в коде формы, что и в том, что вы используете document.getElementById . во-вторых, это просто element.value , не element.display.value

Ответ №1:

К вашему сведению, я нашел эту ссылку хорошей отправной точкой https://www.codecanal.com/conditionally-display-fields-in-contact-form-7-with-simple-javascript /

в итоге не использовалось для назначения / использования переменных, вместо этого используйте id: назначение у слушателя с getElementById(«hereTheID»).значение

Рабочий код отредактирован в вопросе

приветствия