1

この例をできる限り簡略化しました。私はリモート機能を持っています：

<cfcomponent output="false">
<cffunction name="Read" access="remote" output="false">
    <cfset var local = {}>

    <cfquery name="local.qry" datasource="myDatasource">
    SELECT PersonID,FirstName,LastName FROM Person
    </cfquery>
    <cfreturn local.qry>
</cffunction>
</cfcomponent>

そして、jQuery $ .ajaxメソッドを使用して、すべての人の順序付けられていないリストを作成したいと思います。

    <!DOCTYPE HTML>
    <html>
    <head>
    <script src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
    google.load("jquery", "1");
    </script>
    <script type="text/javascript">
    jQuery(function($){
    $.ajax({
            url: "Remote/Person.cfc?method=Read&ReturnFormat=json",
            success: function(data){
                var str = '<ul>';
// This is where I need help:
                for (var I=0; I<data.length; I++) {
                    str += '<li>' + I + data[I][1]+ '</li>'
                }
                str += '</ul>';
                $('body').html(str);
            },
            error: function(ErrorMsg){
               console.log("Error");
            }
        });
    });
    </script>
    </head>
    <body>
    </body>
    </html>

私が迷子になっているのは、データをループしているところです。$.getと$.postにはエラートラップがないことを理解しているので、jQuery$.ajaxメソッドを使用することを好みます。

cfcから返されたJSONを処理する方法がわかりません。

4

4 に答える 4

8

結果はjson形式のようです（ドキュメントhttp://livedocs.adobe.com/coldfusion/8/htmldocs/help.html?content=Tags_f_21.htmlを確認してください）。「returnformat="json"を指定し、関数がクエリを返す場合、ColdFusionはクエリを2つのエントリ、列名の配列、および列データ配列の配列を持つJSONオブジェクトにシリアル化します。詳細については、SerializeJSONを参照してください。」http://livedocs.adobe.com/coldfusion/8/htmldocs/help.html?content=Tags_f_21.html

したがって、最初の配列（data.COLUMNSは列名の配列である必要があります。data.COLUMNS[0]は最初の列の名前を示します。data.DATA[0]はクエリの最初の行を示します。

良いトリックは、chromeまたはfirebugコンソールでconsole.log（data）を使用して、構造化された形式でデータを表示することです。

私はこれをテストしませんでしたが、近いはずです。データから基本的なテーブルを生成するだけです。 

$.ajax({
    url: 'Remote/Person.cfc?method=Read&ReturnFormat=json',
    dataType: 'json',
    success: function(response) {
        var str = '<table><tr>';
        var i;
        var j;

        //loop over each column name for headers
        for (i = 0; i < response.COLUMNS.length; i++) {
              str += '<th>' + response.COLUMNS[i] + '</th>';
          }
        }
        str += '</tr>';

        //loop over each row
        for (i = 0; i < response.DATA.length; i++) {
          str += '<tr>';
          //loop over each column
          for (j = 0; j < response.DATA[i].length; j++) {
              str += '<td>' + response.DATA[i][j] + '</td>';
          }
          str += '</tr>';
        }
        str += '</table>';

        $('body').html(str);
    },
    error: function(ErrorMsg) {
       console.log('Error');
    }
});
于 2010-04-05T01:40:12.920 に答える
4

私はColdFusionにあまり詳しくありませんが、データ型をJSONに設定してみましたか？

$.ajax({
    url: 'Remote/Person.cfc?method=Read&ReturnFormat=json',
    dataType: 'json',
    success: function(response) {
        var data = response.DATA;
        var str = '<ul>';

        for (var I = 0; I < data.length; I++) {
            str += '<li>' + I + data[I][1] + '</li>';
        }

        str += '</ul>';

        $('body').html(str);
    },
    error: function(ErrorMsg) {
       console.log('Error');
    }
});

取得するデータが次のようなものである場合、これは機能するはずです。

[["PersonID1", "FirstName1", "LastName1"],["PeronID2", "FirstName2", "LastName2"]] .. etc

上記が機能しない場合は、リクエストによって返される生のJSONデータを表示できれば、簡単に修正できるはずです。

また、それがコードに含まれているかどうかはわかりませんが、forループの行末にセミコロンがありません。

于 2010-03-31T22:13:22.537 に答える
4

最も簡単な方法は、返されたJSONデータがどのように構造化されているかを視覚的に確認することです。そうすれば、JSオブジェクトを横切るのはそれほど難しくないはずです。JSONの視覚化を試しましたか？http://chris.photobooks.com/json/default.htm

必要なのがPersonIDだけの場合は、CFからPersonIDの配列またはリストを返すこともできます。

または、オプションで、すべてのを生成したプレーンテキストを返すようにCFに要求できます<li>。ajaxを介して渡されるメッセージは大きくなりますが、維持するJSコードが少なくなります。CFMLは保守が簡単ですよね？:)

于 2010-03-31T22:21:30.330 に答える
2

オプション：

あなたの場合、私は置きます

<cffunction name="keywordAutoComplete" access="remote" 
            returntype="struct" returnformat="JSON" >

しかし

これはと同じことをreturntype="string" returnformat="plain" + <cfreturn serializeJSON(query) > 行い、列によるserializeJSON srerializationを使用しても醜いJSONを取得するため、jQueryの観点からは問題になります。

  1. cfloopと連結を介して手動でJSON文字列を作成できます：/
  2. serializeJSONをオーバーライドするcfjson.cfcを使用します
  3. Ben Nadelのサイトにアクセスし、彼のtoJSONメソッドを使用して、ニーズに合わせて変更します。

もう1つはserializeJSONで、大文字のキーを返すので注意してください。lcase（）を使用するか、jsで.LIKETHISを記述してください。

PS：jQueryのhtmlの動的作成のためにこれを試してください：

var someLiElement = $('<li />').addClass('custom_class')
                 .text('Foo bar')
                 .attr('id', 'custom_id' + someInteger)

次に、親要素にメソッドを追加します

于 2010-04-01T12:57:34.593 に答える