JQuery Мобильный сброс формы HTML 5 - PullRequest
Новая
       12

JQuery Мобильный сброс формы HTML 5

4 голосов
/ 23 января 2012

У меня есть форма, которую я хочу сбросить, когда я нажимаю кнопку. Но я просто не могу заставить его работать. Похоже, что диапазон типов ввода сбрасывается, но не выбор.

HTML 

   <form id="details_to_add">
                <div data-role="fieldcontain">
                    <select id="select_company" data-native-menu="false" onchange="openNewcompanyDialog(this)" value="Company">
                        <option data-placeholder="company">Company</option>
                        <option value=""></option>
                        <option value="test">Test</option>
                        <option value="internal1">Internal</option>
                        <option value="new_company_option">Add a new company</option>
                    </select>
                </div>

                <div data-role="fieldcontain">
                    <select id="select_description" data-native-menu="false" onchange="handleInternalChoice(this)" value="Description">
                        <option data-placeholder="description">Description</option>

                        <!--Options to be shown when "internal" is chosen from company -->
                        <option value="internal1_1">Day off</option>
                        <option value="internal1_2">Time off</option>
                        <option value="internal1_3">Vacation</option>
                  </select>
                </div>

                <div data-role="fieldcontain">
                    <label for="number_of_hours">Number of hours:</label>
                    <input type="range" id="number_of_hours" value="0" min="0" max="24" step="0.25" />
                </div>
                <div data-role="controlgroup" data-type="horizontal">
                    <a href="#" data-role="button" data-rel="back">Close</a>
                    <a href="#" data-role="button" data-rel="back" onclick="pushData()">Save</a>
                </div>
            </form>

Я пробовал несколько способов сбросить эту форму, но, как упоминалось выше, она только сбрасывает ползунок. Любые предложения ??

1 Ответ

4 голосов
/ 24 января 2012

Вы можете решить эту проблему, добавив такую ​​кнопку: 

<a id="reset" data-role="button">Reset</a>

И с помощью jQuery ... 

$('#reset').click(function() {
    $('#number_of_hours').val('0').slider('refresh');
    $('#select_company').val('Company').selectmenu('refresh');
    $('#select_description').val('Description').selectmenu('refresh');
});

Попробуйте пример здесь: http://jsfiddle.net/KxakF/6/

...