0

binding uploaded file

asked 2013-02-22 15:37:01 +0800

bug gravatar image bug
12 2

updated 2013-02-22 15:45:40 +0800

How can I bind an uploaded file to a property of a ViewModel?

Example (not working):

MyViewModel.java

class MyViewModel {
   private bytes[] file;
   // code omitted
}

myview.zul

...
<button upload="true" value="@bind(vm.file)" />
...
delete flag offensive retag edit

3 Answers

Sort by » oldest newest most voted
1

answered 2013-02-22 17:34:16 +0800

sjoshi gravatar image sjoshi flag of India
3493 1 8
http://zkframeworkhint.bl...

updated 2013-02-24 11:59:21 +0800

See this example ...

<zk>
    <zscript deferred="true"><![CDATA[
    import org.zkoss.util.media.Media;

    Executions.getCurrent().getDesktop().setAttribute(
            "org.zkoss.zul.Fileupload.target", uploadBtn);

    public void processMedia(Media[] media) {
        if (media != null) {
            for (int i = 0; i < media.length; i++) {
                if (media[i] instanceof org.zkoss.image.Image) {
                    image.setContent(media[i]);
                } else {
                    Messagebox.show("Not an image: " + media[i], "Error",
                            Messagebox.OK, Messagebox.ERROR);
                    break; //not to show too many errors
                }
            }
        }
    }
]]></zscript>
    <vbox>
        <button id="uploadBtn" label="Upload"
            onUpload="processMedia(event.getMedias());"
            onClick="Fileupload.get(-1);" />
        <image id="image" />
    </vbox>
</zk>

It Is showing how can you capture event of file upload you are doing wrong you have to pass event in method .

In Your Zul file you have to add this line

<window apply="org.zkoss.bind.BindComposer"
        viewModel="@id('vm') @init('com.test.MyViewModel')">
<button  upload="true,maxsize=1000000" onUpload="@command('getUploadedFile', media=event.media)">
</windows>

and in your viewModel MyViewModel.java you have to add a new method with @command

@Command
public void getUploadedFile(@BindingParam("media") Media myMedia)    {
          java.io.File myFile = new java.io.File(myMedia.getName());
          Messagebox.show("path"+myFile.getAbsolutePath());

}
link publish delete flag offensive edit

Comments

You have not answered to my question. Your example doesn’t show how to bind a binary file to a property in a ViewModel. Beside, don’t assume I always want to upload an image file, please.

bug ( 2013-02-23 09:15:40 +0800 )edit

FYi..media contain other files also please refer Zk documents.Answer also edited

sjoshi ( 2013-02-24 11:54:19 +0800 )edit

@bug, I think the zscript part is just for showing you the concept. so you can just read the MVVM part about how to get the uploaded object through event.media. after you have the Media, please refer to java doc http://www.zkoss.org/javadoc/latest/zk/org/zkoss/util/media/Media.html

dennis ( 2013-02-25 02:49:22 +0800 )edit
0

answered 2013-05-21 15:10:54 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2621 3 8
http://emrpms.blogspot.in...

Hi

I am trying to bind image using MVVM. But after upload, it is not showing the image. Here is the code.

    <div
            style="z-index:999;position:absolute;right:50px;top:56px;width:130px;height:130px;background-color:#ff99cc;">
            <image id="pics" src="@bind(vm.userImage)" width="130px" />
            <toolbar
                style="border-color: transparent; background:none;">
                <toolbarbutton
                    style="position:absolute;right:95px;top:136px;"
                    image="/images/picture_add.png" upload="true"
                    onUpload="@command('upload', upEvent=event)" />
                <space />
                <toolbarbutton image="/images/picture_delete.png"
                    style="position:absolute;right:-10px;top:136px;" />
            </toolbar>
        </div>

VM

private org.zkoss.zul.Image userImage;

@Command("upload") @NotifyChange("userImage") public void upload(@ContextParam(ContextType.BIND_CONTEXT) BindContext ctx) { UploadEvent upEvent = (UploadEvent) ctx.getTriggerEvent();

    org.zkoss.util.media.Media media = upEvent.getMedia();
    if (media instanceof org.zkoss.image.Image) {
        userImage = new org.zkoss.zul.Image();
        userImage.setContent((Image) media);

    } else {
        Messagebox.show("Not an image: " + media, "Error", Messagebox.OK,
                Messagebox.ERROR);
    }
    System.out.println("uploading " + upEvent.getMedia().getName());
}
link publish delete flag offensive edit
0

answered 2013-05-22 07:38:55 +0800

sjoshi gravatar image sjoshi flag of India
3493 1 8
http://zkframeworkhint.bl...

I think your image tab will be like this..

<image content="@bind(vm.myImage)" height="150px" width="300px" />
link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2013-02-22 15:37:01 +0800

Seen: 176 times

Last updated: May 22 '13

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More