How do I access an input field text with jQuery?

Question

I am trying to use the typeWatch plugin for jQuery. I have this javascript:

 <script type="text/javascript">
 $(document).ready(function() {
   var options = {
        callback: function() { alert("a-ok!  " + $(this).text); },
        wait: 333,
        highlight: true,
        captureLength: 1
    }

    $("#customer").typeWatch(options);
 });
 </script>

And my view's HTML has this:

 Method B: <%= Html.TextBox("customer") %>

With this test, if I type "ABC" in the textbox, I am expecting an alert to popup with "a-ok! ABC". Instead the following shows up...

a-ok!  function (F) {
    if (typeof F !== "object" && F != null) {
        return this.empty().append((this[0] && this[0].ownerDocument || 
               document).createTextNode(F));
    }
    var E = "";
    o.each(F || this, function () {o.each(this.childNodes, function () {
          if (this.nodeType != 8) {
             E += this.nodeType != 1 ? this.nodeValue : o.fn.text([this]);}});});
   return E;
}

I've tried changing the $(this).text to .val, and I've also tried referencing the input field more directly as $("#customer") but they yield similar results. How can I access just the entered text?

The reason you're getting back a text representation of the function is because you're not invoking the function using parens... text should be text***()*** — cgp
– cgp, Commented Jun 3, 2009 at 13:27

Ropstah · Accepted Answer · 2009-06-03 13:22:29Z

5

You should use the val() function on the textbox:

$(this).val();

answered Jun 3, 2009 at 13:22

Ropstah

17.9k27 gold badges123 silver badges199 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sailing Judo Over a year ago

I suspect this is generally the correct answer, but I couldn't get it to work for some reason. Since Lucas solved my problem he gets the answer, but +1 to this as well since its probably the correct answer 99% of the time.

Ropstah Over a year ago

You needed the Lucas the typeWatch specialist for this job ;). Hope you remember my -broader- tip: $(elem).val() not .text ! (works for every html inputfield) hehe

Lucas · Accepted Answer · 2009-06-03 13:38:49Z

1

Looking the code of typeWatch version 2.0 I found this:

    function checkElement(timer, override) {
        var elTxt = jQuery(timer.el).val(); <----------- !!! this...

        // Fire if text > options.captureLength AND text != saved txt OR if override AND text > options.captureLength
        if ((elTxt.length > options.captureLength && elTxt.toUpperCase() != timer.text) 
        || (override && elTxt.length > options.captureLength)) {
            timer.text = elTxt.toUpperCase();
            timer.cb(elTxt); <-------------- !!! ...goes here.
        }
    };

timer.cb is the callback that you set up in the options. So you just add a parameter in that callback function that you use and that parameter will be the text from the input.

answered Jun 3, 2009 at 13:38

Lucas

3391 silver badge4 bronze badges

1 Comment

Sailing Judo Over a year ago

sweet! thanks! i kept trying different variations of the other answer since 4 people upvoted it quickly but nothing was working. this worked like a charm.

Collectives™ on Stack Overflow

How do I access an input field text with jQuery?

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related