Question

I have a function that searches a database table via ajax.
This is the function

function find_file(query)
    {
        var xtoken = $("input[name='xtoken']").val();
        var uri = site_url+'admin/media/search';
        //make request to controller method
        $.get(uri,{ 'xtoken' : xtoken,'query':query },
        function(data) {
            var dataLength = data.length;
            if(dataLength < 1)
            {
                $.gritter.add({title:'Notice',text:'No matching results',sticky:false,time:'3000'});
            }else {
                var dataGrid = $('#files table tbody');
                dataGrid.html('');
                $.each(data,function(index,file)
                {
                    var media_thumbnail ="";
                    if((file.file_type == "image/jpeg") || (file.file_type == "image/png") || (file.file_type == "image/png"))
                    {
                        media_thumbnail = '<img src="'+file.file_path+'" height="60" width="46" />';
                    }
                    if((file.file_type == "audio/mp3") || (file.file_type == "audio/wma"))
                    {
                        media_thumbnail = '<img src="'+site_url+'assets/admin/audio.png" />';
                    }
                    dataGrid.append(
                        '<tr class="files" id="'+file.file_id+'">'+
                            '<td><input id="file_id" type="checkbox" name="file_id[]" value="'+file.file_id+'" /></td>'+
                            '<td>'+
                                '<div class="media_preview">'+media_thumbail+'</div>'+
                                '<a href="'+site_url+'admin/media/editmedia/'+file.file_id+'">'+file.file_name+'</a>'+
                            '</td>'+
                             '<td>'+file.file_type+'</td>'+
                             '<td>'+file.author+'</td>'+
                             '<td>'+file.upload_date+'</td>'+
                        '</tr>'
                    );
                });
            }
        });
    }

When the code executes, I get an error saying var media_thumbnail is undefined, even after I declare the variable as empty ” var media_thumbnail = ""; ”
Am setting the value of the var media_thumbail after testing an object from the JSON return of the ajax call.
See this part of the code

var media_thumbnail ="";
                    if((file.file_type == "image/jpeg") || (file.file_type == "image/png") || (file.file_type == "image/png"))
                    {
                        media_thumbnail = '<img src="'+file.file_path+'" height="60" width="46" />';
                    }
                    if((file.file_type == "audio/mp3") || (file.file_type == "audio/wma"))
                    {
                        media_thumbnail = '<img src="'+site_url+'assets/admin/audio.png" />';
                    }

What is wrong with my function?

Answer 1

You misspelled the variable reference:

'<div class="media_preview">'+media_thumbail+'</div>'+
                                         ^ missing 'n'