如何将JSON用于错误类

时间:2009-05-22 02:11:25

标签: javascript jquery

嘿所有人。我很幸运能让Paolo帮我一个jquery代码,如果数据被保存或没有保存到数据库中,它会向最终用户显示错误消息。我正在查看代码,我的想象力正在疯狂,因为我想知道我是否可以只使用那一段代码并将选择器类型导入其中,然后将整个json脚本包含到我的文档中。这将使我不必将json脚本包含在10个不同的文档中。希望我在这里有意义。

$('#add_customer_form').submit(function() { // handle form submit

“add_customer_form”id是我想要在每页上更改的内容。如果我能成功地做到这一点,那么我可以创建一个类,只使用这个json脚本的其余部分并将其包含在我需要的地方。我相信有人已经想过这个,所以我想知道是否有人可以给我一些指示。

谢谢!


好吧,我可以说是撞墙了。下面的代码是我的表单中已有的代码。它使用的是datastring数据类型,但我需要json。我该怎么办?我想用漂亮的100%宽绿色div替换愚蠢的警报框,我的服务器说这一切都没问题。

$.ajax({
  type: "POST",
  url: "body.php?action=admCustomer",
  data: dataString,
  success: function(){
    $('#contact input[type=text]').val('');
    alert( "Success! Data Saved");
  }
 });

2 个答案:

答案 0 :(得分:2)

以下是我在last question中使用的代码,减去了评论:

$(function() {
    $('#add_customer_form').submit(function() {
        var data = $(this).serialize();
        var url = $(this).attr('action');
        var method = $(this).attr('method');
        $.ajax({
            url: url,
            type: method,
            data: data,
            dataType: 'json',
            success: function(data) {
                var $div = $('<div>').attr('id', 'message').html(data.message);
                if(data.success == 0) {
                    $div.addClass('error');
                } else {
                    $div.addClass('success');
                }
                $('body').append($div);
            }
        });
        return false;
    });
});

如果我是对的,那么您基本上要问的是如何使这段代码适用于多个表单,而无需编辑选择器。这很容易。只要您在每个包含表单的页面中都包含上述代码,您就可以将$('#add_customer_form')部分更改为$('form.json_response')之类的内容。有了这个选择器,我们基本上告诉jQuery“任何带有json_response类的表单都应该通过这个提交函数来处理” - 我正在使用的特定类在这里不相关,关键是你使用了一个类并给出了它应该具有所有应具有该功能的表单。请记住,jQuery适用于对象的。我最初拥有它的方式恰好是1个元素,但每个jQuery函数都意味着对匹配的元素进行操作。这样,无论何时创建要通过AJAX处理的表单(并且您知道服务器将返回带有成功指示符的JSON响应),您只需添加您选择的任何类,jQuery代码将接管并处理它你。

还有一种cleaner plugin可以做到这一点,但上面也很好。

答案 1 :(得分:2)

根据您的问题,我认为您想要的是一个jQuery选择器,它将在您的每个页面上选择正确的表单。如果您为它们提供了一致的类,则可以在每个页面上使用相同的代码:

HTML

<form id="some_form_name" class="AJAX_form"> ... </form>

选择器:

$('form.AJAX_form")