Мобильный диалог Jquery с элементом Page - PullRequest
Новая
       0

Мобильный диалог Jquery с элементом Page

1 голос
/ 19 сентября 2011

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

<div data-role="header" class="ui-header ui-bar-a" role="banner">
  <h1 class="ui-title" tabindex="0" role="heading" aria-level="1">Devices</h1>
  <a class="ui-btn-right ui-btn ui-btn-icon-left ui-btn-corner-all ui-shadow ui-btn-down-a ui-btn-up-a" data-icon="gear" data-rel="dialog" data-transition="flip" href="#filter_form" data-theme="a"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Options</span><span class="ui-icon ui-icon-gear ui-icon-shadow"></span></span></a>
</div>
<!-- other page stuff -->
    <div id='filter_form' style='display: none'>
      <h3>Device Criteria</h3>
      <form accept-charset="UTF-8" action="/devices" method="get">
        <div data-role='fieldcontain'>
          ...
        </div>
        <div>
          <button data-theme='a'>Submit</button>
        </div>
      </form>
    </div>
    <script>
      //<![CDATA[
        $(function(){
          $('.show_filter_form').click(function(){
            console.log("in click handler")
            $.mobile.changePage($('#filter_form form'), {transition: 'pop', changeHash: false, role: 'dialog'});
            return false;
          })
        })
      //]]>
    </script>

Нажатие срабатывает, но на странице ничего не происходит, кроме неустановленной кнопки возврата, отображаемой в заголовке.

Я настроил для этого скрипку js, если у вас есть идеи: http://jsfiddle.net/BHMmP/

1 Ответ

0 голосов
/ 20 сентября 2011

Что касается вашей JS-кодировки, диалоговое окно будет всплывающим после того, как вы нажмете « .show_filter_form ».Но где находится этот элемент " .show_filter_form "?

...