0

HTML:

     <footer>
        <a href="#"><div class="footbut" id="chooseFile"  onclick="">
                  <div class="done2 gradGreen" data-bind="visible: picsCount(objectInRoute())>0">
                    <div class="typcn typcn-tick indone"></div>
                  </div>
            <div class="typcn typcn-camera bigblack"></div>
            <span data-bind='text: pickONE("aside",18)'></span>
        </div></a>     
    </footer>    
    <form class="uppform" action="upload.php" method="post" enctype="multipart/form-data">
      <input type="file" id="file" name="image" data-bind="value: upload"/>
      <input type="hidden" name="imageObject" data-bind="value: objectInRoute()"/>
      <div data-bind="if: upload()">
        <div class="first stripe40 gradGold tGold">
          <h1  data-bind="text: pickONE('aside',41)"></h1>
        </div>          
        <input type="submit" data-bind="value: upload" id="submit" class="gradGreen"/>
      </div>  
    </form>

JS:

$('#chooseFile').click(function(){
    alert ("here");
    $('#file').click();
});

(CSS:

#file {
  display: none;
}​

On PC alert works, clicking at #file (=opening choose file) works.

On my touchscreen (android, mobile phone): alert works, but it does NOT open the popup with camera/documents/gallery....

How can I do it to use on touchscreen or is error somewhere else? Thank you!

PSL
  • 123,204
  • 21
  • 253
  • 243
user3025493
  • 109
  • 9
  • This may help you, http://stackoverflow.com/questions/10722730/jquery-click-event-not-working-in-mobile-browsers – Rajaprabhu Aravindasamy Dec 08 '13 at 06:41
  • I looked at that before posting, I thought this is different situation, in my case it goes to if click event (alert fires), but it does not make the extra click to another element. But ok, I will look at it again, thanks. – user3025493 Dec 08 '13 at 06:46

1 Answers1

0

If anyone would be interested in this particular situation, it seems that this code solves the problem:

#file {
  width: 0;
  height: 0;
  float: left;
  visibility: hidden;
}​

Instead of display: none;

I am not really sure, that it will work on all devices, but on my testing one it does.

user3025493
  • 109
  • 9