Question

以下代码尝试首先显示以前的评论，然后点击提交按钮，通过显示较新的评论进行刷新。

第二个AJax调用正常。但第一个Ajax调用什么都不做（'/ show'是一个有效的请求 - 第一个调用'/ comment'调用'/ show'）

这是我的代码段：

<script>
   $(document).ready(function() {
        var source   = $("#login_template");
        var srcHTML =source.html();
        var login_template = Handlebars.compile(srcHTML);
        source   = $("#comment_template");
        srcHTML =source.html();
        var comment_template = Handlebars.compile(srcHTML);
        // First time call to server to get the comments
        $.ajax({ // ajax call starts
            type: "post",
            url: "/show", 
            contentType: 'application/json',
            success: function(data,textStatus,jqXHR) 
            {
              data = JSON.parse(data);
              var html = login_template(data);
              $("#login_content").html(html);
              html = comment_template(data);
              $("#comment_content").html(html);
            }
         });        

        $("#comment_button").click(function(event) {
          $.ajax({ // ajax call to send comment to server and refresh with newer comment
            type: "post",
            url: "/comment", 
            contentType: 'application/json',
            data:  JSON.stringify(
                {
                  'source' : source.value,
                  'comment': comment.value,
                }),
            success: function(data,textStatus,jqXHR) 
            {
              data = JSON.parse(data);
              var html = login_template(data);
              $("#login_content").html(html);
              html = comment_template(data);
              $("#comment_content").html(html);
            }
         });        
      });
   });
 </script>

提前致谢

Answer 1

是的，我在成功块中执行了console.log / alert，它似乎没有到达那里。如您所见，两个ajax功能几乎相同。第一个使服务器调用'show'，第二个调用服务器调用'comment'，然后在处理'comment'后重定向到服务器调用'show'。第二个ajax调用工作正常。

这是我的车把模板代码：

 <script id="login_template" type="text/x-handlebars-template">
          logout={{logout}}
          login={{login}}
          {{#if user}}
            {{user.nickname}}!  
            [<a href="{{logout}}"><b>sign out</b></a>]
          {{else}}
            Guest  
            [<a href="{{login}}"><b>sign in</b></a>]
          {{/if}}
    </script>

    <script id ="comment_template" type="text/x-handlebars-template"> 
        <h2>Top 10 Most Recent Guestbook Entries</h2>
          no of greetings {{greetings.length}}
          {{#each greetings}}
             greetings!
            <br>
              <small>[<i>{{date.ctime}}</i>]</small>
              <b>
              {{#if author }}
                <code>{{author.nickname}}</code>
              {{else}}
                <i>anonymous</i>
              {{/if}}
              </b>
              wrote:
              {{comment}}
          {{/each}}
    </script>

这是我在HTML正文中的DOM元素：

  <div id="login_content"></div>
  <div id="comment_content"></div>

这是服务器代码：

class ShowComment(webapp2.RequestHandler):
     def get(self):
        user = users.get_current_user()
        greetings = Greeting.all().order('-date').fetch(10)
        results = {
            'user':      user,
            'greetings': greetings,
            'login':     users.create_login_url(self.request.uri),
            'logout':    users.create_logout_url(self.request.uri),
        }
        self.response.headers['Content-Type'] = 'application/json'
        self.response.out.write( JSONUtils.GqlEncoder().encode(results) )

class Guestbook(webapp2.RequestHandler):
  def post(self):
    Jguest_data = json.loads(self.request.body) 
    greeting = Greeting()
    for gb_name,gb_comment in Jguest_data.iteritems():

        user = users.get_current_user()
        if user:
           greeting.author = user
        greeting.content = gb_comment
        greeting.put()
        self.redirect('/show')

app = webapp2.WSGIApplication([('/', MainPage),
                              ('/comment', Guestbook),
                              ('/show',ShowComment)
                               ],
                              debug=True)

非常感谢。

AJAX - 使用Handlebars进行首次刷新

1 个答案: