Project

General

Profile

Story #70068

Updated by Björn Jacob over 8 years ago

The "bootstrap_package":https://github.com/beechit/bootstrap_package comes with some settings for EXT:form. It optimizes the rendering of EXT:form using .layout functionalities, see the "code on github":https://github.com/benjaminkott/bootstrap_package/blob/master/Configuration/ContentElements/Base.ts#L853. 

 Using the following snippet helps to test all the sub-issues: https://typo3.slack.com/files/bjoern.jacob/F0B84D0B1/lib_mailform.txt. 

 <pre> 
 <code> 
 lib.mailform = FORM 
 lib.mailform { 
     prefix = tx_form 
     confirmation = 1 

     # prevents submitting form 
     stdWrap.wrap = <div class="outerWrap">|</div> 
     # no problem with the following wrap 
     # stdWrap.wrap = | 

     # setting layout for the different views needs further testing 
     form { 
         layout { 
         } 
    

     confirmation { 
         layout { 
         } 
     } 
    

     confirmation 

     email { 
         layout { 
         } 
     } 

     layout { 
         # not working, i.e. class is not added 
         form ( 
             <form class="form-horizontal"> 
                 <containerWrap /> 
             </form> 
         ) 
         # works 
         containerWrap ( 
             <div class="containerWrap"> 
                 <elements /> 
             </div> 
         ) 
         # works 
         elementWrap ( 
             <div class="elementWrap"> 
                 <element /> 
             </div> 
         ) 
         # not working, i.e. class is not added 
         fieldset ( 
             <div class="fieldset"><fieldset><legend /><containerWrap /></fieldset></div> 
         ) 
         # not working, <error /> is expected 
         /* 
         label ( 
             <label><labelvalue /><mandatory /></label> 
         ) 
         */ 
         # works 
         error ( 
             <span class="help-block text-danger"><errorvalue /></span> 
         ) 
		 # all of the following elements wrap are not working since <error /> is expected always to be inside of <label /> 
         textline ( 
             <div class="form-group"> 
                 <div class="col-sm-3 control-label"> 
                     <label /> 
                 </div> 
                 <div class="col-sm-9"> 
                     <input class="form-control" /> 
                     <error /> 
                 </div> 
             </div> 
         ) 
         select ( 
             <div class="form-group"> 
                 <div class="col-sm-3 control-label"> 
                     <label /> 
                 </div> 
                 <div class="col-sm-9"> 
                     <select class="form-control"> 
                         <elements /> 
                     </select> 
                     <error /> 
                 </div> 
             </div> 
         ) 
         textarea ( 
             <div class="form-group"> 
                 <div class="col-sm-3 control-label"> 
                     <label /> 
                 </div> 
                 <div class="col-sm-9"> 
                     <textarea class="form-control" /> 
                     <error /> 
                 </div> 
             </div> 
         ) 
         checkbox ( 
             <div class="form-group"> 
                 <div class="col-sm-offset-3 col-sm-9"> 
                     <div class="checkbox"> 
                         <input /> 
                         <label /> 
                     </div> 
                     <error /> 
                 </div> 
             </div> 
         ) 
         # not working, PHP warning 
         submit ( 
             <div class="form-group"> 
                 <div class="col-sm-offset-3 col-sm-9"> 
                     <input class="btn btn-primary" /> 
                 </div> 
             </div> 
         ) 
     } 

     postProcessor { 
         1 = mail 
         1 { 
             recipientEmail = forms@tritum.de 
             senderEmail = forms@tritum.de 
             subject = Contactform website 
             messages { 
                 success = TEXT 
                 success { 
                     value = Hartelijk dank voor uw reactie. Wij zullen uw vraag zo spoedig mogelijk beantwoorden. 
                 } 
             } 
         } 
         2 = redirect 
         2 { 
             destination = 4 
         } 
     } 
     10 = TEXTLINE 
     10 { 
         name = name 
         placeholder = Naam* 
         label { 
             value = Naam 
         } 
     } 
     20 = TEXTLINE 
     20 { 
         name = company 
         placeholder = Bedrijf/organisatie 
         label { 
             value = Bedrijf/organisatie 
         } 
     } 
     30 = TEXTLINE 
     30 { 
         name = emailaddress 
         placeholder = E-mailadres* 
         label { 
             value = Emailadres 
         } 
     } 
     40 = TEXTLINE 
     40 { 
         name = phonenumber 
         placeholder = Telefoonnummer 
         label { 
             value = Telefoonnummer 
         } 
     } 
     50 = TEXTAREA 
     50 { 
         cols = 40 
         rows = 10 
         name = 5 
         placeholder = Uw bericht... 
         label { 
             value = Uw bericht... 
         } 
     } 
     60 = SELECT 
     60 { 
         name = select 
         label = Select 
         10 = OPTION 
         10 { 
             name = option1 
             value = option1 
             data = Option 1 
         } 
         20 = OPTION 
         20 { 
             name = option2 
             value = option2 
             data = Option 2 
         } 
     } 
     70 = CHECKBOX 
     70 { 
         name = checkbox 
         value = checkbox 
         label = Checkbox 
     } 
     1000 = FIELDSET 
     1000 { 
         legend = Submit 
         10 = SUBMIT 
         10 { 
             name = 6 
             value = Verzenden 
         } 
     } 
     rules { 
         1 = required 
         1 { 
             breakOnError = 0 
             showMessage = 1 
             message = * 
             error = Dit veld is verplicht 
             element = name 
         } 
         2 = required 
         2 { 
             breakOnError = 0 
             showMessage = 1 
             message = * 
             error = Dit veld is verplicht 
             element = emailaddress 
         } 
         3 = required 
         3 { 
             breakOnError = 0 
             showMessage = 1 
             message = * 
             error = Dit veld is verplicht 
             element = 5 
         } 
         4 = required 
         4 { 
             breakOnError = 0 
             showMessage = 1 
             message = * 
             error = Dit veld is verplicht 
             element = select 
         } 
         5 = required 
         5 { 
             breakOnError = 0 
             showMessage = 1 
             message = * 
             error = Dit veld is verplicht 
             element = checkbox 
         } 
     } 
 } 
 </code> 
 </pre> 

 I'm creating sub-issues for all of the mentioned problems and optimizations.

Back