server/src/main/webapp/WEB-INF/templates/fragment/spaceForm.html
changeset 127 906fed13c1e1
parent 123 daa99448319d
child 128 93a1fbe6a848
equal deleted inserted replaced
126:4479369ff9f1 127:906fed13c1e1
     1 <!DOCTYPE html>
     1 <!DOCTYPE html>
     2 <html xmlns="http://www.w3.org/1999/xhtml"
     2 <html xmlns="http://www.w3.org/1999/xhtml"
     3  xmlns:th="http://www.thymeleaf.org">
     3  xmlns:th="http://www.thymeleaf.org">
     4 <head>
     4 <head>
     5 <meta charset="utf-8">
     5 <meta charset="utf-8"/>
     6 <title>Space form</title>
     6 <title>Space form</title>
     7 </head>
     7 </head>
     8 <body>
     8 <body>
     9 <div id="Fragment" th:fragment="spaceFormFragment" >
     9 <div id="spaceForm" th:fragment="spaceFormFragment" >
    10   <form action="#" th:object="${space}" th:action="@{/}" method="post">
    10   <script type="text/javascript" th:inline="javascript">
    11        <fieldset>
    11     //<![CDATA[
    12          <input type="hidden" th:field="*{id}" />
    12                
    13          <div>
    13         function showformErrors(errors) {
    14            <label for="title" th:text="#{renkan.form.title}">Title: </label> 
    14         	$(".form-error").remove();
    15            <input type="text" th:field="*{title}" /> 
    15         	
    16          </div> 
    16         	$.each(errors,function(k,v){
    17          <div>
    17         		$("#"+k).after('<div class="form-error">'+v+'</div>');
    18            <label for="uri" th:text="#{renkan.form.uri}">Uri: </label> 
    18         	});
    19            <input type="text" th:field="*{uri}" /> 
    19         	$(".form-error").effect("highlight", {}, 1500);
    20          </div> 
    20         }
    21          <div>
    21               
    22            <label for="description" th:text="#{renkan.form.description}">Description: </label> 
    22         function spaceFormSubmit() {
    23            <textarea th:field="*{description}"></textarea> 
    23         	
    24          </div> 
    24         	var errors = {};
    25          <div>
    25         	var valid = true;
    26            <label for="color" th:text="#{renkan.form.color}">Color: </label> 
    26         	
    27            <input type="text" th:field="*{color}" /> 
    27         	if(!$('#title').val()) {
    28          </div>
    28         		errors['title'] = /*[[#{renkan.error.title.empty}]]*/"renkan.error.title.empty";
    29          <div>
    29         		valid = false;
    30            <label for="binConfig" th:text="#{renkan.form.space.bin_config}">Bin config: </label> 
    30         	}
    31            <textarea th:field="*{binConfig}"></textarea> 
    31             
    32          </div> 
    32             try
       
    33             {
       
    34                var json = JSON.parse($('#binConfig').val());
       
    35             }
       
    36             catch(e)
       
    37             {
       
    38                console.log(e);
       
    39                errors['binConfigDiv'] = /*[[#{renkan.error.bin_config.json}]]*/"renkan.error.bin_config.json";
       
    40                valid = false;
       
    41             }
       
    42             
       
    43             showformErrors(errors);
       
    44                         
       
    45             return valid;
       
    46         }
       
    47         
       
    48         $(function(){
       
    49             var editor = ace.edit("binConfigDiv");
       
    50             editor.setTheme("ace/theme/xcode");
       
    51             editor.getSession().setMode("ace/mode/json");
       
    52             editor.getSession().on('change', function(e) {
       
    53             	$('#binConfig').val(editor.getValue());
       
    54             });
       
    55             
       
    56             $('#color').spectrum({
       
    57             	showInput: true,
       
    58             	showAlpha: true,
       
    59             	showPalette: true,
       
    60             	showInitial: true
       
    61             });
       
    62         });
       
    63     //]]>
       
    64   </script>
       
    65   <form action="#" th:object="${space}" th:action="@{/admin/spaces/save}" method="post" onsubmit="return spaceFormSubmit()">
       
    66      <fieldset class="form-fields">
       
    67        <input type="hidden" th:field="*{id}" th:if="*{id}" />
       
    68        <input type="hidden" th:field="*{binConfig}"/>
       
    69        <div>
       
    70          <label for="title" th:text="#{renkanAdmin.form.title}">Title: </label> 
       
    71          <input type="text" th:field="*{title}" />
       
    72          <div th:if="${#fields.hasErrors('title')}" th:errors="*{title}" class="form-error"></div>
       
    73        </div> 
       
    74        <div>
       
    75          <label for="uri" th:text="#{renkanAdmin.form.uri}">Uri: </label> 
       
    76          <input type="text" th:field="*{uri}" /> 
       
    77        </div> 
       
    78        <div>
       
    79          <label for="description" th:text="#{renkanAdmin.form.description}">Description: </label> 
       
    80          <textarea th:field="*{description}"></textarea> 
       
    81        </div> 
       
    82        <div>
       
    83          <label for="color" th:text="#{renkanAdmin.form.color}">Color: </label> 
       
    84          <input type="text" th:field="*{color}" /> 
       
    85        </div>
       
    86        <div>
       
    87          <label for="binConfigDiv" th:text="#{renkanAdmin.form.space.bin_config}">Bin config: </label> 
       
    88          <div id="binConfigDiv" th:text="*{binConfig}"></div>
       
    89          <div th:if="${#fields.hasErrors('binConfig')}" th:errors="*{binConfig}" class="form-error"></div>
       
    90        </div> 
    33 
    91 
    34        <div class="submit"> 
    92        <div class="submit"> 
    35          <button type="submit" name="save" th:text="#{renkan.form.space.submit}">Save</button> 
    93          <button type="submit" name="save" th:text="#{renkanAdmin.form.space.submit}">Save</button>
       
    94          <!--button type="button" name="cancel" th:text="#{renkanAdmin.form.space.cancel}" th:onclick="location">Cancel</button-->
    36        </div> 
    95        </div> 
    37       
    96       
    38      </fieldset>  
    97      </fieldset>  
    39   </form>
    98   </form>
    40 </div>
    99 </div>