Последние темы


как передать значения радиокнопок из формы на странице в модальное окно fancybox2?

  • Не могу сообразить как передать значения радиокнопок из формы на странице в модальное окно fancybox2

  • У Вас окно вызывается iframe или inline?

  • iframe

  • @ufabooks То есть у Вас в action формы прописан адрес целевой страницы, на которую нужно передать значения?
    Тогда там просто сниппетом вытащите:

    return $_REQUEST['fieldname'];
    

    Или у Вас сама форма открывается в модальном окне по ссылке? Тогда прямо у ссылки укажите параметр:

    <a href="[[~123? &fieldname=`***`]]">...</a>
    

    А на странице с формой выводите снова через тот же сниппет, или, если стоит pdoTools, то тегом:

    [[!#REQUEST.fieldname]]
    
  • Мы готовы попробовать оба варианта:
    http://testfactura.ffactura.ru/collection/type-in-rect.html

    Сделали 2 кнопки Заказать:

    <a href="[[~15]]?mod=[[*pagetitle]]&mod2=[[*id]]" class='various' 
    data-fancybox-type="iframe"><button class='button silver large ' 
     >Заказать</button></a>
    <button class='button silver large various' data-fancybox-type="iframe" 
    data-fancybox-href="[[~15]]">Заказать</button>```
    
    1) Заказать (верхняя) является ссылкой.
    Как тут с помощью ссылки передать значение формы на страницу в action?
    
    2) Заказать (нижняя) является обычной кнопкой с data-fancybox-href.
    Т.е. в action значение формы не передаётся. Передаётся просто html код 
    этой страницы, а не значения.
    
    
    собственно надо передать выбор варианта расцветки со страницы в модальное окно
    и чтобы в нем селект с номерами этих расцветок установился в нужное значение
  • В Вашем случае удобнее инлайн.

    <a href="#form" class="various" ><button class='button silver large ' 
     >Заказать</button></a>
     
     <div style="display:none">
         <div id="form">
             <form>
                  <input type="hidden" name="mod" value="[[*pagetitle]]"/>
                  <input type="hidden" name="mod2" value="[[*id]]"/>
                  <input type="hidden" name="field" value="" id="field"/>
                  ..............................
             </form>
         </div>
     </div>
    

    ну и скрипт:

    <script>
    $(document).ready(function(){ 
       $(".pro_val_one").change(function(){
           $("#field").val($(this).val());
       });
    });
    </script>
    
  • @ufabooks 1) Это дополнительный <form> к основному?
    И зачем она display:none если итак содержит скрытые input?

    1. Что за значение pro_val_on ? Это связь с нашей радиокнопкой?

    Может вы напишите общий код формы и отдельно код страницы в модальном окне?

  • Вместо многоточия — код Вашей формы заявки. Отдельной страницы не нужно — все на странице товара.
    display:none — скрытие блока с этой формой. Она откроется по клику на ссылке с классом various или какой назначите (см. документацию fancybox).

    Скрытые поля mod и mod2 — это Ваши поля в форме, которые автоматом заполняются заголовком страницы и ее ID (у Вас сейчас они передаются в GET-запросе на отдельную страницу с формой). А поле field заполняется как раз при выборе той или иной радиокнопки.
    За это отвечает скрипт, который при изменении элемента с классом pro_val_on (это и есть Ваши радиокнопки) берёт его значение и прописывает в поле field отправляемой формы заявки.

  • Мы собираем данные из формы:

    <form action="[[~[[*id]]]]" method="post" class="form">
    
    <input type="hidden" name="mod" value="[[*pagetitle]]" />
    <input type="hidden" name="mod2" value="[[*id]]" />
    <input type="hidden" name="field" value="" id="field"/>
    
    .....
    
    </form>
    

    В модальном окне в коде этой же страницы делаю новую форму:

    <form action="[[~[[*id]]]]" method="post" class="rf" id="contactFormHeader">```
    
    .....
    
    в ней вызываю снипет:
    
    [[!getOption]]
    
    с содержимым:
    
    

    echo $a=$_POST['fact'];
    echo $b=$_POST['field'];```

    • обе переменные пустые.
      Что не так?

    ...

    </form>

    Если все делать без модальных окон и без js то все прекрасно передаётся.

  • Не надо ничего никуда собирать и передавать.
    У Вас на странице самого товара уже будет форма заявки. То есть вот эту форму просто вставьте на страницу товара в любом месте в блок с ID="form" и скройте все этим самым display:none:

     <div style="display:none">
         <div id="form">
             <form>
                Тут код Вашей формы заявки
             </form>
         </div>
     </div>
    

    Метод Fancybox inline и подразумевает то, что в модальное окно выводится контент, который находится на этой же странице ). Он найдет блок с id="form" (ведь он прописан в href у ссылки) и откроет его содержимое в модальном окне - то есть Вашу форму заявки.

    А то, что передавалось у Вас GET-запросом на отдельную страницу (которая открывалась в модальном окне), уже не нужно — форма заявки-то теперь находится на самой странице товара и можно все прописать напрямую:

    <input type="hidden" name="mod" value="[[*pagetitle]]"/>
    <input type="hidden" name="mod2" value="[[*id]]"/>
    <input type="hidden" name="field" value="" id="field"/>
    ..............................
    

    И Вам нужно только вытащить какую радиокнопку нажал посетитель, а это делает JS-скрипт. Результат своей работы он вписывает в третье скрытое поле Вашей формы — field. Соответственно, в шаблоне письма так и прописывайте:

    Вариант расцветки: [[+field]]
    
  • Погоди. ты не совсем понял. надо чтобы при выборе варианта расцветки на странице товара (там по номерам они) - при открытии окна чтобы в селекте с расцветками номер устанавливался на выбранное ранее значение.
    То есть выбрал на странице товара номер 2 - открыл окно - и там уже в селекте светится опция номер 2.
    а сейчас этого не происходит.
    не коррелируется выбор на странице и в селекте модального окна

  • Сейчас то, что выбрано из радиокнопок прописывается в поле field именно модального окна (форма заявки у Вас там).
    И оно работает: alt text
    Если нужно просто вывести, то сделайте в форме блок:

    <p>Расцветка: <span class="color">1</span></p>
    

    И измените скрипт:

    <script>
    $(document).ready(function(){ 
       $(".pro_val_one").change(function(){
           $("#field, .color").val($(this).val());
       });
    });
    </script>
    

    Кстати, поскольку у Вас по умолчанию стоит выбранный первый пункт, в форме у поля пропишите сразу так:

    <input type="hidden" name="field" value="1" id="field"/>
    

    Если человек ничего не выберет, то везде будет стоять 1 (она уже выбрана).

  • Сорри, в скрипте ошибся:

    <script>
    $(document).ready(function(){ 
       $(".pro_val_one").change(function(){
           $("#field").val($(this).val());
           $(".color").html($(this).val());
       });
    });
    </script>
    
  • Опять мы не поняли друг друга) выбранное поле рацветки field передается в окно - да
    но мне же нужно не просто текстом там его вывести
    в окне есть селект который дублирует выбор расцветки на странице
    вот этот

     <select style="color:#000" id="numb" name="numb" value="[[!+fi.numb]]">
      [[getImageList? &tvname=`clr`  &tpl=`urlTplForm` &docid=`[[*id]]` ]]
    
     </select>
    
    вот мне нужно чтобы при открытии окна выбранная строка этого селекта соответствовала значению этого поля field 
    выбираю чекбоксом на странице расцветку 3 - открываю окно - и там в селекте сразу стоит строка N3 
    а сейчас всегда первая
  • А для чего Вам в окне еще раз повторять то, что человек уже сделал? Он же уже выбрал расцветку — просто выведите эту информацию тут не селектом, а span-ом, как я описал ранее:
    alt text

    Но если так уж нужно в окне выбирать, то попробуйте сделать так:

    <script>
    $(document).ready(function(){ 
       $(".pro_val_one").change(function(){
           var num = $(this).val();
           $("#field").val(num);
           $(".color").html(num);
           $("#numb option").each(function(){
                if($(this).val() == num) {
                    $(this).attr("selected", "selected");
                    
                }
            });
       });
    });
    </script>```
  • да вот такая задача) чтобы еще и в окне можно было бы изменить ранее сделанный выбор

    так тоже не срабатывает
    точнее при открытии окна нужная опция не выбрана в селекте
    но стоит нажать на селект - как тут же выбирается сама при клике

  • Да нет, скрипт как раз работает:
    alt text
    Вот тестик: http://rpa-design.ru/t.html
    Добавил там одну строчку:

    <script>
    $(document).ready(function(){ 
       $(".pro_val_one").change(function(){
           var num = $(this).val();
           $("#field").val(num);
           $(".color").html(num);
           $("#numb option").each(function(){
                if($(this).val() == num) {
                    $("#numb option").removeAttr("selected");
                    $(this).attr("selected", "selected");
                }
            });
       });
    });
    </script>
    
  • на тесте в пределах одной страницы работает да
    а в модальном окне не отрисовывается

  • Fancybox лень ставить - с Сolorbox (практически то же самое) все прекрасно работает: http://rpa-design.ru/t.html

  • У Вас из-за оформления селекта показывает не то, что нужно. Стоит скрипт, который скрывает сам селект (ставит ему прозрачность), а поверх накладывает SPAN, где прописан первый пункт:
    alt text
    Тут уж или оформление делать иначе, или копаться в скрипте-украшателе.

 

Последние комментарии

  • Z

    Спасибо, действительно проще создать отдельно.

    Читать далее
  • Но проблема в том, что эта старая цена "дублируется" в плесхолдер "Дополнительных услуг" - [[+addit_data]].

    Можно не использовать [[+addit_data]], а выводить параметры по-отдельности.

    Цитата из документации:

    [[+shk_любой доп.параметр]] - любой доп. параметр, выбранный при добавлении товара в корзину (из [[+addit_data]]), например [[+shk_param1]].
    Если параметры сделаны в виде чекбоксов, то чтобы вывести отдельно каждый из них, нужно добавлять индекс (номер от нуля) для параметров следующих за первым.
    Пример: [[+shk_param1]], [[+shk_param1_1]], [[+shk_param1_2]] ...
    [[+shk_любой доп.параметр_price]] - цена доп.параметра. Пример: [[+shk_param1_price]].

    Читать далее
  • Z

    Доброго времени суток. Не могу разобраться, как передать данные migx-поля в корзину в плейсхолдер без "дублирования" в [[+addit_data]]
    Суть в чем: У меня есть 2 цены у товара (со скидкой и без скидки) Форма для отправки в корзину:

    <form action="[[~[[*resource_id]]? &scheme=`abs`]][[*alias]].html" method="post"> <input type="hidden" name="shk-id" value="[[*id]]" /> <input type="hidden" name="shk-name" value="[[*pagetitle]]" /> <input type="hidden" name="price_old__[[*id]]__add" value="[[*price_old]]" /> <input type="hidden" name="shk-count" value="1" /> <div class="product-price"> Цена: <span class="shk-price">[[!*price:shk_curr_rate:num_format]]</span> Старая цена - <span class="shk-price-old">[[+price_old]]</span> [[!+shk_currency]] </div> <div class="padding-lr-30"> <h5>Дополнительные услуги</h5> [[*param1]] </div> <div class="product-price"> <button class="btn btn-lg btn-primary" type="submit" class="shk-but">В корзину</button> </div> </form>

    Данные со "старой ценой" в корзину попадают нормально и выводится в нужном месте в плейсхолдере:
    [[+shk_price_old]]
    Но проблема в том, что эта старая цена "дублируется" в плесхолдер "Дополнительных услуг" - [[+addit_data]]. Как сделать чтобы старая цена не выводилась в [[+addit_data]]? Или может я как то не правильно передаю MIGX-параметр в корзину ? Заранее спасибо.

    Читать далее
  • Фотографии, как я понял, это второй вопрос. Я по нему пока ничего не отвечал и не просил информации. Это не отменяет того, что в вашем конфиге есть ошибка, о которой я писал выше. Не нужно задавать разные вопросы в одной теме, чтобы не было путаницы.
    http://forum.modx-shopkeeper.ru/topic/15/рекомендации-по-оформлению-темы-с-вопросом

    Читать далее