0

#page_contact_list と #page_contact_edit の 2 つのページがあります。リストから連絡先をクリックした後、#page_contact_edit に遷移し、クリックしたレコードの連絡先データを読み込み、保存の [保存] ボタンをクリックして保存したい。

私の質問は次のとおりです。

  • リストのどこにレコード ID (mysql contact.id) を入力すればよいですか?これは特別な属性、href パラメータですか...
  • 渡した連絡先 ID を取得するためのイベントはどれですか
  • データベースから連絡先データをロードしてフォームに入力するための AJAX 呼び出しを行うには、どのイベントを使用すればよいですか

  • #page_contact_edit が成功して #page_contact_list に戻る場合、「保存」イベントを作成するにはどうすればよいですか?

    <div data-role="page" id="page_contact_list">
  <div data-role="content">
      <ul data-role="listview" data-divider-theme="b" data-inset="true">
        <li data-role="list-divider" role="heading">
            Contacts
        </li>
        <li data-theme="c">
            <a href="#page_contact_edit" data-transition="slide">
                James
            </a>
        </li>
         <li data-theme="c">
            <a href="#page_contact_edit" data-transition="slide">
                Jenna
            </a>
        </li>
        <li data-theme="c">
            <a href="#page_contact_edit" data-transition="slide">
                Mark
            </a>
        </li>
      </ul>
    </div>
</div>

<div data-role="page" id="page_contact_edit">
    <div data-role="content">
        <form action="">
            <div data-role="fieldcontain">
                <fieldset data-role="controlgroup">
                    <label for="textinput1">
                        Name
                    </label>
                    <input name="name" id="textinput1" value="" type="text" />
                </fieldset>
            </div>
            <div data-role="fieldcontain">
                <fieldset data-role="controlgroup">
                    <label for="textinput2">
                        Second name
                    </label>
                    <input name="second_name" id="textinput2" value="" type="text" />
                </fieldset>
            </div>
            <div data-role="fieldcontain">
                <fieldset data-role="controlgroup">
                    <label for="textinput3">
                        Phone
                    </label>
                    <input name="phone" id="textinput3" value="" type="text" />
                </fieldset>
            </div>
            <a data-role="button" href="#page_contact_list">
                Save
            </a>
            <a data-role="button" href="#page_contact_list">
                Cancel
            </a>
        </form>
    </div>
</div>

JSFIDDLE

4

1 に答える 1

1

このURLの内容をコピーしてhtmlファイルに貼り付け、ローカルでテストしてください。http://pastebin.com/LyhLrK7Q。

  • リストのどこにレコードID（mysqlのcontacts.id）を配置する必要がありますか？これは特別な属性であり、hrefパラメーターです---添付のサンプルコードを参照して接頭辞を付けた任意の属性名を自由に使用できますdata-
  • 渡した連絡先IDをキャッチするためのイベントはどれですか--- リストビューのをクリックしliてキャッチしdata-contact-id ="1"ます。これはサンプルでカバーされすぎています。
  • データベースから連絡先データをロードしてフォームに入力するためにAJAX呼び出しを行うためにどのイベントを使用する必要がありますか--- changePageメソッドは、ajaxを使用してレコードをフェッチするための1つの優れた場所である必要があります。私は setTimeoutajaxをシミュレートするために使用しました。このタイマーコールバックをajaxコールバックとして使用できます
  • #page_contact_editが#page_contact_listに戻る場合、「保存」イベントを作成するにはどうすればよいですか。編集ページでのJavaScriptの検証はほとんど問題ありません。ユーザーがキャンセルまたは保存ボタンをクリックすると、逆方向に遷移します。
于 2013-01-01T02:50:07.693 に答える