Question

i was trying to organize my jquery code so i created an object literal, but now the focusTextArea is not working and my textarea value is not updating.

Thanks for your help.

html

<textarea id="test"></textarea>​

---

javascript

(function($,window,document,undefined){

    var TEX = {

        inputField: $("textarea#test"),

        /* Init all functions */
        init: function()
        {
            this.focusTextArea();
        },

        /* Function update textarea */
        focusTextArea:  function()
        {
            this.inputField.text('test');
        },
    }

    $(document).ready(function(){
        TEX.init();
    });

})(jQuery,window,document);​

---

jsfiddle
http://jsfiddle.net/vBvZ8/1/

Answer 1

First of all, you haven’t included jQuery correctly in the fiddle. Also, I think you mean to place the code in the head of the document (because of the document.ready handler).

More importantly perhaps the selector $("textarea#test") is run before the document is ready and therefore won’t actually find the element correctly. I would recommend assigning inputField in TEX.init:

(function($,window,document,undefined){

    var TEX = {

        /* Init all functions */
        init: function()
        {
            this.inputField = $("#test");
            this.focusTextArea();
        },

        /* Function update textarea */
        focusTextArea:  function()
        {
            this.inputField.text('test');
        },
    }

    $(document).ready(function(){
        TEX.init();
    });

})(jQuery,window,document);​

Updated example: http://jsfiddle.net/xntA2/1/

As a side note, textarea#test should be changed to just #test. The textarea bit is superfluous since there should be only one element on the page with id=test.