0

私の Jquery Mobile フォームでは、フォームは Json オブジェクトに基づいて要素を動的に作成します。編集ボタンをフォームに動的に追加します。フォームを作成したら、すべての要素を無効に設定します。

Jquery Mobile でフォーム要素を再度有効にする方法は? (Jquery ではありません)

ユーザーが [編集] ボタンをクリックすると、すべてのフォーム要素が有効になります。無効にすると問題なく機能しますが、有効にすることはできません。

  for (var data_index in data) {
                    var item = data[data_index];

                    for (var key in item) {
                        var field_id = "fld_" + key;
                        // Build the Fields 
                        var $field_container = $('<div data-role="fieldcontain"></div>');
                        //var $field_set = $('<fieldset data-role="controlgroup"></fieldset>');
                        var $field_label = $('<label for="' + field_id + '">' + key + '</label>');
                        var $field_input = $('<input name="' + field_id + '" id="' + field_id + '" placeholder="" value="' + item[key] + '" type="text">');
                        $field_input.attr('disabled', 'disabled');
                        $field_container.append($field_label);
                        $field_container.append($field_input);
                        $view_detail_container.append($field_container);
                    };
                };

これにより、フォーム要素が正常に作成され、無効になります。

このスニペットは編集ボタンを作成します (これは DOM に適切に追加されます)。フォーム要素を再度有効にするためのコードは、このイベント ハンドラーにあります。すべてのフォーム要素は入力です。(基本的なテキスト入力)

var $action_edit = $('<a id="action_edit" data-role="button">Edit</a>');
            $action_edit.on("click", function (event, ui) {
                // enable all form fields 
                $('#detail_form').children().each(function () {
                    alert('clicked!') // fires everytime just fine
                    var child = $(this);
                    child.attr('disabled', '');
                    child.ready();
                    child.trigger('create');
                }).trigger("create");

            });
            this.AddAction($action_edit);// appends this button to the correct div.

私は Jquery Mobile のドキュメントを見てきましたが、以前よりは良くなっているように見えますが、まだ注意が必要です。

  • このリンクは、Jquery Mobile Documentation のフォーム要素ページです。このページで「フォーム要素の無効化」を検索すると、次のような段落が表示されます。

すべての jQuery Mobile ウィジェットは、ネイティブ コントロールの場合と同様に、標準の disabled 属性を要素に追加することで、マークアップで無効にすることができます。各フォーム ウィジェットには、各フォーム ウィジェットに記載されている標準の無効化および有効化メソッドもあります。無効化されたウィジェットの例をいくつか示します。

Jquery Mobile ドキュメントのテキスト入力ページに移動し、ページで「有効」または「無効」を検索しても、何も見つかりません。さらに、それらは「メソッド」であると説明されており、そのような名前のメソッドは存在しません。すべてのグーグルは私に試してもらいました...

child.removeAttr('無効'); // サイコロはありません child.attr('disabled',''); //サイコロなし

これらは動的要素であるため、欠けているものはありますか? 「ページ」(Jquery モバイル、ページはドキュメントではなく div であることを思い出してください) を更新する必要がありますか? 要素に関する別のイベント？

なんでも？

ありがとう。

4

1 に答える 1

0

フォームの各要素を繰り返し処理している間、.each() は 1 レベルしか下がらない。与えられた JQuery Mobile フォーム...

<form>
    <div class="ui-field-contain">
         <label></label>
         <input></input>
    </div>
</form>

フィールド コンテナ div の子要素で .each() を実行する必要があります。入力要素に対して dom を照会し、それらの属性を変更する通常の方法を実行しても機能しなかったことは、何の価値もありません。

$('#detail_form').children().each(function () { 
   var child = $(this);
   child.children().each(function () {
        var sub_item = $(this);
        sub_item.removeAttr('disabled');
   };
};
于 2013-01-05T21:47:50.170 に答える