1

だから、私は phonegap+jqm アプリケーションでしばらく働いていました。Androidフォン、ブラックベリーシミュレーター(os7)、およびブラックベリーデバイス(os5)でテストしています。私のアプリケーションは、ajax 呼び出しを使用して Web サービスからいくつかのデータをフェッチし、そのデータを使用して、そのデータを表示することのみを目的としていくつかのページを動的に作成します。

機能: Ajax 呼び出しが成功し、データが期待どおりに取得されます。また、jqm スタイルも正しく適用されます (通常のトリガー "create" と "refresh" を使用)。アプリケーション全体は、私の Android デバイスと os7 の bb シミュレーターでうまく動作します。

機能しないもの: 動的に作成および追加された要素は表示されず、代わりに古い要素 (削除されているはず) がそこに残ります。これは、os5 で bb をテストした場合にのみ発生します。

さて、いくつかのコード。ajax 呼び出しを開始するときは、いくつかの関数を使用してすべてを完了します。これは、各ページまたはページの標準的な手順です。

呼び出しからデータを受信すると、応答が特定のハンドラーに渡され、応答からデータを取得するジョブが実行されます。

function processListElements(response){
    alert("processListElements Start"); // THIS IS EXECUTED
    $('#anagTableList li[data-role="button"]').remove();

    $(response).find('return').each(function(){
alert("inside responseFind"); // THIS IS NEVER SHOWN            
var myNewLI=getFormattedLI($(this).find('codice').text(),$(this).find('responsabile').text());
        $('#anagTableList').append(myNewLI).listview('refresh');

    });

    $('#tablePage').trigger('create');
    $('#anagTableList').listview('refresh');
            alert("processListElements End"); // THIS IS SHOWN!
}

ご覧のとおり、新しいアイテムは、要素を正しくフォーマットする別の関数で作成されます。

function getFormattedLI(codice,responsabile){
    var myFormattedLI = '<li data-role="button" data-icon="arrow-r" data-iconpos="right">'+
                            '<p>'+codice+' - '+responsabile+'<\/p>'+
                        '<\/li>';

    return myFormattedLI;
}

最後に、このページのマークアップは次のとおりです。

<div id='tablePage' data-role="page">

<div data-theme="a" data-role="header">
    <h1 >Commesse Tigre</h1>
</div><!-- /header -->

<ul id='anagTableList' data-filter="true" data-theme="a" data-role="listview" data-inset="true">
    <a href="#" id="advancedSearch" data-theme="c" style="color:#FF8C90;text-decoration:none">advanced search</a>
    <li id='tableHeader' data-role="header">CODICE - RESPONSABILE - ANNO</li>

</ul>



<div data-theme="a" data-role="footer">
    <div class="ui-grid-b">
        <div class="ui-block-a"><a href="#" id="pageLeft" data-role="button" data-icon="arrow-l" data-iconpos="notext" style="margin-top:7px;">Previous page</a></div>
        <div class="ui-block-b" style="text-align:center;margin-top:15px;">Page<p id='currentPage' style="display:inline">1</p> of <p  style="display:inline" id='totalPages'>2</p></div>
        <div class="ui-block-c"><a href="#" id="pageRight" data-role="button" data-icon="arrow-r" data-iconpos="notext" style="float: right;margin-top:7px;">Next page</a></div>
    </div><!-- /footer -->
</div>

では、ページを変更しても新しいリスト項目が表示されないのはなぜですか? 私は何か間違ったことをしていますか?

私はしばらくこれに苦労してきましたが、解決策が見つかりません。また、長い質問で申し訳ありません:)

編集 1: 長い間、すべての jquery 関数を純粋な JavaScript に変更しようとしました。何も変わっていません(これに大きな期待を寄せていたわけではありません)

編集2:まだこれに苦労しており、毎回奇妙になります。私はいくつかのテスト アプリケーションを実行してきましたが、まったく同じように動作し (ul に新しい li が追加されます)、要素がまだ表示されない上記のコードを含むアプリケーションを除いて、すべて動作します。

編集 3: response.find 関数内のすべてが実行されないことがわかりましたが、コードはブロックされないため、関数内にアラートを配置しても表示されません。よりよく説明するためにコードを編集しました。

編集 4: 「検索」機能が「戻り」ノードを見つけていないと言っても過言ではないと思います。応答は第 2 軸の Web サービスから来ており、各戻りノードは「ns:return」としてタグ付けされています。これは、私の Android デバイスと bb7 デバイスでは問題ではありませんが、明らかに私の bb5 デバイスでは問題です。検索を「ns:return」に変更しても何も解決しません。私はとても疲れている。ヘルプ!

編集 5 (最後): 問題を解決できませんでしたが、見つけました。この問題は、jquery または javascript で名前空間を持つノードを見つけることができるようになりました。SO にはこの問題に対処するための多くの質問がありますが、jQuery 1.7 がすべての回避策を破っているため、今まで何もうまくいきませんでした。

4

2 に答える 2

0

私は最終的にこれを解決しました。xml 応答の各戻り値は次のようになります。

     <ns:return xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:type="ax21:CommessaBase">
        <ax21:codice>CODICE0</ax21:codice> 
        <ax21:responsabile>PERSON0</ax21:responsabile> 
     </ns:return>

したがって、リターンを探している上記のコードでは、何も見つかりませんでした。私はいくつかのことを試しましたが、最終的に機能した機能は次のとおりです。

     function processListElements(response){

    $('#anagTableList li[data-role="button"]').remove();
    $('#anagTableList').listview('refresh');

    $(response).find('*').filter('ns\\:return').each(function(){

        var myNewLI=getFormattedLI($(this).find('*').filter('ax21\\:codice').text(),$(this).find('*').filter('ax21\\:responsabile').text());
        $('#anagTableList').append(myNewLI);
        $('#anagTableList').listview('refresh');

    });

}
于 2012-05-04T15:02:15.950 に答える
0

こんにちは、すべての HTML リスト要素 (li) を 1 つの文字列で作成する作業サンプルがあります (ここでは、arrLI が li 要素文字列の配列であると仮定します)。

$('#mylist').append(arrLI.join(""));
$('#mylist').listview('refresh');
$('#mylist').trigger('create');

各要素の更新を削除します

于 2012-05-02T14:42:27.843 に答える