Telerik MVC Grid - 排序停止 javascript

Question

我在 MVC3 中有一个使用 Telerik 网格的页面。在网格中，对于每一行，是一个我正在输入小数的文本框。我有一个 CSS 类，“HoursNew”，用于连接 jQuery 插件（autoNumeric.js）。我还有一个 onBlur 函数可以将任何十进制输入四舍五入到最接近的半小数。 问题是，在对一列进行排序后，所有 JavaScript 似乎都停止工作了。 autoNumeric.js 与我拥有的触发 onBlur 的函数一起停止工作。

    $(document).ready(function () {
    $('.HoursNew').autoNumeric({ pSign: 's', vMin: '-999.5', vMax: '999.5', mRound: 'C', aPad: false });
    $('.HoursNew').blur(function () { roundToHalf(this); });
});

            // Round decimal to nearest .5
            // v is input object
            function roundToHalf(v) {
                var value = v.value;
                var r;
                //alert(v.id);
                var converted = parseFloat(value); // Make sure we have a number
                var decimal = (converted - parseInt(converted, 10)); // Pull the decimal value
                decimal = Math.round(decimal * 10);
                if (decimal == 5) { return (parseInt(converted, 10) + 0.5); } // leave alone if .5
                if ((decimal < 3) || (decimal > 7)) {
                    r = Math.round(converted); // Round up or down to nearest whole number
                } else {
                    r = (parseInt(converted, 10) + 0.5); //round to .5
                }
                //alert(r);
                // reset input value to new value
                $('#' + v.id).val(r);
            }

页面在第一次加载时工作正常，只是在排序后出现这个问题。有什么建议吗？

Answer 1

我有一种预感，在排序时，网格会进行 ajax 调用，从而呈现一个新的网格。这意味着您在$(document).ready 中执行的任何绑定都将被删除。

查看Telerik documentation 中有关客户端事件的此页面。您需要将此部分添加到您的网格定义中：

.ClientEvents(events => events
    .OnDataBound("onDataBound")

这个 javascript 重新绑定：

function onDataBound(e) {
    $('.HoursNew').autoNumeric({ pSign: 's', vMin: '-999.5', vMax: '999.5', mRound: 'C', aPad: false });
    $('.HoursNew').blur(function () { roundToHalf(this); });

}