2012-02-06 4 views
6

У меня возникли проблемы с использованием AJAX-связи, использующей фреймворк Bottle. Это мой первый раз, когда я использую AJAX, поэтому, скорее всего, я просто ошибаюсь. Надеюсь, гуру Бутылки/AJAX может указать этого новичка в правильном направлении. Вот код, который я использую:Форма представления AJAX с использованием бутылки (Python)

#!/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') 
+0

Я тестирую в Chrome, поэтому использование кода, специфичного для IE, не требуется - на случай, если кто-нибудь подумает об этом. – patrickn

ответ

4

Здесь есть несколько вопросов.

  1. Javascript чувствителен к регистру. XMLHTTPRequest должен быть XMLHttpRequest. Вы должны были увидеть ошибку об этом в своей консоли Javascript.
  2. onReadyStateChange должно быть onreadystatechange.
  3. Если вы исправите эти две проблемы, ваш вызов AJAX будет работать, но вы только когда-нибудь получите «Вы ничего не вводили». ответ. Это потому, что вы используете GET. Вам нужно изменить свой код, чтобы значения формы были опубликованы с использованием метода POST.

Кроме того, почему вы не используете jQuery для создания AJAX? Это сделало бы вашу жизнь намного легче. :)

+0

Спасибо, я знал, что это будет что-то простое. Что касается не использования jQuery - меня раздражает «магия» на этом этапе моей карьеры кодирования, и мне действительно нужно увидеть, как все работает, прежде чем я буду комфортно двигаться дальше. Следовательно, мое использование Бутылки (все еще много волшебства здесь, но минимальное). – patrickn

+1

Это хорошая причина не использовать jQuery (и Django). Удачи вам в проекте Bottle. Это забавная рамка для работы. – Alex

Смежные вопросы