フォーム送信と同様にajaxを使用してPOSTを行う方法は？

Ajaxを使用して私のpython（Google App Engine）サーバーにPOSTリクエストを送信しようとしていますが、これはフォームの送信と同じ方法ですが、機能しません。フォーム送信と同様にajaxを使用してPOSTを行う方法は？

これは私のHTMLです：

<!DOCTYPE html> 

<html> 
<head> 
<title>Test</title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script> 
</head> 
<body> 
    <button>apple</button> 
    <form method="POST" action="/"> 
    <input name="url" value="value1" id="urlimg"> 
    <br> 
    <input class="myButton" type="submit" value="FIND OUT" id="submit_button"> 
    </form> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     $('button').click(function() { 
      $.post('/', { url: 'value1'}); 
     }); 
    }); 
    </script> 
</body> 
</html>

そして、これは私のPythonコードです：

import os 
import webapp2 
import jinja2 
import urllib2 as urllib 

template_dir = os.path.join(os.path.dirname(__file__), '') 
jinja_env = jinja2.Environment(loader = jinja2.FileSystemLoader(template_dir), 
          autoescape = True) 

class Handler(webapp2.RequestHandler): 
    def write(self,*a,**kw): 
     self.response.write(*a,**kw) 

    def render_str(self,template,**params): 
     t = jinja_env.get_template(template) 
     return t.render(params) 

    def render(self,template,**kw): 
     self.write(self.render_str(template,**kw)) 

class MainHandler(Handler): 
    def get(self): 
     self.render('image.html') 
    def post(self): 
     url = self.request.get('url') 
     self.response.write(url + ' is your url') 
app = webapp2.WSGIApplication([ 
('/', MainHandler) 
], debug=True)

出典

2016-08-20 pavitran

あなたは何が起こると思いますか？ – masnun

「それは機能していません」とはどういう意味ですか？ –

私は上記のフォームを提出すると、画面上の入力が表示されますが、スクリプトを使用して投稿を送信すると、何もしません。 – pavitran

あなたはJSONオブジェクトとして応答を返す必要があります：

class MainHandler(Handler): 
    def get(self): 
     self.render('image.html') 
    def post(self): 
     import json 

     url = self.request.get('url') 

     response_dict = { 
      'message': 'Yay, I did it!', 
      'url': url + ' is your url', 
     } 

     self.response.headers['Content-Type'] = 'application/json' 
     self.response.out.write(json.dumps(response_dict))

とハンドルあなたのテンプレートのレスポンス：

$("button").click(function(){ 
    $.post("/", { url: $('#urlimg').val()}, function(data, status){ 
     alert("message: " + data.message + "\nURL: " + data.url + "\nStatus: " + status); 
    }); 
});

出典

2016-08-22 02:11:21 GAEfan

フォーム送信と同様にajaxを使用してPOSTを行う方法は？

答えて

関連する問題