Dojo - 按钮单击时request.post - 语法错误

时间:2017-08-02 20:54:47

标签: javascript node.js ajax dojo

三个问题: 1)有没有办法让这个代码更整洁?主要是为了避免在引号问题中嵌套和引用这么多? 2)以下有关解析错误的任何建议。我分别测试了一些代码以确保它有效。 (见下面的第二个代码框)。 3)当我查看处理此请求的NodeJS服务器程序中的request.body时,我得到“未定义”。根据我的阅读,如果content-type设置为application / json,我不需要身体解析器。

<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

2 个答案:

答案 0 :(得分:1)

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

你不需要以&#34;?

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

您可以更好地创建JSON ex:

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

当你打印json(JSON.stringify(json))时,你会看到

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

答案 1 :(得分:1)

在引号问题中避免引号的方法是在<script></script>代码中包含onClick javascript代码。

在我的环境中正常运行的代码的修改版本下面。该请求会激活错误回调,因为我没有服务器处理方。

请参阅文档here以获取声明性详细信息(使用data-dojo-event),并查看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>