title: Display name of image selected ipad
body: <p>I have a web based application that allows users to upload photos, and once they have selected an image the name of that images is displayed so they can see what has been selected. I handle this with jQuery/JavaScript</p>
  
  <pre><code>// Grab name of file uploaded
  $(document).on('change', '.document_file_field', function(){
    var input_field = $(this)
    var inputId = input_field.attr('id');
    var fileName = input_field[0].files[0]['name']
    var tt = truncate_text(fileName);
    $('label[for='+inputId+']').text(tt);
  });
  </code></pre>
  
  <p>This works fine via a desktop/laptop but when choosing a photo from an ipad nothing happens (as in the file name is not displayed). However if i click upload the file does get uploaded. So it has recognized that the file is there, just hasn't read the name.. Do i need to do anything different to get the filename?</p>
  
  <p>If I cant access the filename is there anyway of changing the color of the input field if a photo has been selected, basically just some way to let the user know that a file is there waiting to be uploaded.</p>