option_form.twig (12183B)
1 {{ header }}{{ column_left }} 2 <div id="content"> 3 <div class="page-header"> 4 <div class="container-fluid"> 5 <div class="pull-right"> 6 <button type="submit" form="form-option" data-toggle="tooltip" title="{{ button_save }}" class="btn btn-primary"><i class="fa fa-save"></i></button> 7 <a href="{{ cancel }}" data-toggle="tooltip" title="{{ button_cancel }}" class="btn btn-default"><i class="fa fa-reply"></i></a></div> 8 <h1>{{ heading_title }}</h1> 9 <ul class="breadcrumb"> 10 {% for breadcrumb in breadcrumbs %} 11 <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li> 12 {% endfor %} 13 </ul> 14 </div> 15 </div> 16 <div class="container-fluid"> {% if error_warning %} 17 <div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> {{ error_warning }} 18 <button type="button" class="close" data-dismiss="alert">×</button> 19 </div> 20 {% endif %} 21 <div class="panel panel-default"> 22 <div class="panel-heading"> 23 <h3 class="panel-title"><i class="fa fa-pencil"></i> {{ text_form }}</h3> 24 </div> 25 <div class="panel-body"> 26 <form action="{{ action }}" method="post" enctype="multipart/form-data" id="form-option" class="form-horizontal"> 27 <fieldset> 28 <legend>{{ text_option }}</legend> 29 <div class="form-group required"> 30 <label class="col-sm-2 control-label">{{ entry_name }}</label> 31 <div class="col-sm-10"> {% for language in languages %} 32 <div class="input-group"><span class="input-group-addon"><img src="language/{{ language.code }}/{{ language.code }}.png" title="{{ language.name }}" /></span> 33 <input type="text" name="option_description[{{ language.language_id }}][name]" value="{{ option_description[language.language_id] ? option_description[language.language_id].name }}" placeholder="{{ entry_name }}" class="form-control" /> 34 </div> 35 {% if error_name[language.language_id] %} 36 <div class="text-danger">{{ error_name[language.language_id] }}</div> 37 {% endif %} 38 {% endfor %}</div> 39 </div> 40 <div class="form-group"> 41 <label class="col-sm-2 control-label" for="input-type">{{ entry_type }}</label> 42 <div class="col-sm-10"> 43 <select name="type" id="input-type" class="form-control"> 44 <optgroup label="{{ text_choose }}"> 45 {% if type == 'select' %} 46 47 48 <option value="select" selected="selected">{{ text_select }}</option> 49 50 51 {% else %} 52 53 54 <option value="select">{{ text_select }}</option> 55 56 57 {% endif %} 58 {% if type == 'radio' %} 59 60 61 <option value="radio" selected="selected">{{ text_radio }}</option> 62 63 64 {% else %} 65 66 67 <option value="radio">{{ text_radio }}</option> 68 69 70 {% endif %} 71 {% if type == 'checkbox' %} 72 73 74 <option value="checkbox" selected="selected">{{ text_checkbox }}</option> 75 76 77 {% else %} 78 79 80 <option value="checkbox">{{ text_checkbox }}</option> 81 82 83 {% endif %} 84 </optgroup> 85 <optgroup label="{{ text_input }}"> 86 {% if type == 'text' %} 87 88 89 <option value="text" selected="selected">{{ text_text }}</option> 90 91 92 {% else %} 93 94 95 <option value="text">{{ text_text }}</option> 96 97 98 {% endif %} 99 {% if type == 'textarea' %} 100 101 102 <option value="textarea" selected="selected">{{ text_textarea }}</option> 103 104 105 {% else %} 106 107 108 <option value="textarea">{{ text_textarea }}</option> 109 110 111 {% endif %} 112 </optgroup> 113 <optgroup label="{{ text_file }}"> 114 {% if type == 'file' %} 115 116 117 <option value="file" selected="selected">{{ text_file }}</option> 118 119 120 {% else %} 121 122 123 <option value="file">{{ text_file }}</option> 124 125 126 {% endif %} 127 </optgroup> 128 <optgroup label="{{ text_date }}"> 129 {% if type == 'date' %} 130 131 132 <option value="date" selected="selected">{{ text_date }}</option> 133 134 135 {% else %} 136 137 138 <option value="date">{{ text_date }}</option> 139 140 141 {% endif %} 142 {% if type == 'time' %} 143 144 145 <option value="time" selected="selected">{{ text_time }}</option> 146 147 148 {% else %} 149 150 151 <option value="time">{{ text_time }}</option> 152 153 154 {% endif %} 155 {% if type == 'datetime' %} 156 157 158 <option value="datetime" selected="selected">{{ text_datetime }}</option> 159 160 161 {% else %} 162 163 164 <option value="datetime">{{ text_datetime }}</option> 165 166 167 {% endif %} 168 </optgroup> 169 </select> 170 </div> 171 </div> 172 <div class="form-group"> 173 <label class="col-sm-2 control-label" for="input-sort-order">{{ entry_sort_order }}</label> 174 <div class="col-sm-10"> 175 <input type="text" name="sort_order" value="{{ sort_order }}" placeholder="{{ entry_sort_order }}" id="input-sort-order" class="form-control" /> 176 </div> 177 </div> 178 </fieldset> 179 <fieldset> 180 <legend>{{ text_value }}</legend> 181 <table id="option-value" class="table table-striped table-bordered table-hover"> 182 <thead> 183 <tr> 184 <td class="text-left required">{{ entry_option_value }}</td> 185 <td class="text-center">{{ entry_image }}</td> 186 <td class="text-right">{{ entry_sort_order }}</td> 187 <td></td> 188 </tr> 189 </thead> 190 <tbody> 191 192 {% set option_value_row = 0 %} 193 {% for option_value in option_values %} 194 <tr id="option-value-row{{ option_value_row }}"> 195 <td class="text-center"><input type="hidden" name="option_value[{{ option_value_row }}][option_value_id]" value="{{ option_value.option_value_id }}" /> 196 {% for language in languages %} 197 <div class="input-group"><span class="input-group-addon"><img src="language/{{ language.code }}/{{ language.code }}.png" title="{{ language.name }}" /></span> 198 <input type="text" name="option_value[{{ option_value_row }}][option_value_description][{{ language.language_id }}][name]" value="{{ option_value.option_value_description[language.language_id] ? option_value.option_value_description[language.language_id].name }}" placeholder="{{ entry_option_value }}" class="form-control" /> 199 </div> 200 {% if error_option_value[option_value_row][language.language_id] %} 201 <div class="text-danger">{{ error_option_value[option_value_row][language.language_id] }}</div> 202 {% endif %} 203 {% endfor %}</td> 204 <td class="text-left"><a href="" id="thumb-image{{ option_value_row }}" data-toggle="image" class="img-thumbnail"><img src="{{ option_value.thumb }}" alt="" title="" data-placeholder="{{ placeholder }}" /></a> 205 <input type="hidden" name="option_value[{{ option_value_row }}][image]" value="{{ option_value.image }}" id="input-image{{ option_value_row }}" /></td> 206 <td class="text-right"><input type="text" name="option_value[{{ option_value_row }}][sort_order]" value="{{ option_value.sort_order }}" class="form-control" /></td> 207 <td class="text-right"><button type="button" onclick="$('#option-value-row{{ option_value_row }}').remove();" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td> 208 </tr> 209 {% set option_value_row = option_value_row + 1 %} 210 {% endfor %} 211 </tbody> 212 213 <tfoot> 214 <tr> 215 <td colspan="3"></td> 216 <td class="text-right"><button type="button" onclick="addOptionValue();" data-toggle="tooltip" title="{{ button_option_value_add }}" class="btn btn-primary"><i class="fa fa-plus-circle"></i></button></td> 217 </tr> 218 </tfoot> 219 </table> 220 </fieldset> 221 </form> 222 </div> 223 </div> 224 </div> 225 <script type="text/javascript"><!-- 226 $('select[name=\'type\']').on('change', function() { 227 if (this.value == 'select' || this.value == 'radio' || this.value == 'checkbox' || this.value == 'image') { 228 $('#option-value').parent().show(); 229 } else { 230 $('#option-value').parent().hide(); 231 } 232 }); 233 234 $('select[name=\'type\']').trigger('change'); 235 236 var option_value_row = {{ option_value_row }}; 237 238 function addOptionValue() { 239 html = '<tr id="option-value-row' + option_value_row + '">'; 240 html += ' <td class="text-left"><input type="hidden" name="option_value[' + option_value_row + '][option_value_id]" value="" />'; 241 {% for language in languages %} 242 html += ' <div class="input-group">'; 243 html += ' <span class="input-group-addon"><img src="language/{{ language.code }}/{{ language.code }}.png" title="{{ language.name }}" /></span><input type="text" name="option_value[' + option_value_row + '][option_value_description][{{ language.language_id }}][name]" value="" placeholder="{{ entry_option_value }}" class="form-control" />'; 244 html += ' </div>'; 245 {% endfor %} 246 html += ' </td>'; 247 html += ' <td class="text-center"><a href="" id="thumb-image' + option_value_row + '" data-toggle="image" class="img-thumbnail"><img src="{{ placeholder }}" alt="" title="" data-placeholder="{{ placeholder }}" /></a><input type="hidden" name="option_value[' + option_value_row + '][image]" value="" id="input-image' + option_value_row + '" /></td>'; 248 html += ' <td class="text-right"><input type="text" name="option_value[' + option_value_row + '][sort_order]" value="" placeholder="{{ entry_sort_order }}" class="form-control" /></td>'; 249 html += ' <td class="text-right"><button type="button" onclick="$(\'#option-value-row' + option_value_row + '\').remove();" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>'; 250 html += '</tr>'; 251 252 $('#option-value tbody').append(html); 253 254 option_value_row++; 255 } 256 //--></script></div> 257 {{ footer }}