You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Francisco Diaz Trepat - gmail <fr...@gmail.com> on 2008/11/05 18:48:25 UTC

FileUpload Problem (Submitting a file from an Ajax ModalWindow)

Hi all I have an issue submitting a file in IE. It is kind of an evolving
problem and is getting out of hand, I'm sure there is an easier solution.
First of all. I have an ajax ModalWindow that pops up and shows a label and
and the file input. This didn't upload anything on any browser, I guess
because nested forms are replace with divs and for some reason did not
submit as multipart.


this is the evolving part. :-)

After that, I'll tried an alternative that is working on Firefox but not on
IE, which was to add a multipart form on my page and another one on the
ModalWindow, and with an ajaxlink I Add the following JS code, that clones
the file-input of the ModalWindow to the Pages Form and then submits the
Pages Form. This works but not on IE.

Here is the intricate solution:


         @Override
         public void onClick(AjaxRequestTarget cAjaxRequestTarget) {
            String sFormId;
            String sFileInputId;

            MainPage cMainPage = (MainPage) cAjaxRequestTarget.getPage();

            sFormId = cMainPage.getImportForm().getMarkupId();
            sFileInputId =
cMainPage.getImportForm().getFileUploadField().getMarkupId();

            String sSubmitScript = "" +
                  "var cImportForm = document.getElementById('" + sFormId +
"');\n" +
                  "var cImportFileInput = document.getElementById('" +
sFileInputId + "');\n" +
                  "var cFileInput = document.getElementById('" +
cUploadField.getMarkupId() + "');\n" + //cUploadField is the FileInput from
the current ModalWindow that holds the ajax-link (whos onClick I'm
overriding)
                  "var sValue = cFileInput.value;\n" +
                  "if (typeof(sValue)!=\"undefined\" && sValue.length>5) {"
+
                  "   var cClone = cFileInput.cloneNode(true);\n" +
                  "  var sName = cImportFileInput.name;\n" +
                  "  cClone.name = sName;\n" +
                  "
 cImportFileInput.parentNode.removeChild(cImportFileInput);\n" +
                  "  cImportForm.appendChild(cClone);\n" +
                  "  cImportForm.submit();\n" +
                  "}";


            cAjaxRequestTarget.appendJavascript(sSubmitScript);
         }

As the Subject, what I need is to submit a file from an Ajax ModalWindow. Is
this possible?

Thanks,
f(t)

Re: FileUpload Problem (Submitting a file from an Ajax ModalWindow)

Posted by Francisco Diaz Trepat - gmail <fr...@gmail.com>.
I remember looking but on my google account, not in the nable archives.
Usually those threads where NO AJAX FILE UPLOAD POSSIBLE.

But I think my problem is different.

I'll take a look right now though.

Thanks Igor, always present, short, to the point, and present.. :-)

f(t)

On Wed, Nov 5, 2008 at 3:32 PM, Igor Vaynberg <ig...@gmail.com>wrote:

