Динамическое добавление скриптов при формировании формы?

Question

[vingud]

Есть конструктор формы, который должен по полученному айди формировать форму заказа услуги.
При формировании формы может динамически добавляться неограниченное количество полей.
Маска ввода для некоторых полей настраивается с помощью скрипта "inputmask.min.js".
Для полей с адресом используются подсказки DaData и подключается скрипт jquery.suggestions.min.js

логика работы следующая: порядок полей и характеристик полей для формы хранятся в бд. По айди получаем этот массив и в цикле формируем html-код и и js-скрипты.
вот для примера:

function getField_Address ($datafield) {	
		$html_text ='
			<div class="row">
				<div class = "col-xs-12 col-md-12">		
					<div class = "form-group required" >
						<label for="'.$datafield['prefix'].'_address" class="control-label">'.$datafield['label'].':</label>
						<input class="form-control" type="text" id="'.$datafield['prefix'].'_address"  name="'.$datafield['prefix'].'_address" placeholder="Введите адрес в свободном формате и выберите подходящий вариант из выпадающего списка" required="required">
					</div>
				</div>			
			</div>			
		';
		$html_js ='
	jQuery("#'.$datafield['prefix'].'_address").suggestions({
        token: "9efba7d511d6c286914ae785748767469a6727ae",
        type: "ADDRESS",
		hint: false,
        // Вызывается, когда пользователь выбирает одну из подсказок 
        onSelect: function(suggestion) {
            console.log(suggestion);
        }
    });		
		';
		return array($html_text, $html_js);	
	};

		$datafield_address = array('ff_type'=> 'address', 'name'=>'_Address', 'value'=>'', 'prefix'=>'realty_'.$datafield['prefix'], 'label'=>'Адрес объекта недвижимости:');
		$html_res = getField_Address($datafield_address);
		$html_text .= $html_res[0];	$html_js .= $html_res[1];

далее $html_text выводится где необходимо, а $html_js нужно вставить в самый низ после подключения всех скриптов и выполнения <?php wp_footer(); ?>. (Руками в своей тестовой странице убрал вызов <?php //get_footer(); ?> и прикрепил весь код из footer.php). И все вроде работает.
Но если вернуться к подвала из шаблона, то мои скрипты ссылающиеся на подключаемые внешние библиотеки вызывают ошибки. Если пропишу подключения скриптов руками до вызова "подвала" то все работает:

<script src="https://cdn.jsdelivr.net/npm/suggestions-jquery@21.12.0/dist/js/jquery.suggestions.min.js" ></script> 
<script type='text/javascript' src='http://gupski.ru/wp-content/themes/stav_kray/js/jquery.inputmask.min.js?ver=1.1' id='inputmask-js'></script>
<?php echo $html_js; ?>
<?php get_footer(); ?>

Сам самоучка-дилетант. И фундаментального понятия как правильно все это организовать нет. Сайт до меня сопровождался разными людьми и имеется определенная запутанность в подключении скриптов плагинов. Например в footer.php прописана функция $(document).ready(function() в которой приписываются все скрипты которые на сайте, и они загружаются на каждой странице, хотя нужны естественно далеко не везде. Поэтому был бы признателен, если кто-то направит в нужную сторону и подскажет как правильно организовать подключение скриптов в моем случае и вообще как правильно навести порядок.

Answer 1

[Артем Золин]

Из вашего текста не понятно в какой момент может быть вызвана функция getField_Address(), если это возможно на хуке wp_enqueue_scripts, то вы можете подключить ваш код с помощью wp_add_inline_script()

add_action( 'wp_enqueue_scripts', function(){

	wp_enqueue_script( 'my_scripts', get_stylesheet_directory_uri() .'/my_scripts.js' );

	$html_res = getField_Address($datafield_address);

	// добавим произвольный код
	wp_add_inline_script( 'my_scripts', $html_res[1] );
	
} );

Если возможности нет, то можете просто повесить скрипт на какой-то последний приоритет хука wp_footer

Answer 2

[vingud]

не понятно в какой момент может быть вызвана функция getField_Address()

есть цикл в котором формируются поля формы. В зависимости от типа поля вызывается соответствующая функция. getField_Address() одна из таких функций. Результаты выполнения функций аккумулируются в $html_text и $html_js. После прохождения цикла в первой переменной получаю текст формы, а во второй все тег в котором собраны все необходимые для работы формы скрипты.

К сожалению в вопросе использования хуков плаваю. Пытаюсь разобраться в данном вопросе..пока больше вопросов, чем ответов :)
1. хук wp_enqueue_scripts я могу вставить в своем шаблоне? (может глупый вопрос, но во всех мануалах он вставляется всегда в function.php... но вот подумалось, а почему я не могу подключить скрипт в шаблоне)
2. у меня все скрипты собираются на лету. В примере я так понял прикрепляется файл '/my_scripts.js', а потом к нему уже прикрепляется произвольный код