2017-08-02 17 views
0

3つの質問: 1)このコードをもっと綺麗にする方法はありますか?主に引用符の中にネスティングや引用符をあまり入れないようにするには? 2)以下の解析エラーに関するアドバイス。私はそれが動作することを確認するために別にいくつかのコードをテストしました。 (下の2番目のコードボックスを参照)。 3)このリクエストを処理するNodeJSサーバープログラムのrequest.bodyを見ると、「未定義」になります。私が読んだところでは、content-typeがapplication/jsonに設定されていれば、ボディパーサーは必要ありませんでした。Dojo - ボタンクリック時のrequest.post - 構文エラー

<button id="updateStudentButton" data-dojo-type="dijit/form/Button" 
     data-dojo-props="iconClass:'dijitIconTask', 
      onClick:function(){ 
       var url = '../student/' + dom.byId('studentId').value; 
       var studId = dojo.byId('studentId').value; 
       dom.byId('studentFeedback').value += 
        'updateStudentButton clicked studentID=' + studId + '\n'; 
       var firstname = dom.byId('studentFirstname').value; 
       var lastname = dom.byId('studentLastname').value; 

       var postBody = JSON.parse(
          '{ \"data\": {' + 
          ' \"firstname\": "' + firstname + '\",' + 
          ' \"lastname\": "'+ lastname + '\"' + 
          '},' + 
          '\"headers\": { ' + 
          ' \"Content-Type\": \"application/json\" ' + 
          '}}' 
          ); 
       dom.byId('studentFeedback').value += 'postBody=' + postBody + '\n'; 
       require(['dojo/request'], function(request){ 
        // AJAX Post the data to the server 
        request.post(url, postBody 
        ).then(function(response){ 
         dom.byId('studentFeedback').value += response + '\n'; 
         // parse and return data in text boxes 
         var respJSON = JSON.parse(response); 
         var rowsAffected = respJSON.rowsAffected; 
         dom.byId('studentFeedback').value += 'rowsAffected=' + rowsAffected + '\n'; 
         }, 
         function(error){ 
          dom.byId('studentFeedback').value += response; 
         }); 
       }) 

      } 
      "> 
      Update 
</button> 

は、私は確信して、引用符にすべての作業をするためにNodeJSでseparatleyをテストし、正しいにconsole.log見た:

   var firstname = 'John'; 
       var lastname = 'Doe'; 

       var postBody = JSON.parse(
          '{ \"data\": {' + 
          ' \"firstname\": "' + firstname + '\",' + 
          ' \"lastname\": "'+ lastname + '\"' + 
          '},' + 
          '\"headers\": { ' + 
          ' \"Content-Type\": \"application/json\" ' + 
          '}}' 
          ); 
console.log ("postBody="); 
console.dir (postBody); 

解析エラーを取得する:

dojo/parser::parse() error Error: SyntaxError: Invalid or unexpected token in data-dojo-props='iconClass:'dijitIconTask', 
        onClick:function(){ 
         var url = '../student/' + dom.byId('studentId').value; 
         var firstname = dom.byId('studentFirstname').value; 
         var lastname = dom.byId('studentLastname').value; 

         var postBody = JSON.parse(
            '{ \' 
    at Object.construct (parser.js.uncompressed.js:401) 
    at Object.<anonymous> (parser.js.uncompressed.js:190) 
    at Object.map (dojo.js:8) 
    at Object._instantiate (parser.js.uncompressed.js:184) 
    at parser.js.uncompressed.js:893 
    at _2f8 (dojo.js:8) 
    at Promise.then._305.then (dojo.js:8) 
    at Object.parse (parser.js.uncompressed.js:890) 
    at Object._parse (html.js.uncompressed.js:301) 
    at Object.onEnd (html.js.uncompressed 

答えて

1

が表示されます引用符の問題の中に引用符を回避する方法は、持っていることですあなたのonClick JavaScriptコードは<script></script>タグ内にあります。

以下は、私の環境で動作するコードの修正版です。サーバーの処理側がないので、要求はエラーコールバックをアクティブにします。

宣言的な詳細(data-dojo-eventの使用)についてはhere、要求の詳細についてはhereのドキュメントを参照してください。

私は自分のアプリケーション(サーバー側のPHP)で行っているように、リクエストのためにデータを文字列化しました。ドキュメンテーションには、文字列またはオブジェクトである可能性があることが記載されています。サーバ環境に応じて、データオブジェクトを送信してみてください。

RGDS、 JC

<!DOCTYPE HTML> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <title>Neal Walters stask overflow test</title> 
     <link rel="stylesheet" href="dojo-release-1.12.2-src/dijit/themes/claro/claro.css" media="screen"> 

    </head> 
    <body class="claro"> 
     <button type="button" id="updateStudentButton" data-dojo-type="dijit/form/Button" data-dojo-props="iconClass:'dijitIconTask'"> 
      <span>update</span> 
      <script type='dojo/on' data-dojo-event='click'> 
        var dom = require('dojo/dom');     
        var url = '../student/' + dom.byId('studentId').value; 
        var studId = dom.byId('studentId').value; 
        dom.byId('studentFeedback').value += 'updateStudentButton clicked studentID=' + studId + '\n'; 
        var firstname = dom.byId('studentFirstname').value; 
        var lastname = dom.byId('studentLastname').value; 
        var data = {firstname: firstname, lastname: lastname}; 
        //dom.byId('studentFeedback').value += 'postBody=' + postBody + '\n'; 
        require(['dojo/request'], function(request){ 
        // AJAX Post the data to the server 
         request.post(url, {data: JSON.stringify(data), method: 'POST', handleAs: 'json'}).then(
          function(response){ 
           dom.byId('studentFeedback').value += JSON.stringify(response) + '\n'; 
           // parse and return data in text boxes 
           var rowsAffected = response.rowsAffected; 
           dom.byId('studentFeedback').value += 'rowsAffected=' + rowsAffected + '\n'; 
          }, 
          function(error){ 
           dom.byId('studentFeedback').value += error; 
          } 
         ); 
        }); 
      </script> 
     </button><p> 
     <form> 
      Student feedback: <input id="studentFeedback"><p> 
      Student first name: <input id="studentFirstname"><p> 
      Student last name: <input id="studentLastname"><p> 
      Student id: <input id="studentId"><p> 
     </form> 
     <script src="dojo-release-1.12.2-src/dojo/dojo.js" data-dojo-config="async:true"></script> 
     <script type="text/javascript"> 
      require(["dojo/parser", "dijit/form/Button", "dojo/domReady!"], 
      function(parser){ 
       parser.parse(); 
      }); 
     </script> 
    </body> 
</html> 
+0

ありがとう!それはそんなにありますまた、NotePad ++では構文の強調表示が現れています。なぜなら、これはすべて大きな文字列になっているからです。私は、たくさんの例から少しずつコードを引っ張り続け、時には混乱で終わります。 – NealWalters

1
data-dojo-props="iconClass:'dijitIconTask' 

ありませんあなたは "で終わる必要がありますか?

data-dojo-props="iconClass:'dijitIconTask'" 

あなたはJSONの元を作成する方法をより良くすることができます。

var json={}; 
json.name="Test"; 
json.age="23" 

あなたはJSON(JSON.stringify(json))を印刷するとき、あなたは

{ 
    "name":"Test", 
    "age":"23" 
    } 
+0

私は右の 『更新』で、ボタンのテキストの前に>」を持っているが。JSON上 グレートポイントチップは、以下のことをしようとします! – NealWalters

関連する問題