forms-modal.php 8.96 KB
<script>
    $(document).ready(function(){
        jQuery('.off_list').jScrollPane({
            showArrows:true,
            autoReinitialise: true,
            autoReinitialiseDelay:200,
            scrollbarWidth: 25,
            arrowSize: 25
        });

        $('.off_list').hide();
        $('.main_item, .arrow.up').click(function () {$('.off_list').toggle()});

        var listOffer = $('.list-form-offer li');
        var listOfferLength = listOffer.length;

        $(listOffer[listOfferLength-1]).addClass('act-offer-li');
        function activeOf(){
            var title1 = $('.act-offer-li').find('.title1').text();
            var title2 = $('.act-offer-li').find('.title2').text();

            $('.main_item .pr_title').empty().text(title1)
            $('.main_item span').empty().text(title2)
        }
        activeOf();

        listOffer.click(function(){
            var thisOfInd = $(this).index();
            var actOfInd = $('.act-offer-li').index();
            listOffer.removeClass('act-offer-li');
            $(this).addClass('act-offer-li');

            if(thisOfInd!=actOfInd) {
                activeOf();
                $('.off_list').hide();
            }
        })
        validationModal();
        function validationModal(){
            var jVal_off = {
                'offNsme' : function() {
                    var ele = $('#off_name');
                    if(ele.val().length < 2) {
                        jVal_off.errors = true;
                        ele.removeClass('normal').addClass('wrong');
                    } else {
                        ele.removeClass('wrong').addClass('normal');
                    }
                },

                'offComm' : function() {
                    var ele = $('#off_text');
                    if(ele.val().length < 6) {
                        jVal_off.errors = true;
                        ele.removeClass('normal').addClass('wrong');
                    } else {
                        ele.removeClass('wrong').addClass('normal');
                    }
                },

                'offPrice' : function() {
                    var ele = $('#off_price');
                    if(ele.val().length < 1) {
                        jVal_off.errors = true;
                        ele.removeClass('normal').addClass('wrong');
                    } else {
                        ele.removeClass('wrong').addClass('normal');
                    }
                },

                'offSendIt' : function (){
                    if(!jVal_off.errors) {
                        $('.question-project').submit();
                    }
                }
            };
// ====================================================== //
            $('#off_submit').click(function (){
                jVal_off.errors = false;
                jVal_off.offNsme();
                jVal_off.offComm();
                jVal_off.offPrice();
                jVal_off.offSendIt();
                return false;
            });

            $('#off_name').focusout(function(){
                jVal_off.offNsme();
            });
            $('#off_text').focusout(function(){
                jVal_off.offComm();
            });
            $('#off_price').focusout(function(){
                jVal_off.offPrice();
            });

            var jVal_qst = {
                'qstNsme' : function() {
                    var ele = $('#qst_name');
                    if(ele.val().length < 2) {
                        jVal_qst.errors = true;
                        ele.removeClass('normal').addClass('wrong');
                    } else {
                        ele.removeClass('wrong').addClass('normal');
                    }
                },
                'qstPhone' : function (){
                    var ele = $('#qst_phone');
                    var patt = /[0-9]/g;
                    if(!patt.test(ele.val())) {
                        jVal_qst.errors = true;
                        ele.removeClass('normal').addClass('wrong');
                    } else {
                        ele.removeClass('wrong').addClass('normal');
                    }
                },
                'qstComm' : function() {
                    var ele = $('#qst_text');
                    if(ele.val().length < 6) {
                        jVal_qst.errors = true;
                        ele.removeClass('normal').addClass('wrong');
                    } else {
                        ele.removeClass('wrong').addClass('normal');
                    }
                },
                'qstSendIt' : function (){
                    if(!jVal_qst.errors) {
                        $('.question-project').submit();
                    }
                }
            };
// ====================================================== //
            $('#qst_submit').click(function (){
                jVal_qst.errors = false;
                jVal_qst.qstNsme();
                jVal_qst.qstPhone();
                jVal_qst.qstComm();
                jVal_qst.qstSendIt();
                return false;
            });

            $('#qst_name').focusout(function(){
                jVal_qst.qstNsme();
            });
            $('#qst_phone').focusout(function(){
                jVal_qst.qstPhone();
            });
            $('#qst_text').focusout(function(){
                jVal_qst.qstComm();
            });
        }
    })
</script>

<div id="modal_form_favorite">
    <div class="closed-form"></div>
    <div class="form-resume-wr">
        <div class="form-resume-sub style">Добавлено в закладки</div>
        <div class="favorite-user-wr">
            <img src="images/ded-ico.png" alt=""/>
            <div class="favorite-user-profile">Петер Цумторь</div>
            <div class="favorite-user-profile-add"><img src="images/sidebar-ico/ico-16.png" alt=""/><span>Добавлен</span></div>
        </div>
        <div class="res_form_line"></div>
        <div class="page-favorite"><a href="#" >Перейти на страницу закладок</a></div>
    </div>
</div>

<div id="modal_form_offer">
    <div class="closed-form"></div>
    <div class="form-resume-wr offer">
        <div class="form-resume-sub style">Предложить проект</div>
        <form action="" class="offer-project">

            <label>Выбрать проект</label><div style="clear:both;"></div>
            <div class="list_item title">
                <div class="main_item">
                    <div class="pr_title"></div>
                    <span></span>
                </div>
                <div class="arrow up"></div>
                <div class="off_list">
                    <ul class="content list-form-offer">
                        <li>
                            <div class="title1">Проект бассейна 1</div>
                            <div class="title2">Подряд: Вилла 1</div>
                        </li>
                        <li>
                            <div class="title1">Проект бассейна 2</div>
                            <div class="title2">Подряд: Вилла 2</div>
                        </li>
                        <li>
                            <div class="title1">Проект бассейна 3</div>
                            <div class="title2">Подряд: Вилла 3</div>
                        </li>
                        <li>
                            <div class="title1">Проект бассейна 4</div>
                            <div class="title2">Подряд: Вилла 4</div>
                        </li>
                        <li>
                            <div class="title1">Проект бассейна 5</div>
                            <div class="title2">Подряд: Вилла 5</div>
                        </li>
                    </ul>
                </div>
            </div>

            <label for="off_name">Название проекта</label><input id="off_name" name="" type="text">

            <label for="off_text">Описание</label><textarea id="off_text" name=""></textarea>

            <label for="off_price">Цена</label><input id="off_price" name="" type="text">

            <input id="off_submit" type="submit" value="Предложить">
        </form>
        <div class="res_form_line"></div>
    </div>
</div>

<div id="modal_form_question">
    <div class="closed-form"></div>
    <div class="form-resume-wr question">
        <div class="form-resume-sub style">Задать вопрос МФП</div>
        <form action="" class="question-project">
            <label for="qst_name">Ваши имя и фамилия</label><input id="qst_name" name="" type="text">

            <label for="qst_phone">Контактный телефон</label><input id="qst_phone" name="" type="text">

            <label for="qst_text">Вопрос</label><textarea id="qst_text" name=""></textarea>

            <input id="qst_submit" type="submit" value="Отправить">
        </form>
        <div class="res_form_line"></div>
    </div>
</div>