Простой jQTouch Выбор продукта на основе форм - PullRequest
Новая
       6

Простой jQTouch Выбор продукта на основе форм

1 голос
/ 19 октября 2010

Я использую jQTouch для создания простого мобильного приложения с формой html / js / jquery, которое действует как селектор продукта. Он имеет 5 выпадающих меню и 6 возможных сценариев:

Сценарии: Есть 6 продуктов - выбирается тот, который набирает наибольшее количество очков. Затем пользователь попадает в div (который действует как страница в jQTouch) с контентом для этого продукта.

Форма:

Вопрос 1

Вариант 1 : 1 балл за продукт A, 1,5 балла за продукт C
Вариант 2 : 1 балл за продукт B, 1 балл за продукт D
Опция 3 : 1 балл за продукт C, 1 балл за продукт E
Вариант 4 : 1,5 балла за Продукт F

- и т. Д. По 5 вопросам.

Так как это использует jQTouch, я надеялся, что форма выяснит, какой продукт набрал наибольшее количество очков, а затем доставит пользователя к соответствующему разделу (странице). Кто-нибудь, пожалуйста, расскажите, как лучше всего выполнить эту задачу?

Вся помощь очень ценится. :) Спасибо.

1 Ответ

0 голосов
/ 20 октября 2010

Разобрался и подумал, что публикация может помочь кому-то еще :) Работа в jQTouch + phonegap.
В HTML: 

        <form name="myForm" action="">
        <p>1. Question 1</p>
            <span>
            <select id="rofy-q1" name="q1" class="btn">
                <option value="0" disabled="disabled">Please select</option>
                <option value="50">Option 1</option>
                <option value="100">Option 2</option>
                <option value="200">Option 3</option>
                <option value="300">Option 4</option>
                <option value="400">Option </option>
            </select>
        </span>
        <p>2. Question 2</p>
            <!-- ETC - fill out the remaining questions as per q1 but change the 'name' to q2, q3 etc. -->
        <span class="buttoncontain"><input href="#" type="button" value="Click to see your results" class="btn" onclick="getProduct();"></span>
        </form>


<script type="text/javascript" charset="utf-8">
        function getProduct() {
            // Get scores - a=answer, q=question
            var a1 = document.myForm.q1.value;
            var a2 = document.myForm.q2.value;
            var a3 = document.myForm.q3.value;
            // Calculate the scores
            var userCalc = parseInt(a1) + parseInt(a2) + parseInt(a3);
            // Suggest a product based on scores
            if (userCalc <= 99) {
                // alert("Product 1");
                jQT.goTo("#p1");
            } else if (userCalc <= 199) {
                // alert("Product 2");
                jQT.goTo("#p2");
            } else {
                // alert("Product 3");
                jQT.goTo("#p3");
            }
            // End functions
        }
        </script>
...