Jump to content
markus_ja

input type="file" not working on iOS9 (iPad)

Recommended Posts

Hello,

 

I want to access the camera on iOS. And since iOS6, that is supported by the browser.

Using <input type="file" access="image/*" capture="camera"> works fine on my desktop browser, but not on my iPad.  The input box is not shown as file input box.

I also tried some other pages, and there it works, like here: http://jsfiddle.net/4WHw5/1/

It seems I am missing something.

 

This is my code:

edtFileUpload.InputType := itFile;
w3_setAttrib(edtFileUpload.Handle, 'accept', 'image/*');
w3_setAttrib(edtFileUpload.Handle, 'capture', 'camera');

Can anybody help?

Share this post


Link to post
Share on other sites

You don't have to use the TW3EditBox. You have to use "clean" <input> tag, without all the default attributs.

 

I created a simple wrapper:

TMyInputFile = class(TW3CustomControl)
  private
    procedure SetAccept(aValue: string);
    procedure SetCapture(aValue: string);
  protected
    function MakeElementTagObj: THandle; override;
    procedure StyleTagObject; override;
  public
    procedure OpenDialog;
    property Accept: string write SetAccept;
    property Capture: string write SetCapture;
  end;

{ TMyInputFile }

procedure TMyInputFile.StyleTagObject;
begin
  //prevent default
  w3_setAttrib(Handle, 'type', 'file');
end;

function TMyInputFile.MakeElementTagObj: THandle;
begin
  result := w3_createHtmlElement('input');
end;

procedure TMyInputFile.SetCapture(aValue: String);
begin
  w3_setAttrib(Handle, 'capture', aValue);
end;

procedure TMyInputFile.SetAccept(aValue: String);
begin
  w3_setAttrib(Handle, 'accept', aValue);
end;

procedure TMyInputFile.OpenDialog;
begin
  Handle.click();
end;

Usage:

//Image File Upload
  _myFileOpenDialog := TMyInputFile.Create(divViewGeneral);
  _myFileOpenDialog.Visible := false;
  _myFileOpenDialog.Accept := 'image/*'; // or '.png, .jpg'
  _myFileOpenDialog.Capture := 'camera';

  _myFileOpenDialog.Handle.addEventListener('change',
    procedure(e: Variant)
    var
      fileReader: JFileReader;
      fileList: JFileList;
    begin
      fileList := JFileList(e.target.files);
      if fileList.length > 0 then
        _imageFile := fileList.item(0)
      else
        _imageFile := nil;

      if Assigned(_imageFile) then
      begin
        fileReader := JFileReader.Create;
        fileReader.onload :=
          function(event: JEvent): Variant
          begin
            imgRecipe.Url := Variant(event.target).result;
            result := true;
          end;

        fileReader.readAsDataURL(_imageFile);

      end;
    end, false);

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×