1

I have several text boxes which I can associate only at run time with their unique ID's. I am trying to see if I can bind events to each of these text boxes (Create multiple bind events for the text box for which the ID is being passed through the array) at run time but this code does not work as I intended it to. The bind event does not fire when the text boxes are being typed in. Does anybody have any suggestion as to how this can be done.

    //Populate the Name field with values from First name, Middle Initial,  and Last name when they change
    for (i = 0; i < strNameVariable.length; i++) 
    {
        if (strNameVariable[i] != '')
        {
            var strFN = strNameVariable[i] + 'firstName'
            var strMI = strNameVariable[i] + 'middleInitial'
            var strLN = strNameVariable[i] + 'lastName'


            $('#'+ strFN).bind('input', function () 
            {
                var nameArray = [$('#'+ strFN).val(), $('#'+ strMI).val(), $('#'+ strLN).val()];
                $('#'+ strN).val(nameArray.join(' '));
            });
        }

    }
sheeth
  • 11
  • 2
  • What is "input" event? – zim32 Mar 06 '15 at 22:34
  • I think you need to do on() function when binding dynamic items http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements – creativereason Mar 06 '15 at 22:35
  • And as mentioned by @zim32, you need a different event. Change, Blur, etc – creativereason Mar 06 '15 at 22:36
  • @zim32 [`"input"`](https://developer.mozilla.org/en-US/docs/Web/Events/input) is an HTML5 event, it will fire (in modern browsers) when the input value changes. – Mottie Mar 06 '15 at 22:37
  • @sheeth I think you just need to bind to all three: `$('#'+ strFN + ',#' + strMI + ',#' + strLN).bind('input', ...` – Mottie Mar 06 '15 at 22:39
  • @Mottie - I was just trying to see if it will first fire for the text box with ID strFN and then was going to tackle the other 2 fields. Since its not firing for strFN I did not add code for the other 2 for now. – sheeth Mar 06 '15 at 22:51
  • Try using `change` instead then, or if you want to update the value dynamically, use `keyup`. – Mottie Mar 06 '15 at 22:54
  • There is no "input" event in jquery http://api.jquery.com/category/events/ – zim32 Mar 06 '15 at 22:56
  • And guys, what do you mean "runtime" when you are talking about javascrit? Does JS have compile time, link time, etc?? – zim32 Mar 06 '15 at 23:04
  • @zim32 that is a DOM level 3 event, it has nothing to do with jQuery; but you can bind to it using jQuery ([demo](http://jsfiddle.net/Mottie/0u1uLztt/)) – Mottie Mar 06 '15 at 23:05
  • sheeth, is your code wrapped in a document ready function? @zim32 it just means when the javascript is run. – Mottie Mar 06 '15 at 23:06
  • @Mottie - Yes! It is wrapped in document.ready function. I found the issue. It was not with this piece of code. This code works fine. The strFN that was being passed from the array had ID's with dots in them. So I had to pass them in with \\ Its working now. Thanks for all your inputs. – sheeth Mar 06 '15 at 23:41

0 Answers0