form

gistfile1.txt

<div id="order-unreal-form_block" class="order-unreal-form lity-hide">
    <h2 class="left margin-bottom-small">Order QA testing</h2>
    <button class="lity-close show" type="button" aria-label="Close (Press escape to close)" data-lity-close="">×</button>
    <form action="" id="orderUnrealForm">
        <div class="select-pack">
            <div class="section group">
                <div class="col left-col">
                    <div class="input-wrapper select-wrapper">
                        <select id="packages" name="package">
                            <option value="Basic" id="basic-pack" selected>Basic</option>
                            <option value="Standart" id="standart-pack">Standart</option>
                            <option value="Optimal" id="optimal-pack">Optimal</option>
                            <option value="Expert" id="expert-pack">Expert</option>
                            <option value="Unreal" id="unreal-pack">Unreal</option>
                            <option value="Epic" id="epic-pack">Epic</option>
                        </select>
                    </div>
                    <div class="input-wrapper select-wrapper">
                        <select id="period" name="period">
                            <option value="0" name="3 months" s18n>3 месяца</option>
                            <option value="1" name="6 months" s18n>6 месяцев</option>
                            <option value="2" name="12 months" s18n>12 месяцев</option>
                            <option value="3" name="18 months" s18n>18 месяцев</option>
                        </select>
                    </div>
                    <div class="input-wrapper">
                        <input type="text" id="mail" data-validation="required email" name="email" placeholder="E-mail"  data-validation-error-msg=" ">
                    </div>
                    <div class="input-wrapper">
                        <input type="text" id="company" name="company" placeholder="Company">
                    </div>
                </div>
                <div class="col right-col">
                    <p class="pack-description" id="package-description">Эта команда прекрасно подойдет для тестирования небольших мобильных и ПК проектов, а также проведения итерационного тестирования.</p>
                    <div class="input-wrapper">
                        <textarea type="text" id="order-message" name="description" placeholder="Describe your project"></textarea>
                    </div>
                    <div class="sent-block">
                        <div class="sent-block__price">
                            $ 8 528
                        </div>
                        <div class="sent-block__btn">
                            <input type="submit" class="btn btn-send" s18n value="Отправить">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
    <div id="message" s18n>Thank you! Your message has been sent successfully. We will contact you shortly.</div>
    <div id="message_error" s18n>Возникли технические сложности с отправкой Вашего сообщения.</div>
    <div id="valid-message" s18n>Please fill out all required fields.</div>
</div>
<script>
    var prices = {
            Basic : ["8 528", "16 692", "32 659", "47 900"],
            Standart : [0, "32 659", "63 867", "93 623"],
            Optimal : [0, "63 867", "124 831", "182 892"],
            Expert : [0, "124 831", "243 855", "357 054"],
            Unreal : [0, 0, "476 099", "696 730"],
            Epic : [0, 0, "928 973", "1 358 623"]
    };

    $("#period").change(function(e) {
        var type = $('#packages').val(),
            sel = $(e.target), val = sel.val(),
            arr_type = prices[type], pricePack = arr_type[val],
            $blockPrice = $('.sent-block__price');

        $blockPrice.html('$ '+pricePack);
    });

    $('#packages').change(function(e) {
        var $sel = $(e.target), pricePack = 0,
            type = $sel.val(), arr_type = prices[type],
            $blockPrice = $('.sent-block__price');

        $.each(arr_type,function(index,value){
            var $elem = $('#period option[value="'+index+'"]'),
                next_index = index+ 1;

            //console.log(index);
            if (value === 0) {
                $elem.hide();
                $elem.removeAttr('selected');
                $elem.parent().val(next_index);
                pricePack = arr_type[next_index];
            } else {
                $elem.show();
                if (index === 0) {
                    $elem.parent().val(index);
                    pricePack = arr_type[0];
                }
            }

            $blockPrice.html('$ '+pricePack);
        });

    });

    $('form#orderUnrealForm').submit(function (e) {
        e.preventDefault();
        var formData = new FormData(this);

        if ($(this).isValid()) {
            var message = $('#message').text(),
                err_message = $('#message_error').text();
            $.ajax({
                url: 'https://bytexgames.ru/unrealform',
                data: formData,
                processData: false,
                contentType: false,
                type: 'POST',
                success: function(data) {
                    var obj = JSON.parse(data);
                    if (obj.success) {
                        // Послать ивент в Яндекс Метрику: успешная отправка
                        alert(message);
                        yaCounter8044348.reachGoal('SEND_MAIL');
                    } else {
                        // Послать ивент в Яндекс Метрику: ошибка отправки
                        alert(err_message);
                        yaCounter8044348.reachGoal('FAIL_MAIL');
                    }
                    location.href="/";
                }
            });
        } else {
            var valid_message = $('#valid-message').text();
            alert(valid_message);
        }
    });

</script>