6

Bottle フレームワークを使用して AJAX 通信を機能させる際に問題が発生しています。AJAX を使用するのはこれが初めてなので、基本が間違っている可能性があります。うまくいけば、Bottle/AJAX の第一人者がこの初心者を正しい方向に向けることができます。私が使用しているコードは次のとおりです。

#!/usr/bin/env python

from bottle import route, request, run, get


# Form constructor route

@route('/form')
def construct_form():
    return '''

<html>
<head>
<script type="text/javascript">

    function loadXMLDoc()
    {
        xmlhttp = new XMLHTTPRequest();
        xmlhttp.onReadyStateChange = function()
        {
            if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
            {
                document.getElementById("responseDiv").innerHTML = xmlhttp.responseText;
            }
        }

    xmlhttp.open("GET", "/ajax", true);
    xmlhttp.send();
    }   

</script>
</head>

<body>

    <form>
        <input name="username" type="text"/>
        <input type="button" value="Submit" onclick="loadXMLDoc()"/>
    </form>
    <div id="responseDiv">Change this text to what you type in the box above.</div>

</body>
</html> 

    '''

# Server response generator

@route('/ajax', method='GET')
def ajaxtest():
    inputname = request.forms.username
    if inputname:
        return 'You typed %s.' % (inputname)
    return "You didn't type anything."

run(host = 'localhost', port = '8080')
4

1 に答える 1

4

ここにはいくつかの問題があります。

  1. Javascript は大文字と小文字を区別します。 XMLHTTPRequestはXMLHttpRequestである必要があります。Javascript コンソールでこれに関するエラーが表示されているはずです。
  2. onReadyStateChangeはonreadystatechangeである必要があります。
  3. 上記の 2 つの問題を修正すると、AJAX 呼び出しは機能しますが、「何も入力しませんでした」というメッセージしか表示されません。応答。これは、GET を使用しているためです。POST メソッドを使用してフォームの値がポストされるように、コードを変更する必要があります。

また、なぜ jQuery を使用して AJAX を実行しないのですか? それはあなたの人生をずっと楽にするでしょう。:)

于 2012-02-06T21:52:43.587 に答える