Thursday, January 27, 2011

How to make enter key to cause postback in asp.net webform textbox by JQuery

How to make enter key to cause postback in asp.net webform textbox by JQuery

Need call doPostBack in asp.net webforms.
$('#<%=TextBox.ClientID %>').keypress(function (event) {
if (event.which == '13') {
__doPostBack('<%= TextBox.ClientID%>', '');
}
});

How to implement timer event handler in Javascript?

window.setInterval(yourfunction, 10000);
function yourfunction() { alert('test'); }

How to implement TextChanged event handler in JQuery

There is no TextChanged Textbox event handler in Javascript.
Following event handler can handle: Keyup, Copy, Paste and Cut


(function (a) {
    a.event.special.textchange = {
        setup: function () {
            a(this).data("lastValue", this.contentEditable === "true" ? a(this).html() : a(this).val());
            a(this).bind("keyup.textchange", a.event.special.textchange.handler);
            a(this).bind("cut.textchange paste.textchange input.textchange", a.event.special.textchange.delayedHandler)
        },
        teardown: function () {
            a(this).unbind(".textchange")
        },
        handler: function () {
            a.event.special.textchange.triggerIfChanged(a(this))
        },
        delayedHandler: function () {
            var b = a(this);
            setTimeout(function () {
                a.event.special.textchange.triggerIfChanged(b)
            },
            25)
        },
        triggerIfChanged: function (b) {
            var c = b[0].contentEditable === "true" ? b.html() : b.val();
            if (c !== b.data("lastValue")) {
                b.trigger("textchange", b.data("lastValue"));
                b.data("lastValue", c)
            }
        }
    };
    a.event.special.hastext = {
        setup: function () {
            a(this).bind("textchange", a.event.special.hastext.handler)
        },
        teardown: function () {
            a(this).unbind("textchange", a.event.special.hastext.handler)
        },
        handler: function (b, c) {
            c === "" && c !== a(this).val() && a(this).trigger("hastext")
        }
    };
    a.event.special.notext = {
        setup: function () {
            a(this).bind("textchange",
            a.event.special.notext.handler)
        },
        teardown: function () {
            a(this).unbind("textchange", a.event.special.notext.handler)
        },
        handler: function (b, c) {
            a(this).val() === "" && a(this).val() !== c && a(this).trigger("notext")
        }
    }
})(jQuery);
  



Usage:




    $("#textboxid").bind('textchange', function (event, previousText) {

        var textboxContent = $("#textboxid").val();

        if (textboxContent == "" || textboxContent == "default value") {

            $("#buttonid").addClass('disabled').attr('disabled', true);

        } else {

            $("#buttonid").addClass('disabled').attr('disabled', false);

        }

    });





Reference:


http://www.zurb.com/playground/jquery-text-change-custom-event