2016-12-26 6 views
0

私は21世紀にAJAXとPHPを学ぶことでWebスキルを身につけようとしていますが、私は、初期選択コントロール "カテゴリ"から選択されたものに応じて、選択コントロール "レシピ"にオプションを設定したいと思います。セカンダリコントロール "レシピ"のオプション項目は、PostgreSQLデータベーステーブルに対して実行されるAJAXクエリの解析結果になります。以下のコードに示す関数 "makeAjaxRequestCategory"は、dataType: 'json'プロパティを含むjQuery AJAX呼び出しです。これが問題の原因です。最高の私は、問題は私が解析することができます結果を返す代わりに、そのプロパティをインクルードし、コードを実行させるときに来ると、エラーとして返します...しかし、応答オブジェクトもステータス200( " OK "...なぜそれはエラーとして解釈されていますか?)。応答オブジェクトのresponseTextプロパティには次のものが含まれます。AJAXとPHP - JSONデータタイプの使用に依存する2つの異なるエラー

responseText:"<br />↵<b>Parse error</b>: syntax error, unexpected '}', expecting ',' or ';' in <b>C:\Bitnami\wampstack-5.5.38-0\apache2\htdocs\ajaxSelectCategory.php</b> on line <b>8</b><br />↵ 

私はDataTypeプロパティをアウト発言とせずに、それを実行すると、私は別のエラーを取得:

jquery.min.js:4 Uncaught TypeError: Cannot use 'in' operator to search for '179' in <br />(…) 

をそれは適切な方法のように思えますこれを行うには、dataTypeをJSONに設定し、PHPから取得したJSONオブジェクトを解析してください。代わりに、矛盾した応答(エラーと200の応答)が同時に発生しているようです。 "category"コントロールに移入するための最初のPHPコールがうまく動作することに注意してください。あなたが成功した回答を得るために与えることができるガイダンスは、私が解析することができれば最も高く評価されます! 。 "localhost" をWindowsの10ラップトップ

  • のApacheウェブサーバV 2.4.23(Win32の)
  • PostgreSQLのバージョン9.6.1
  • 上で

    • ローカル開発:

      は、ここに私の開発環境です

    • ChromeでChromeを実行し、ChromeのDevToolsを使用してトラブルシューティングを行う

    ここには、メインファイル 'recipesystem.php'があります私は、ブラウザで実行時:

    <!DOCTYPE html> 
        <html> 
        <head> 
        </head> 
    <body> 
    
    Version 317.0<br><br> 
    
    <div class = 'selection'> 
    <table id='selectiontable'> 
        <tr> 
        <td>Select Recipe Category</td> 
        </tr> 
        <tr> 
        <td> 
         <select id="category"> 
         <option value='Select a category...'></option> 
         <?php 
         $connection = pg_connect("host=localhost port=5432 dbname=recipes user=postgres password=XXXXXXXX"); 
         $result = pg_query($connection,"SELECT category FROM recipesystem.recipe ORDER BY category;"); 
         while ($row = pg_fetch_assoc($result)) { 
          unset($category); 
          $category = $row['category']; 
          echo '<option value="'.$category.'">'.$category.'</option>'; 
         }; 
         ?> 
        </td> 
        </tr> 
    </table> 
    </div> 
    <br> 
    
    <select id="recipe"> 
    <option value='Select a recipe...'></option> 
    </select> 
    
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'></script> 
    <script> 
        // This is for the Category selector... 
        $('#category').on('change', function(){ 
        $('#recipe').empty(); 
        var selected = $(this).val(); 
        makeAjaxRequestCategory(selected); 
        }) 
        function makeAjaxRequestCategory(opts){ 
        $.ajax({ 
         type: 'POST', 
         data: { opts: opts }, 
         dataType: 'json', 
         url: 'ajaxSelectCategory.php', 
         success: function(res) { 
         console.log("Success...") 
         console.log(res) 
         $.each(res, function(i, value) { 
          console.log(value) 
         }) 
         }, 
         error: function(res){ 
         console.log("There was an error...") 
         console.log(res) 
         } 
        }) 
        } 
    </script> 
    
    </body> 
    </html> 
    

    ajaxSelectCategory.php

    <?php 
        echo "<script> console.log('Starting PHP script....');</script>"; 
        $connection = pg_connect("host=localhost port=5432 dbname=recipes user=postgres password=XXXXXXXX") or die("Connection Error"); 
        $result = pg_query($connection,"SELECT name, category FROM recipesystem.recipe ORDER BY category;"); 
        while ($row = pg_fetch_assoc($result)) { 
         echo "$('#recipe').append('<option>newvalue</option>');" 
        }; 
    ?> 
    
    +1

    あなたはJSON – charlietfl

    答えて

    0

    あなたはこのように見えるためにajaxSelectCategory.phpを変更する必要があります 、旧世紀から移動することは非常に幸せ:

    <?php 
        echo "<script> console.log('Starting PHP script....');</script>"; 
        $connection = pg_connect("host=localhost port=5432 dbname=recipes user=postgres password=XXXXXXXX") or die("Connection Error"); 
        $result = pg_query($connection,"SELECT name, category FROM recipesystem.recipe ORDER BY category;"); 
    $output=array(); 
        while ($row = pg_fetch_assoc($result)) { 
         $output[] = $row['field name']; 
        }; 
    echo json_encode($output); 
    ?> 
    

    そして、あなたの成功コールバックへ:

    success: function(res) { 
         console.log("Success...") 
         console.log(res) 
         $.each(res, function(i, value) { 
          $('<option>'+value+'</option>').appendTo($('#recipe')); 
         }) 
         }, 
    
    +0

    HTMLを送信しているではない私のajaxSelectCategory.phpスクリプトの最初のエコーが作成されたひどくJSONレスポンスを形成したが、私はそれを削除し、あなたの提案を取り入れたら、それが正しく機能し始めました。どうもありがとう! – user923526

    0

    [OK]を、最初のHTTPコードは、要求が応答が続い送ったことを意味200 OK、です。コード200は、HTTPリクエストがApacheによって処理され、表示されるエラーがPHPでコードを実行することによって生成されるため、応答本体にエラーがないことを保証するものではありません。抽象的でないものがあれば、HTTPリクエストを処理したいすべての言語は異なるコードを実装し、実際には言語の責任ではありません。

    第2に、あなたのajaxリクエストにdataType: 'json'を定義すると、youre ajaxSelectCategory.phpスクリプトがjson形式のデータをエコーし​​ないため、「おい、私はjson形式のデータを受け取りたいです」というメッセージが表示されます。 JSONパーサは受け取っている内容を理解できないためブラウザからJSONをデコードするように設定されていますが、JSONとしてエンコードされていません。あなたは$.each(res, function(i, value) {にしたいよう

    だから、どちらかdataType: 'html'、およびHTMLコードで文字列全体としてresを治療するか、結果の配列を作成し、それをjson_encode()をエコー、唯一のあなたはそれを反復処理できるようになります

    関連する問題