Здравствуйте!
Пишу для своего профильного форума конструктор, который будет генерировать сниппеты.
Конструктор собирает данные у пользователя, упрощая ему постановку вопроса и значительно экономя время.
Через position:sticky выводится макет с предпросмотром получаемых данных - макет чем то похож на карточку товара (изображение, размеры и др. нужные данные).
С предпросмотром у меня проблем нет - через обработчики событий он у меня работает как надо.
У меня проблема с генерацией сниппета. Я не знаю как в него получать данные из обработчиков.
Внизу HTML-кода есть input id="snipCode" - это поле вывода сгенерированного сниппета.
Я код максимально укоротил, чтобы огромнейшую портянку не вставлять, а макет даю чтобы донести суть своего вопроса.
<div class="constructor">
<div>
<h3>Название:</h3>
<input type="text" class="nameSnip" id="nameSnip" placeholder="Введите название проекта"><button class="btn-danger" id="nameDelete" title="Удалить название">X</button>
</div>
<div class="typeKr">
<h3>Тип крыши:</h3>
<div class="btn-group" data-toggle="buttons">
<label class="btn"><input type="radio" name="typeKr" value="1" checked>Односкатная</label>
<label class="btn"><input type="radio" name="typeKr" value="2">Двускатная</label>
<label class="btn"><input type="radio" name="typeKr" value="3">Шатровая</label>
</div>
</div>
<div class="uteplitel">
<h3>Утепление:</h3>
<div class="btn-group" data-toggle="buttons">
<label class="btn"><input type="radio" name="uteplitel" value="1" checked>Холодная крыша</label>
<label class="btn"><input type="radio" name="uteplitel" value="2">Тёплая крыша</label>
</div>
</div>
<div>
...
</div>
<!-- Снипет -->
<div class="snip">
<span>Код для вставки:</span>
<input id="snipCode" type="text" class="" placeholder="Код для вставки на форум" value="">
</div>
</div>
В общем идёт сбор данных через радио-кнопки, инпуты и селекты.
В скрипте у меня получилось написать обработчики, которые дают результат в предпросмотр.
А вот
как получить данные из обработчиков в новые переменные я не могу найти решения.
Вот часть скрипта, где нужно результат из
$('.name').keyup(function() получить в переменную
nameSnip
чтобы при изменении данных эти изменения происходили не только в макете предпросмотра, но и в коде сниппета
$(function() {
var name = $('.nameSnip'); //Название
$('.nameSnip').keyup(function() {
$("#prosmotpName").text($(this).val());
});
$('#snipCode').click( function(){ //Выделение кода сниппета при клике в поле
this.select()
});
//Код cниппета
var nameSnip;
var snipCode = '[snip ' + nameSnip + typeKr + sizeA + sizeB + ' snip]';
$("#snipCode").val(snipCode);//Вывод сниппета
});
