У меня нет доступа к массиву, но нужно убрать запятые

Question

Так что это немного неясный.

Я использую Formidable Forms Pro на Wordpress, чтобы сделать довольно сложную форму. Я использую поле Dynami c (выбор которого происходит из записей из другой формы, следовательно, Dynami c), где пользователи могут сделать несколько выборок. Затем я использую поле списка Dynami c, чтобы показать пользователям более наглядный выбор.

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

Стиль введен в действие, потому что я скрываю запятые, вставляемые динамически с помощью Formidable Forms. В этом и заключается проблема.

Этот подход будет работать нормально, если бы я хотел, чтобы список появлялся один над другим, но, ожидая, что в некоторых случаях пользователи захотят сделать 10 или более выборов, список запустится. занять слишком большую часть экрана.

Теперь есть множество примеров того, как удалить разделители из строк и массивов (я считаю, что это массив строк), но у меня нет доступа либо сделать переменную, чтобы это продолжалось. Оставив все как есть, я не могу использовать CSS Grid для стилизации списка, так как я надеюсь использовать повторяющийся метод автоподбора, чтобы выровнять их все рядом, когда есть достаточно места, так как запятые считаются дочерними элемента сетки, например элементов списка.

Проверка кода показывает, что нет никаких элементов html, заключающих запятые, поэтому нет надежды использовать Javascript для удаления запятых внутри класса или чего-либо еще.

Если бы кто-нибудь, кто знает, как направить меня в правильном направлении, был бы признателен, то это было бы с благодарностью.

Поскольку я использую Грозные формы для создания форм единственный код, который я могу удалить для вас, - это вывод, который я предоставил на изображениях. Не идеально c, я знаю.

Ниже приведен единственный код предварительного рендеринга, к которому у меня есть доступ в Formidable. Хотя я подозреваю, что это никому не пригодится, поэтому я и не публиковал его изначально:

<div id="frm_field_[id]_container" class="frm_form_field form-field [required_class][error_class]">
<label for="field_[key]" id="field_[key]_label" class="frm_primary_label">[field_name]
    <span class="frm_required">[required_label]</span>
</label>
<div class="frm_opt_container" aria-labelledby="field_[key]_label" role="group">[input]</div>
[if description]<div class="frm_description" id="frm_desc_field_[key]">[description]</div>[/if description]
[if error]<div class="frm_error" id="frm_error_field_[key]">[error]</div>[/if error]

Ааа и обработанный код:

<div id="frm_field_70_container" class="frm_form_field form-field  frm_none_container frm_dynamic_data_container">
<label for="field_b0r85" id="field_b0r85_label" class="frm_primary_label">Dynamic
    <span class="frm_required"></span>
</label>
<div class="frm_opt_container" aria-labelledby="field_b0r85_label" role="group" style=""><p class="frm_show_it"></p><div class="combined_field_output"><img src="http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-29-150x150.jpg" alt="Image of exercise 5545" style="width:60px;height:60px"><h3>5545</h3><p>Abdominals</p></div>, <div class="combined_field_output"><img src="http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-13-150x150.jpg" alt="Image of exercise goo" style="width:60px;height:60px"><h3>goo</h3><p>Abdominals</p></div>, <div class="combined_field_output"><img src="http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-27-150x150.jpg" alt="Image of exercise should work" style="width:60px;height:60px"><h3>should work</h3><p>Abdominals</p></div>, <div class="combined_field_output"><img src="http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-14-150x150.jpg" alt="Image of exercise Walking Lunges" style="width:60px;height:60px"><h3>Walking Lunges</h3><p>Abdominals</p></div><p></p>

http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-29-150x150.jpg" alt = "Изображение упражнения 5545" style = "ширина: 60px; высота: 60px" />

5545

Брюшной пресс

, http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-13-150x150.jpg" alt = "Изображение упражнения goo "style =" width: 60px; высота: 60px "/>

goo

Abdominals

, http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-27-150x150.jpg" alt =" Образ упражнения должен работать "style =" ширина: 60px; высота : 60px "/>

должно работать

Брюшной пресс

, http://3.11.173.147.xip.io/wp-content/uploads/formidable/2/IMG-20190512-WA0005-14-150x150.jpg" alt =" Образ упражнения Walking Lunges "style =" ширина: 60px; высота: 60px "/>

Walking Выпады

Брюшной полости

">

Редактировать: Грозный предоставить способ Настроить динамическое c поле ссылки , в котором ничего не говорится о разделителе. Насколько я понимаю, если разделитель не указан, динамически добавляется запятая, что, как я думаю, происходит здесь. Можно ли отредактировать этот хук PHP, чтобы указать, что разделитель не будет добавил все?

Answer 1

Я не знаю, есть ли у вас доступ к javascript посту рендеринга. Если вы это сделаете, вы всегда можете использовать регулярные выражения, чтобы исправить свой внутренний HTML

var text = document.getElementsByClassName("frm_opt_container")[0].innerHTML;
var reg = new RegExp("(<div class=\"combined_field_output\">.*</div>[.\n\r]*)(,)");
while(reg.test(text)){
  text = text.replace(reg, "$1")
}
document.getElementsByClassName("frm_opt_container")[0].innerHTML = text