> plenty threads in the archives on uploading and ajax, you just have to
> search.
>
> -igor
>
> On Wed, Nov 5, 2008 at 9:48 AM, Francisco Diaz Trepat - gmail
> <fr...@gmail.com> wrote:
> > Hi all I have an issue submitting a file in IE. It is kind of an evolving
> > problem and is getting out of hand, I'm sure there is an easier solution.
> > First of all. I have an ajax ModalWindow that pops up and shows a label
> and
> > and the file input. This didn't upload anything on any browser, I guess
> > because nested forms are replace with divs and for some reason did not
> > submit as multipart.
> >
> >
> > this is the evolving part. :-)
> >
> > After that, I'll tried an alternative that is working on Firefox but not
> on
> > IE, which was to add a multipart form on my page and another one on the
> > ModalWindow, and with an ajaxlink I Add the following JS code, that
> clones
> > the file-input of the ModalWindow to the Pages Form and then submits the
> > Pages Form. This works but not on IE.
> >
> > Here is the intricate solution:
> >
> >
> >         @Override
> >         public void onClick(AjaxRequestTarget cAjaxRequestTarget) {
> >            String sFormId;
> >            String sFileInputId;
> >
> >            MainPage cMainPage = (MainPage) cAjaxRequestTarget.getPage();
> >
> >            sFormId = cMainPage.getImportForm().getMarkupId();
> >            sFileInputId =
> > cMainPage.getImportForm().getFileUploadField().getMarkupId();
> >
> >            String sSubmitScript = "" +
> >                  "var cImportForm = document.getElementById('" + sFormId
> +
> > "');\n" +
> >                  "var cImportFileInput = document.getElementById('" +
> > sFileInputId + "');\n" +
> >                  "var cFileInput = document.getElementById('" +
> > cUploadField.getMarkupId() + "');\n" + //cUploadField is the FileInput
> from
> > the current ModalWindow that holds the ajax-link (whos onClick I'm
> > overriding)
> >                  "var sValue = cFileInput.value;\n" +
> >                  "if (typeof(sValue)!=\"undefined\" && sValue.length>5)
> {"
> > +
> >                  "   var cClone = cFileInput.cloneNode(true);\n" +
> >                  "  var sName = cImportFileInput.name;\n" +
> >                  "  cClone.name = sName;\n" +
> >                  "
> >  cImportFileInput.parentNode.removeChild(cImportFileInput);\n" +
> >                  "  cImportForm.appendChild(cClone);\n" +
> >                  "  cImportForm.submit();\n" +
> >                  "}";
> >
> >
> >            cAjaxRequestTarget.appendJavascript(sSubmitScript);
> >         }
> >
> > As the Subject, what I need is to submit a file from an Ajax ModalWindow.
> Is
> > this possible?
> >
> > Thanks,
> > f(t)
> >
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

Re: FileUpload Problem (Submitting a file from an Ajax ModalWindow)

Posted by Igor Vaynberg <ig...@gmail.com>.
plenty threads in the archives on uploading and ajax, you just have to search.

-igor

On Wed, Nov 5, 2008 at 9:48 AM, Francisco Diaz Trepat - gmail
<fr...@gmail.com> wrote:
> Hi all I have an issue submitting a file in IE. It is kind of an evolving
> problem and is getting out of hand, I'm sure there is an easier solution.
> First of all. I have an ajax ModalWindow that pops up and shows a label and
> and the file input. This didn't upload anything on any browser, I guess
> because nested forms are replace with divs and for some reason did not
> submit as multipart.
>
>
> this is the evolving part. :-)
>
> After that, I'll tried an alternative that is working on Firefox but not on
> IE, which was to add a multipart form on my page and another one on the
> ModalWindow, and with an ajaxlink I Add the following JS code, that clones
> the file-input of the ModalWindow to the Pages Form and then submits the
> Pages Form. This works but not on IE.
>
> Here is the intricate solution:
>
>
>         @Override
>         public void onClick(AjaxRequestTarget cAjaxRequestTarget) {
>            String sFormId;
>            String sFileInputId;
>
>            MainPage cMainPage = (MainPage) cAjaxRequestTarget.getPage();
>
>            sFormId = cMainPage.getImportForm().getMarkupId();
>            sFileInputId =
> cMainPage.getImportForm().getFileUploadField().getMarkupId();
>
>            String sSubmitScript = "" +
>                  "var cImportForm = document.getElementById('" + sFormId +
> "');\n" +
>                  "var cImportFileInput = document.getElementById('" +
> sFileInputId + "');\n" +
>                  "var cFileInput = document.getElementById('" +
> cUploadField.getMarkupId() + "');\n" + //cUploadField is the FileInput from
> the current ModalWindow that holds the ajax-link (whos onClick I'm
> overriding)
>                  "var sValue = cFileInput.value;\n" +
>                  "if (typeof(sValue)!=\"undefined\" && sValue.length>5) {"
> +
>                  "   var cClone = cFileInput.cloneNode(true);\n" +
>                  "  var sName = cImportFileInput.name;\n" +
>                  "  cClone.name = sName;\n" +
>                  "
>  cImportFileInput.parentNode.removeChild(cImportFileInput);\n" +
>                  "  cImportForm.appendChild(cClone);\n" +
>                  "  cImportForm.submit();\n" +
>                  "}";
>
>
>            cAjaxRequestTarget.appendJavascript(sSubmitScript);
>         }
>
> As the Subject, what I need is to submit a file from an Ajax ModalWindow. Is
> this possible?
>
> Thanks,
> f(t)
>

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org