[Portfolio] Grouped Elements and Custom Creation Renderer

Sean Keesler sean.keesler at threecanoes.com
Thu Jul 15 10:26:13 PDT 2010


I like the approach too...as a workaround for a design problem.
However, you'd have to make everything "optional". Ideally you'd want to use
xsd to validate the content properly.
You can do client side validation workarounds for that too, I suppose...but
still.

Sean Keesler
130 Academy Street
Manlius, NY 13104
315-682-0830
sean.keesler at threecanoes.com



On Thu, Jul 15, 2010 at 1:14 PM, Christian Aziz <caziz at oit.rutgers.edu>wrote:

> Thanks for the samples Erica! We're going to try this out. I'm assuming the
> JS code is not placed in the XSD. Could you share your custom XSL if
> possible?
>
>
> Christian V. Aziz - Senior Instructional Designer
> Office of Instructional and Research Technology
> Rutgers, The State University of New Jersey
>
> 101K Administrative Services Building Annex 1
> 56 Bevier Road, Piscataway, NJ 08854
> Tel: 732-445-8732 | Fax: 732-445-5539
>
>
> ------------------------------
> *From: *"Erica Ackerman" <ericaack at umich.edu>
> *To: *"Erica Ackerman" <ericaack at umich.edu>, "Christian Aziz" <
> caziz at rutgers.edu>, "Portfolio List" <portfolio at collab.sakaiproject.org>
> *Sent: *Thursday, July 15, 2010 11:20:33 AM
> *Subject: *RE: [Portfolio] Grouped Elements and Custom Creation Renderer
>
>
>  Christian,
>
>
>
> Here is a screenshot of the relevant portion of our form. The code I sent
> is a little complicated, because the user can choose one of several
> different experience types, and different prompts appear, depending on what
> type of experience is chosen:
>
>
>
>
>
> *From:* portfolio-bounces at collab.sakaiproject.org [mailto:
> portfolio-bounces at collab.sakaiproject.org] *On Behalf Of *Ackerman, Erica
> *Sent:* Thursday, July 15, 2010 10:45 AM
> *To:* Christian Aziz; Portfolio List
> *Subject:* Re: [Portfolio] Grouped Elements and Custom Creation Renderer
>
>
>
> Christian,
>
>
>
> We had a similar issue and didn’t want to use subforms, so we use
> Javascript in one of our forms to get that effect. The technique as we use
> it wouldn’t allow your users to add an unlimited number of new field sets.
> We decided that no one would want to add more than 5 our field sets, so we
> included all five in the XSD, then used Javascript to hide all but the first
> set. Then there is a button that displays the next set in sequence each time
> it is clicked. I’ll show the relevant XSD and the Javascript below. The XSD
> has entries like this:
>
>
>
> <xs:element name="fieldExpList_1" minOccurs="0" maxOccurs="1">
>      <xs:annotation>
>             <xs:documentation source="ospi.label">Select a type of
> experience to reflect on.</xs:documentation>
>      </xs:annotation>
>      <xs:simpleType>
>             <xs:restriction base="xs:string">
>                         <xs:enumeration value="">
>                                     <xs:annotation>
>                                                 <xs:documentation>Select a
> type of experience</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="internship">
>                                     <xs:annotation>
>                                                 <xs:documentation>
> Internship</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="workExp">
>                                     <xs:annotation>
>                                                 <xs:documentation>Work
> Experience</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="extraCurr">
>                                     <xs:annotation>
>                                                 <xs:documentation>Extra-Curricular
> Involvement (Committees, etc.)</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="events">
>                                     <xs:annotation>
>                                                 <xs:documentation>Events
> (Conferences, Trainings, Workshops, Speakers)</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="priorSkills">
>                                     <xs:annotation>
>                                                 <xs:documentation>Skills
> Gained Prior to Entering HBHE</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="other">
>                                     <xs:annotation>
>                                                 <xs:documentation>Other
> </xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>             </xs:restriction>
>      </xs:simpleType>
> </xs:element>
> <xs:element name="fieldExpTitle_1" minOccurs="0" maxOccurs="1">
>      <xs:annotation>
>             <xs:documentation source="ospi.label">Name of
> Organization/Title of Internship position</xs:documentation>
>      </xs:annotation>
>      <xs:simpleType>
>             <xs:restriction base="xs:string">
>
>                         <xs:maxLength value="99" />
>             </xs:restriction>
>      </xs:simpleType>
> </xs:element>
> <xs:element name="fieldExpReflect_1" minOccurs="0" maxOccurs="1">
>      <xs:annotation>
>             <xs:documentation source="ospi.label">Describe the influence
> this experience had on you.</xs:documentation>
>             <xs:documentation source="ospi.isRichText">true
> </xs:documentation>
>             <xs:documentation source="sakai.clonable"></xs:documentation>
>      </xs:annotation>
>      <xs:simpleType>
>             <xs:restriction base="ospi:richText"></xs:restriction>
>      </xs:simpleType>
> </xs:element>
> <xs:element name="fieldExpList_2" minOccurs="0" maxOccurs="1">
>      <xs:annotation>
>             <xs:documentation source="ospi.label">Select a type of
> experience to reflect on.</xs:documentation>
>      </xs:annotation>
>      <xs:simpleType>
>             <xs:restriction base="xs:string">
>                         <xs:enumeration value="">
>                                     <xs:annotation>
>                                                 <xs:documentation>Select a
> type of experience</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="internship">
>                                     <xs:annotation>
>                                                 <xs:documentation>
> Internship</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="workExp">
>                                     <xs:annotation>
>                                                 <xs:documentation>Work
> Experience</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="extraCurr">
>                                     <xs:annotation>
>                                                 <xs:documentation>Extra-Curricular
> Involvement (Committees, etc.)</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="events">
>                                     <xs:annotation>
>                                                 <xs:documentation>Events
> (Conferences, Trainings, Workshops, Speakers)</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="priorSkills">
>                                     <xs:annotation>
>                                                 <xs:documentation>Skills
> Gained Prior to Entering HBHE</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="other">
>                                     <xs:annotation>
>                                                 <xs:documentation>Other
> </xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>             </xs:restriction>
>      </xs:simpleType>
> </xs:element>
> <xs:element name="fieldExpTitle_2" minOccurs="0" maxOccurs="1">
>      <xs:annotation>
>             <xs:documentation source="ospi.label">Name of
> Organization/Title of Internship position</xs:documentation>
>      </xs:annotation>
>      <xs:simpleType>
>             <xs:restriction base="xs:string">
>
>                         <xs:maxLength value="99" />
>             </xs:restriction>
>      </xs:simpleType>
> </xs:element>
> <xs:element name="fieldExpReflect_2" minOccurs="0" maxOccurs="1">
>      <xs:annotation>
>             <xs:documentation source="ospi.label">Describe the influence
> this experience had on you.</xs:documentation>
>             <xs:documentation source="ospi.isRichText">true
> </xs:documentation>
>             <xs:documentation source="sakai.clonable"></xs:documentation>
>      </xs:annotation>
>      <xs:simpleType>
>             <xs:restriction base="ospi:richText"></xs:restriction>
>      </xs:simpleType>
> </xs:element>
> <xs:element name="fieldExpList_3" minOccurs="0" maxOccurs="1">
>      <xs:annotation>
>             <xs:documentation source="ospi.label">Select a type of
> experience to reflect on.</xs:documentation>
>      </xs:annotation>
>      <xs:simpleType>
>             <xs:restriction base="xs:string">
>                         <xs:enumeration value="">
>                                     <xs:annotation>
>                                                 <xs:documentation>Select a
> type of experience</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="internship">
>                                     <xs:annotation>
>                                                 <xs:documentation>
> Internship</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="workExp">
>                                     <xs:annotation>
>                                                 <xs:documentation>Work
> Experience</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="extraCurr">
>                                     <xs:annotation>
>                                                 <xs:documentation>Extra-Curricular
> Involvement (Committees, etc.)</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="events">
>                                     <xs:annotation>
>                                                 <xs:documentation>Events
> (Conferences, Trainings, Workshops, Speakers)</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="priorSkills">
>                                     <xs:annotation>
>                                                 <xs:documentation>Skills
> Gained Prior to Entering HBHE</xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>                         <xs:enumeration value="other">
>                                     <xs:annotation>
>                                                 <xs:documentation>Other
> </xs:documentation>
>                                                 <xs:documentation source=
> "sakai.prompt">Note: prompt comes from experienceTypePrompts.xml
> </xs:documentation>
>                                     </xs:annotation>
>                         </xs:enumeration>
>             </xs:restriction>
>      </xs:simpleType>
> </xs:element>
>
>
>
> The Javascript/jQuery looks like this:
>
>
>
> $(document).ready(*function*() {
>
>
>
>     $("#fieldExpList_1-node").before("<h3>Additional Experiences</h3>");
>
>     $("#comments-div").before("<div id='addReflect'><input
> style='margin-left: 15px;' type='button' value='Add Another Experience'
> id='addReflectButton'/></div>");
>
>     //The comments text field might or might not have a -1 at the end of
> its name
>
>     *if* ($("label[for='comments']").length != 0) {
>
>         $("label[for='comments']").wrap("<h3 style='margin-left:
> -15px;'></h3>");
>
>         $("label[for='comments']").removeClass("block");
>
>     } *else* {
>
>         $("label[for='comments-1']").wrap("<h3 style='margin-left:
> -15px;'></h3>");
>
>         $("label[for='comments-1']").removeClass("block");
>
>     }
>
>     //Hide all field experience-related fields
>
>     *for* (i = 2; i <= 5; i++) {
>
>         $("#fieldExpReflect_" + i + "-div").addClass("likert-inactive");
>
>         $("#fieldExpTitle_" + i + "-node").addClass("likert-inactive");
>
>         $("#fieldExpList_" + i + "-node").addClass("likert-inactive");
>
>         //if ($("#fieldExpReflect_" + i +"-div").is(":hidden"))
> {alert("fieldExpReflect_" + i + " is hidden");}
>
>         //setMainFrameHeight(formPanelId);
>
>     }
>
>
>
>     *for* (i = 1; i <= 5; i++) {
>
>         *var* option = $("#fieldExpList_" + i + " option:selected").val();
>
>         *if* (option == "") {
>
>             option = "other";
>
>         }
>
>         $("label[for=fieldExpReflect_" + i + "]").text(promptList[option].
> prompt);
>
>         //$("#fieldExpList_" + i +
> "-prompt").text(promptList[option].prompt);
>
>         *if* ($("label[for='fieldExpTitle_" + i + "']").length != 0) {
>
>             //alert("there was a label for fieldExpTitle_" + i);
>
>             $("label[for='fieldExpTitle_" + i + "']").text(promptList[
> option].title);
>
>         } *else* {
>
>             $("label[for='fieldExpTitle_" + i + "-1']").text(promptList[
> option].title);
>
>         }
>
>     }
>
>
>
>     //For each of the 5 field experience-related fields, get the currently
> selected
>
>     //value of the fieldExpList (the one that says whether it's an
> internship or whatever,
>
>     //and set the correct prompts for that option. If the fieldExpReflect
> field is not empty,
>
>     //display the next set of experience-related fields
>
> _______________________________________________
> portfolio mailing list
> portfolio at collab.sakaiproject.org
> http://collab.sakaiproject.org/mailman/listinfo/portfolio
>
> TO UNSUBSCRIBE: send email to
> portfolio-unsubscribe at collab.sakaiproject.org with a subject of
> "unsubscribe"
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/portfolio/attachments/20100715/beb7e377/attachment-0001.html 


More information about the portfolio mailing list