1

I'm trying to iterate through a list of input boxes so that they activate a JQuery autocomplete function whenever the input is changed. Here is the relevant code:

for(i=0;i<30;i++)
        {
                $("#_Q6_Q" + i + "_Q3_C").change(transportChange($("#_Q6_Q" + i +"_Q3_C").value(), i));
        };

However I get this error:

TypeError: ($("#_Q6_Q" + i) + "_Q3_C").value is not a function.

I have no idea what to do to fix this.

Edit 1: I added the $ to the function arguments, which hasn't solved the issue (it was there before).

Doing some digging around led me to try and remove the () from .value(). the function now passes through without an error. However it also doesn't do anything. The code now looks like this:

for(i=0;i<30;i++)
        {
                $("#_Q6_Q" + i + "_Q3_C").change(transportChange($("#_Q6_Q" + i +"_Q3_C").value(), i));
        };
NDevox
  • 4,056
  • 4
  • 21
  • 36
  • I think you're just missing a `$` from there – Jani Hartikainen Jan 02 '14 at 16:23
  • you forgot the $ before `("#_Q6_Q" + i) + "_Q3_C")`... – Akaryatrh Jan 02 '14 at 16:24
  • I took it out in the hopes that was the issue. Obviously not though. I'll put it back in but it wasn't working before either – NDevox Jan 02 '14 at 16:28
  • What madness is this! Please clean up your code. Magic numbers like `30` and element id's like `_Q6_65_Q3_C` are not cool. How is anyone other than you supposed to know what is going on in your code? – Fresheyeball Jan 02 '14 at 16:32
  • I hate them too. I don't make the id's another programme renders the HTML for me. - That said I agree and will keep it simpler for future, I'll just check if the latest improvement works before seeing if I need to clean it up – NDevox Jan 02 '14 at 16:42

5 Answers5

2

I think you might mean:

$(("#_Q6_Q" + i) + "_Q3_C")

So it'd be

$("#_Q6_Q" + i + "_Q3_C").change(transportChange($("#_Q6_Q" + i +"_Q3_C").value(), i));
Khaled Hamdy
  • 378
  • 2
  • 10
2

I thhink you are missing your jQuery function caller ($). Also, if you are getting the value of a jQuery collection, the method is val() - value is the property of a DOM element:

$("#_Q6_Q" + i + "_Q3_C").change(transportChange($("#_Q6_Q" + i +"_Q3_C").val(), i));
                                                 ^
                                             just here

Getting the value of the DOM element could be done like so:

$("#_Q6_Q" + i + "_Q3_C").change(transportChange($("#_Q6_Q" + i +"_Q3_C").get(0).value, i));

Yet another edit

I've just realised, you need an anonymous function within that change() method:

$("#_Q6_Q" + i + "_Q3_C").change(function(){
    transportChange($("#_Q6_Q" + i +"_Q3_C").val(), i)
});

Otherwise the function is called when the event is attached, not when it is triggered. Good luck.

George
  • 36,413
  • 9
  • 66
  • 103
  • I had it in before I put the code up but still got the same error. Put it back in as obviously it would be causing another error – NDevox Jan 02 '14 at 16:31
  • I changed it to something completely different but saw that part now so will try it. – NDevox Jan 02 '14 at 16:35
  • Do you two know if you can help solve my next problem in that my function won't be called when I change the input? that should be the final step. – NDevox Jan 02 '14 at 16:53
  • Didn't go through so it's still not working. Does placement of the code matter? – NDevox Jan 02 '14 at 17:07
2

("#_Q6_Q" + i) is a String, so (("#_Q6_Q" + i) + "_Q3_C") is a String, and so this code is trying to access 'string'.value which is undefined, so you're attempting to do undefined() which will throw an error.

Perhaps you meant to pass the string into jQuery first.

Paul S.
  • 64,864
  • 9
  • 122
  • 138
2

You are not calling any function. If .value() is something that should come out of transportChange, then you have to change your brackets into something like this:

transportChange("#_Q6_Q" + i +"_Q3_C").value()

Or Maybe you are just missing the $ function (jquery), so maybe you should turn code into this:

transportChange($("#_Q6_Q" + i +"_Q3_C").value(), i)

We can't understand it exactly by your code.

Francesco Belladonna
  • 11,361
  • 12
  • 77
  • 147
2

value is a property on the DOM element - you are working with a jQuery object so the function you are probably looking for is: $('#id').val() - Alternatively you could reference the native element directly by using: $('#id')[0].value

Emissary
  • 9,954
  • 8
  • 54
  • 65
  • This sounds like it could be the issue. I'll run the code and see what happens – NDevox Jan 02 '14 at 16:36
  • It worked! perfect thanks. But it won't update when I change the input. any idea? – NDevox Jan 02 '14 at 16:45
  • @Scironic different `input` types respond better to different events - for example `change` is contextually appropriate for `select` boxes but only fired on text inputs after the element loses focus. In that case you would usually use the `keyup` event instead. – Emissary Jan 02 '14 at 16:53
  • I'm using a dropdown list at the moment – NDevox Jan 02 '14 at 16:56
  • @all if `transportChange` ***isn't*** a factory then yes that could also be an issue - but you did say it worked once? Perhaps you'd be better off posing it as a new question with a more relevant example. – Emissary Jan 02 '14 at 16:58
  • So what would be the solution? All I've got are dead-ends. – NDevox Jan 02 '14 at 17:09
  • @Scironic I don't know, there isn't enough information to go on - we don't know what the `transportChange` function is supposed to do. In any case this kind of extending of the original question through commentary doesn't work well on a Q&A site - it sounds like a different issue so can you post a new question that is more specific to that issue - ideally with an extract of code that we can actually work with that demonstrates the problem? – Emissary Jan 02 '14 at 17:16
  • http://stackoverflow.com/questions/20888303/activating-a-function-on-selecting-an-option-from-a-dropdownlist – NDevox Jan 02 '14 at 17:30