Uploaded image for project: 'Tapestry 5'
  1. Tapestry 5
  2. TAP5-1903

Client-side exception when a Zone containing a Form with an Upload component is re-rendered

VotersWatch issueWatchersLinkCloneUpdate Comment AuthorReplace String in CommentUpdate Comment VisibilityDelete Comments
    XMLWordPrintableJSON

Details

    Description

      I have run into an issue with javascript that runs after the zone which contains an upload component is re rendered. The code would look like this

      <t:zone t:id="zone">
      <t:form t:id="form">
      <input t:type="upload" t:value="value" />
      </t:form>
      </t:zone>

      once this is rendered the javascript would send an error TypeError: Cannot set property 'enctype' of undefined http://localhost:8080/assets/0.55-SNAPSHOT/jquery/tapestry-jquery.js:904

      what happens is that once the ajax starts to work the Upload component (Upload.java) sends the code that is to be executed

      Tapestry.Initializer.injectedUpload = function(element)
      {
      var form = $(element).form;

      form.enctype = "multipart/form-data";
      form.encoding = "multipart/form-data";
      }

      $(element).form returns null for partial updates.

      the code for that can be found https://github.com/apache/tapestry5/blob/trunk/tapestry-upload/src/main/resources/org/apache/tapestry5/upload/components/upload.js

      the solution that worked for me is

      Tapestry.Initializer.injectedUpload = function(element)
      {
      var form = $(element).form;

      if(form)

      { form.enctype = "multipart/form-data"; form.encoding = "multipart/form-data"; }


      }

      two more thing that are maybe worth to mention is that I was using tapestry-jquery plugin (but since this code comes from the tapestry core and it has nothing to do with jquery I think that it is irrelevant). the second thing is that the reason this error shows up is because what is send from the ajax (along with the code that is to be executed in javascript) is the list of components (in my case it was a list of 6) 5 textfields and 1 upload. All of them apart from upload where return as objects the upload was returned from ajax was a string which is why the

      var form = $(element).form;

      is not working and the solution about works

      One other thing to mention is that this error does not affect java code only the javascript since an error is thrown so javascript stops to work on the page

      the discussion on the forum can be found here http://tapestry.1045711.n5.nabble.com/Zone-refresh-image-uplaod-td5631622.html#a5634387

      Attachments

        Activity

          This comment will be Viewable by All Users Viewable by All Users
          Cancel

          People

            bobharner Bob Harner
            horvat.z.boris Boris Horvat
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

            Dates

              Created:
              Updated:
              Resolved:

              Time Tracking

                Estimated:
                Original Estimate - 1h
                1h
                Remaining:
                Remaining Estimate - 1h
                1h
                Logged:
                Time Spent - Not Specified
                Not Specified

                Slack

                  Issue deployment