2008-12-10 5 views
9

के साथ यह संभव है कि मैं जेएसएफ के लिए नया हूं और एप्लिकेशन के लिए मुझे चिंता है कि मुझे एक से अधिक फ़ील्ड इनपुट फॉर्म करना है।डेटाटेबल युक्त इनपुटटेक्स्ट: जेएसएफ कस्टम कंपोनेंट

कुछ शब्दों में उपयोगकर्ता के पास इनपुट डेटा होना चाहिए जब वह अपना डेटा इनपुट करता है और एक "एड" बटन जो एक और डेटा इनपुट करने के लिए एक नया इनपुट टेक्स्ट जोड़ता है। जब उपयोगकर्ता किया जाता है, तो वह एक और सबमिट बटन दबाता है। मैंने कुछ पहले से ही देखा है, लेकिन मुझे कुछ भी नहीं मिला है, इसलिए मैंने अपना खुद का कस्टम जेएसएफ घटक

यह विचार डेटाटेबल युक्त प्रत्येक घटक के लिए इनपुटटेक्स्ट युक्त डेटाटेबल युक्त एक घटक बनाने का था, प्लस एक बटन जो संग्रह में एक पंक्ति जोड़ता है जो डेटाटेबल से जुड़ा हुआ है।

मैं जेएसएफ दस्तावेज और किताबों को देख रहा हूं, लेकिन मैं थोड़ा उलझन में हूं और मुझे यकीन नहीं है कि ऐसा कोई घटक बनाना संभव है ... क्या कोई मेरी मदद कर सकता है? टीआईए

उत्तर

12

यह सब कुछ करना संभव है जो आप चाहते हैं।


आप मौजूदा नियंत्रणों का उपयोग करके जो कुछ चाहते हैं उसके करीब कुछ बना सकते हैं। जेएसएफ से अधिक लाभ उठाने का एक अच्छा तरीका दृश्य के लिए मॉडल को तैयार करना है। उदाहरण के लिए, यह दृश्य संपादन विकल्प प्रदर्शित करता है जो आपको डेटा तालिका में मान जोड़ने की अनुमति देता है।

<f:view> 
    <h:form> 
     <h:dataTable value="#{people.list}" var="row"> 
      <h:column> 
       <f:facet name="header"> 
        <h:outputText value="#" /> 
       </f:facet> 
       <h:selectBooleanCheckbox value="#{row.selected}" /> 
      </h:column> 
      <h:column> 
       <f:facet name="header"> 
        <h:outputText value="First Name" /> 
       </f:facet> 
       <h:inputText value="#{row.firstname}" /> 
      </h:column> 
      <h:column> 
       <f:facet name="header"> 
        <h:outputText value="Last Name" /> 
       </f:facet> 
       <h:inputText value="#{row.lastname}" /> 
      </h:column> 
      <f:facet name="footer"> 
       <h:panelGroup> 
        <h:commandButton value="Add Row" action="#{people.addPerson}" /> 
        <h:commandButton value="Delete Selected" 
         action="#{people.deleteSelected}" /> 
        <h:commandButton value="Finish" action="#{people.finish}" /> 
       </h:panelGroup> 
      </f:facet> 
     </h:dataTable> 
    </h:form> 
</f:view> 

लोग सेम:

public class People implements Serializable { 

    private static final long serialVersionUID = 1L; 

    private List<Person> people = new ArrayList<Person>(); 

    public People() { 
     // initialise with one entry 
     people.add(new Person()); 
    } 

    public List<Person> getList() { 
     return people; 
    } 

    public String addPerson() { 
     people.add(new Person()); 
     return null; 
    } 

    public String deleteSelected() { 
     Iterator<Person> entries = people.iterator(); 
     while (entries.hasNext()) { 
      Person person = entries.next(); 
      if (person.isSelected()) { 
       entries.remove(); 
      } 
     } 
     return null; 
    } 

    public String finish() { 
     System.out.println(people); 
     return "someNavigationRule"; 
    } 

} 

व्यक्ति सेम:

public class Person implements Serializable { 

    private static final long serialVersionUID = 1L; 

    private String firstname; 
    private String lastname; 
    private transient boolean selected = false; 

    public String getFirstname() { 
     return firstname; 
    } 

    public void setFirstname(String firstname) { 
     this.firstname = firstname; 
    } 

    public String getLastname() { 
     return lastname; 
    } 

    public void setLastname(String lastname) { 
     this.lastname = lastname; 
    } 

    public boolean isSelected() { 
     return selected; 
    } 

    public void setSelected(boolean selected) { 
     this.selected = selected; 
    } 

} 

चेहरे-config.xml:

<managed-bean> 
    <managed-bean-name>people</managed-bean-name> 
    <managed-bean-class>addmultiple.People</managed-bean-class> 
    <managed-bean-scope>session</managed-bean-scope> 
</managed-bean> 

यह दृष्टिकोण काफी लचीला है और कुछ सीएसएस के साथ, काफी अच्छा लग सकता है। दृश्य और मॉडल में कुछ बदलावों के साथ, उदाहरण के लिए, आप केवल अंतिम पंक्ति संपादन योग्य हो सकते हैं।


यदि परिणामस्वरूप अनुभव पर्याप्त समृद्ध नहीं है या यदि आपको कुछ चाहिए तो आप पुन: उपयोग कर सकते हैं, आप एक कस्टम नियंत्रण बना सकते हैं। यह बिल्कुल जानने तुम क्या चाहते बिना बारीकियों में प्राप्त करने के लिए कठिन है, लेकिन आप शायद आवश्यकता होगी:

  1. एक नया Renderer एचटीएमएल और डिकोडिंग प्रपत्र अनुरोध उत्सर्जन के लिए।
  2. (शायद) एक नया component, शायद UIData का विस्तार, और concrete form रेंडरकिट-विशिष्ट (उदा। एचटीएमएल) विशेषताओं को उजागर करने के लिए।
  3. जेएसपी में नियंत्रण का उपयोग करने के लिए एक नया जेएसपी tag class
  4. चेहरे-config.xml में उपर्युक्त सभी के लिए परिभाषाएं (spec देखें)।
+1

मैं यहां इनपुट फ़ील्ड_ के साथ _Datatable खोज रहा हूं और यह उत्तर इतना साफ है। धन्यवाद आपका) –

संबंधित मुद्दे