如何为谷歌应用引擎制作切换按钮

Question

我正在尝试制作一个用于添加朋友的切换按钮（例如在 snapchat 中）。

现在我的 html 使用复选框和提交按钮

{% for u in u %}
    {{u.name}} <input type="checkbox" name = "checkbox" value="{{u.name}}">
{% endfor %}

如果提交复选框，则将用户添加为朋友。我查看了 jQuery 文档，唯一的切换功能是隐藏和显示以及操作动画。

帮助？

编辑： 我尝试将 AJAX 插入包含 foo 的测试文件（我的初学者代码裸露），这样当我选中复选框时，AJAX 会通过 post 方法将“foo”发送到服务器......但是当我检查时没有任何反应复选框。

<form method = "post">
Foo <input type="checkbox" onclick = "toggle();" class = "login_button" name = "checkbox" value="Foo">
</form>

<script  src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>

<script type="text/javascript" language="javascript">
    function toggle() {
        var xmlhttp=new XMLHttpRequest();
        xmlhttp.onreadystatechange=function() {

        //when server is ready
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
          var value = document.getElementsByName('checkbox')
        }
      }
      xmlhttp.open("POST","/test",true);
      xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
      xmlhttp.send("value=" + value);

    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open("GET", "/test", true);
    xmlHttp.addEventListener("load", ajaxCallback, false);
    xmlHttp.send(null);

    function ajaxCallback(event){
    alert( "Your file contains the text: " + event.target.responseText );
    }
    }


  </script>
</form> 

当我想用“foo”作为值创建一个新的TestModel实例时，我有

class TestModel(db.Model):
    value = db.StringProperty(required = True)

和

class Test(Handler):
    def get(self):
        if self.user:
            values = TestModel.all()
            self.render("ajaxtest.html", values = values)
        else:
            self.redirect("/signup")

    def post(self):
        value = self.request.get('checkbox')
        if value:
            value = TestModel(value = value)
            value.put()
            self.write("success")

Answer 1

您的问题与Google App Engine 关系不大。您可能想要的是，通过查看您的代码 sn-p，一个 HTML 模板构造具有一个表示某人是朋友的复选框。

类似于（以您的 sn-p 为出发点，未经测试）：

{% for u in u %}
    {{ u.name }}
    {% if u.is_friend() %}
        <input type="checkbox" id="checkbox-{{ u.pk }}" checked="checked">
    {% else %}
        <input type="checkbox" id="checkbox-{{ u.pk }}">
    {% endif %}
{% endfor %}

以上只是一种可能的解决方案。可行的解决方案有无数种可能性，但您的问题必须更加具体。

显然，一旦提交表单，您将不得不进行进一步处理，以检查用户是否与您命名为“u”的任何实例加好友或取消加好友，但我让您自己想象。