4

AJAX 是否有任何标准或消息传递框架？

现在我有一个使用 Ajax 加载内容的页面。因为我的内容中有一个复杂的数据输入表单，所以我需要验证表单中可能发生的某些事件。因此，经过我的测试驱动的一些调整后：

asyncShould("search customer list click", 3, function() {
    stop(1000);
    $('#content').show();
    var forCustomerList = newCustomerListRequest();
    var forShipAndCharge = newShipAndChargeRequest(forCustomerList);

    forCustomerList.page = '../../vt/' + forCustomerList.page;
    forShipAndCharge.page = 'helpers/helper.php';
    forShipAndCharge.data = { 'action': 'shipAndCharge', 'DB': '11001' };

    var originalComplete = forShipAndCharge.complete;

    forShipAndCharge.complete = function(xhr, status) {
        originalComplete(xhr, status);
        ok($('#customer_edit').is(":visible"), 'Shows customer editor');
        $('#search').click();
        ok($('#customer_list').is(":visible"), 'Shows customer list');
        ok($('#customer_edit').is(":hidden"), 'Does not show customer editor');
        start();
    };

    testController.getContent(forShipAndCharge);
});

这是获取内容的控制器：

    getContent: function (request) {
        $.ajax({
            type:       'GET',
            url:        request.page,
            dataType:   'json',
            data:       request.data,
            async:      request.async,
            success:    request.success,
            complete:   request.complete
        });
    },

这是请求事件：

function newShipAndChargeRequest(serverRequest) {
var that = {
    serverRequest: serverRequest,
    page: 'nodes/orders/sc.php',
    data: 'customer_id=-1',
    complete: errorHandler,
    success: function(msg) {
        shipAndChargeHandler(msg);
        initWhenCustomer(that.serverRequest);
    },
    async: true
};
return that;

}

这是一个成功处理程序：

function shipAndChargeHandler(msg) {
    $('.contentContainer').html(msg.html);
    if (msg.status == 'flash') {
        flash(msg.flash);
    }
}

在我的服务器端，我最终得到了一个如下所示的 JSON 结构：

$message['status'] = 'success';
$message['data'] = array();
$message['flash'] = '';
$message['html'] = '';
echo json_encode($message);

所以现在加载内容由两部分组成：

  • HTML，这是表单的呈现方式。
  • DATA，这是需要为表单加载的任何数据
  • FLASH，任何验证或服务器错误
  • STATUS 告诉客户端服务器上发生了什么。

我的问题是：这是在客户端处理事件消息的有效方法，还是我会走上心痛和痛苦的道路？

4

4 回答 4

2

OpenAjax Hub （来自OpenAjax Alliance）指定了一个基于发布/订阅的事件中心（主题总线）。查看开源参考实现： http: //openajaxallianc.sourceforge.net/。

TIBCO 还有一个用 JavaScript 实现的称为PageBus的事件总线，但我想上面的内容更“标准”。

于 2010-05-29T17:23:25.457 回答
2

我认为这值得一看http://www.jboss.org/errai

于 2010-05-26T15:13:08.017 回答
1

我会投票支持@dan-heberden 的建议：使用 api.jquery.com/ajaxComplete 或 api.jquery.com/ajaxSucces，例如以下使用 jquery 处理 ajax 事件。

$('.contentContainer').ajaxSuccess(function(e, xhr, settings) {
  var msg.html = "<p>You did it!</p>";
  shipAndChargeHandler(msg);
});

我相信你的问题不需要框架，接受 jquery 本身。

于 2010-05-31T19:13:43.227 回答
1

为什么你想通过从头开始构建一个 msg 处理程序来走上一条心痛和痛苦的道路？如果你已经在使用像 jQuery 这样的 js 库，当然，你有一套完整的锐化刀片，比如Global Ajax Event Handlers和一个像Theme Roller这样的 css 库来为你的消息设置样式！？

正如其他 SO 伙伴已经提到的那样：这来自 jQuery 页面：

当 Ajax 请求成功完成时显示一条消息。

$("#msg").ajaxSuccess(function(evt, request, settings){
      $(this).append("<li>Successful Request!</li>");
      });

然后，我能做的，也许是指点你更好地使用这个工具：

由于您不是在寻找典型的 AJAX 错误，但您想将其用于表单验证目的，我建议您使用以下内容：

$.ajaxComplete(function(event, xhr, options) {
    var data = xhr.responceText;
    switch(data) {
    case 'err_1': 
    // do_something(1)
    break;
    case 'err_2': 
    // do_something(2)
    break;
    case 'err_3': 
    // do_something(3)
    break; 
    }
});

在您验证所有数据后，每个err_#来自后端，如果发现错误，您通过 ajax 发送代码错误，剩下的就是糖！;)

PS：通过这样做，如果禁用了javascript，您也可以防止滥用！

于 2010-06-01T11:06:08.423 回答