YUI 3通过按钮单击并填充文本框进行AJAX调用

时间:2011-11-08 11:25:22

标签: jquery asp.net-mvc ajax asp.net-mvc-3 yui

我正在使用ASP.NET MVC 3 Razor。我正在使用YUI 3.4.1

我有一个网页,上面有一个带文本框的按钮。当用户点击按钮时,我对数据库进行AJAX调用,然后文本框中填充了返回的数据(与此按钮位于同一页面上)。目前正在使用jQuery完成。下面是代码,我将如何使用YUI 3.4.1做同样的事情?我需要了解什么,是否有可用的样品?

以下是当前代码:

$('#btnPrepopulateEmployeeDetails').click(function () {
     var url = '/GrantApplication/GetEmployeeInfo';
     var data = { employeeNumber: $('#EmployeeNumber').val() };

     $.getJSON(url, data, function (data) {
          $('#Title').val(data.Title);
          $('#FirstName').val(data.NickName);
          $('#LastName').val(data.Surname);
          $('#BranchNumber').val(data.BranchID);
          $('#WorkTelephoneNumber').val(data.TellO);
          $('#CellphoneNumber').val(data.TellC);
     });
});

btnPrepopulateEmployeeDetails是按钮标记的ID。 Title thru CellphoneNumber是需要填充的所有文本框。

我感谢所有反馈:)

1 个答案:

答案 0 :(得分:4)

展示你到目前为止所尝试的内容以及遇到的困难本来不错。就样本而言,documentation非常丰富。我只想阅读。

反正:

Y.on('load', function (e) {
    Y.one('#btnPrepopulateEmployeeDetails').on('click', function (evt) {
        evt.preventDefault();
        var data = { employeeNumber: Y.one('#EmployeeNumber').get('value') };
        Y.io('/GrantApplication/GetEmployeeInfo', {
            method: 'GET',
            data: data,
            on: {
                success: function (id, result) {
                    var json = Y.JSON.parse(result.responseText);
                    Y.one('#Title').set('value', json.Title);
                    Y.one('#FirstName').set('value', json.NickName);
                    Y.one('#LastName').set('value', json.Surname);
                    Y.one('#BranchNumber').set('value', json.BranchID);
                    Y.one('#WorkTelephoneNumber').set('value', json.TellO);
                    Y.one('#CellphoneNumber').set('value', json.TellC);
                }
            }
        });
    });
});