Uncaught ReferenceError: variable is not defined on onclick function Javascript

Question

Today , i have been read all the topic about this but couldn't come up with a solution that's why i am opening this topic.

This is my function which creates the view and i am trying to have a onclick function which should directs to other javascript function where i change the textbox value.

<script type="text/javascript">
    $('#submitbtnamazon')
            .click(function(evt) {
                        var x = document.getElementById("term").value;

                        if (x == null || x == "" || x == "Enter Search Term") {
                            alert("Please, Enter The Search Term");
                            return false;
                        }
                        listItems = $('#trackList').find('ul').remove();
                        var searchTerm = $("#term").val();
                        var url = "clientid=Shazam&field-keywords="
                                + searchTerm
                                + "&type=TRACK&pagenumber=1&ie=UTF8";       

    jsRoutes.controllers.AmazonSearchController.amazonSearch(url)
                        .ajax({
                            success : function(xml) {
                                $('#trackList')
                                    .append('<ul data-role="listview"></ul>');
                                    listItems = $('#trackList').find('ul');
                                    html = ''

                                 tracks = xml.getElementsByTagName("track");
                                for(var i = 0; i < tracks.length; i++) {
                                    var track = tracks[i];
                                    var titles = track.getElementsByTagName("title");
                                    var artists = track.getElementsByTagName("creator");
                                    var albums =    track.getElementsByTagName("album");
                                    var images =    track.getElementsByTagName("image");
                                    var metaNodes = track.getElementsByTagName("meta");
                                     //trackId ="not found";

                                     trackIds = [];
                                                    for (var x = 0; x < metaNodes.length; x++) {
                                                        var name = metaNodes[x]
                                                                .getAttribute("rel");

                                                        if (name == "http://www.amazon.com/dmusic/ASIN") {
                                                            trackId = metaNodes[x].textContent;
                                                            trackIds.push(trackId);

                                                        }
                                                    }

                                                    for (var j = 0; j < titles.length; j++) {
                                                        var trackId=trackIds[j];
                                                        html += '<div class="span3">'
                                                        html += '<img src="' + images[j].childNodes[0].nodeValue + '"/>';
                                                        html += '<h6><a href="#" onclick="someFunction('
                                                            +trackId
                                                            + ')">'
                                                            +trackId
                                                            + '</a></h6>';
                                                        html += '<p><Strong>From Album:</strong>'
                                                                + albums[j].childNodes[0].nodeValue
                                                                + '</p>';
                                                        html += '<p><Strong>Artist Name:</strong>'
                                                                + artists[j].childNodes[0].nodeValue
                                                                + '</p>';
                                                        html += '<p><Strong>Title:</strong>'
                                                                + titles[j].childNodes[0].nodeValue
                                                                + '</p>';
                                                        /*html += '<p><Strong>Created:</strong>'
                                                                + releaseDate
                                                                + '</p>';*/
                                                        html += '</div>'
                                                    }
                                                }
                                                //listItems.append( html );
                                                $("#track").html(html);
                                                $("#track").dialog({
                                                    height : 'auto',
                                                    width : 'auto',
                                                    title : "Search Results"
                                                });
                                                // Need to refresh list after AJAX call
                                                $('#trackList ul').listview(
                                                        "refresh");
                                            }
                                        });
                    });
</script>

This is my other function where i change the textbox value. it works actually with other values e.g. when i give hardcoded string value. I can see the value in the console but for some reason it gives me the error like : here the string starts with B is AsinId where i take from amazon. I am definitely in need of help because i am totally stucked.

Uncaught ReferenceError: B00BMQRILU is not defined 62594001:1 onclick

<script type="text/javascript">

    function someFunction(var1) {
        tracktextbox = document.getElementsByName("trackId");
        for (var i = 0; i < tracktextbox.length; i++) {
            tracktextbox[i].value = var1;
        }
        $('#track').dialog('close');
    }

</script>

i am using play framework , so i tried but couldn't make it properly. jsfiddle.net/uCU8v — Ducaz035
– Ducaz035, Commented Dec 27, 2013 at 15:17

Arun P Johny · Accepted Answer · 2013-12-27 15:10:51Z

13

The problem is '<h6><a href="#" onclick="someFunction('+trackId+ ')">', from the error it is clear that trackId is a string value, so you need to enclose it within "" or ''. So try

'<h6><a href="#" onclick="someFunction(\'' + trackId + '\')">'

answered Dec 27, 2013 at 15:10

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

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

2 Comments

Ducaz035 Over a year ago

This works , thank you so much. i have been trying to find a solution for a day almost. ohh

JosephTLyons Over a year ago

I spent hours trying to figure this out and this solution worked flawlessly. Thank you.

Collectives™ on Stack Overflow

Uncaught ReferenceError: variable is not defined on onclick function Javascript

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related