提交表单时复选框被选中 - 教程 [英] Submit form when checkbox is checked - tutorial

问题描述

我想达到的效果相似，37Signals的'​​当当名单 - 我希望我的用户能够检查关，从列表中的项目只是通过检查完成对话框 - 换句话说形式被提交对检查中的服务器。有谁知道一个教程，涵盖这样的事情，或者可以点我在正确的方向？

I'm trying to achieve an effect similar to 37signals' ta-da list - I want my users to be able to check off items from a list just by checking a "done" box - in other words a form gets submitted to the server on checking the box. Does anyone know of a tutorial which covers something like this, or could point me in the right direction?

谢谢 罗布

推荐答案

如果我正确地理解你的问题：

If I understand your question correctly:

您可以做到这一点使用 jQuery的和的 AJAX 。在第一个例子，我做这件事而不提交整个形式，只有提交复选框的值：

You could accomplish this using jQuery and AJAX. In the first example I'm doing it without submitting the whole form, and only submitting the value of the checkbox:

jQuery("#myCheckbox").click(function() {
   var $checkbox = jQuery(this);
   var checkboxData = "checkboxvalue=" + $checkbox.val();

   jQuery.ajax({
      url: "http://some.url.here",
      type: "POST",
      data: checkboxData,
      cache: false,
      dataType: "json",
      success: function(data) {
          if(data["success"]) {
            //do some other stuff if you have to
            //this is based on the assumption that you're sending back
            //JSON data that has a success property defined
          }
      }
   });
});

presumably你有东西在服务器端处理后。

Presumably you'd have something on the server-side that handles the post.

如果你真正的不的要提交表单，你可以做同样的事情上面，除非你序列化表单数据：

If you actually do want to submit a form, you can do the same thing as above, except you'd serialize the form data:

jQuery("#myCheckbox").click(function() {
   var formData = jQuery("#formID").serialize();

   jQuery.ajax({
      url: "http://some.url.here",
      type: "POST",
      data: formData,
      cache: false,
      dataType: "json",
      success: function(data) {
          if(data["success"]) {
            //do some other stuff if you have to
            //this is based on the assumption that you're sending back
            //JSON data that has a success property defined
          }
      }
   });
});

这篇关于提交表单时复选框被选中 - 教程的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！