3 Replies Latest reply on Jan 16, 2013 1:56 PM by daisy

    Is it possible to have a form within a widget?

    daisy

      I created a widget plugin and I'd like it to have text boxes so that the user can enter values and then click a button which will reload the widget and take into account the new values added in the input text box.

       

      My ftl has an <input type="text" ../> and a button <input type="submit".../> and my corresponding java class (which extends BaseWidget) has the setter for the input field. However, this setter is never called.

      Also, I'd like the button to reload only the widget and not the whole page ..

        • Re: Is it possible to have a form within a widget?
          jrenaud

          Have you considered using DWR ( DWR - Easy Ajax for JAVA ) for this?

           

          EDIT: you should find some hints about using this withing Jive in this community by searching for "DWR", for example: DWR: Frequently Asked Questions

          1 person found this helpful
          • Re: Is it possible to have a form within a widget?
            daisy

            In case people are interested, I ended up with a simple solution ..

            I don't have a form in my ftl, instead my button calls a function that I defined which calls the widgetContainer.refresh with the user-entered values.

             

             

            So let's say I want the user to be able to add "actors" and "viewers" and refresh the contents of the widget (so as to include these new values...)

             

            Parts of my ftl:

            <input id="new_actor_${frameID?c}" type="text"   ... />

            <input id="new_viewer_${frameID?c}" type="text"   ... />

            <input id="reload_${frameID?c}" type="button" onclick="reload(this);" value = "Reload Widget" ...  />

            ...

             

            function reload(element) {

                 var id = element.id;

                 id = id.substring(id.lastIndexOf("_")+1);

                 var newactor = $j("#new_actor_"+id).val();

                 var newviewer = $j("#new_viewer_"+id).val();

                 widgetContainer.refresh(id, {"newactor": newactor, "newviewer": newviewer});

            }

             

            Parts of my java:

            @Override

            protected Map<String, Object> loadProperties(WidgetContext widgetContext, ContainerSize size) {

                  ...

                 String newActor = widgetContext.getRequest().getParameter("newactor");

                 String newVIewer = widgetContext.getRequest().getParameter("newviewer")

                 ...

                 properties.put("frameID", this.getWidgetFrameID);

                 ...

            }

             

            and that's it! By clicking the Reload Widget button, only my widget reloads and so the rest of the page stays the same ..

             

            I also used this trick in another widget to load it asynchronously .. by adding a "isLoadData" boolean to the parameters..

            widgetContainer.refresh(id, {"isLoadData": true});