geo_zone_form.twig (7626B)
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-geo-zone" 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-geo-zone" class="form-horizontal"> 27 <div class="form-group required"> 28 <label class="col-sm-2 control-label" for="input-name">{{ entry_name }}</label> 29 <div class="col-sm-10"> 30 <input type="text" name="name" value="{{ name }}" placeholder="{{ entry_name }}" id="input-name" class="form-control" /> 31 {% if error_name %} 32 <div class="text-danger">{{ error_name }}</div> 33 {% endif %} </div> 34 </div> 35 <div class="form-group required"> 36 <label class="col-sm-2 control-label" for="input-description">{{ entry_description }}</label> 37 <div class="col-sm-10"> 38 <input type="text" name="description" value="{{ description }}" placeholder="{{ entry_description }}" id="input-description" class="form-control" /> 39 {% if error_description %} 40 <div class="text-danger">{{ error_description }}</div> 41 {% endif %} </div> 42 </div> 43 <fieldset> 44 <legend>{{ text_geo_zone }}</legend> 45 <table id="zone-to-geo-zone" class="table table-striped table-bordered table-hover"> 46 <thead> 47 <tr> 48 <td class="text-left">{{ entry_country }}</td> 49 <td class="text-left">{{ entry_zone }}</td> 50 <td></td> 51 </tr> 52 </thead> 53 <tbody> 54 55 {% set zone_to_geo_zone_row = 0 %} 56 {% for zone_to_geo_zone in zone_to_geo_zones %} 57 <tr id="zone-to-geo-zone-row{{ zone_to_geo_zone_row }}"> 58 <td class="text-left"><select name="zone_to_geo_zone[{{ zone_to_geo_zone_row }}][country_id]" class="form-control" data-index="{{ zone_to_geo_zone_row }}" data-zone-id="{{ zone_to_geo_zone.zone_id }}" disabled="disabled"> 59 60 {% for country in countries %} 61 {% if country.country_id == zone_to_geo_zone.country_id %} 62 63 <option value="{{ country.country_id }}" selected="selected">{{ country.name }}</option> 64 65 {% else %} 66 67 <option value="{{ country.country_id }}">{{ country.name }}</option> 68 69 {% endif %} 70 {% endfor %} 71 72 </select></td> 73 <td class="text-left"><select name="zone_to_geo_zone[{{ zone_to_geo_zone_row }}][zone_id]" class="form-control" disabled="disabled"> 74 </select></td> 75 <td class="text-left"><button type="button" onclick="$('#zone-to-geo-zone-row{{ zone_to_geo_zone_row }}').remove();" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td> 76 </tr> 77 {% set zone_to_geo_zone_row = zone_to_geo_zone_row + 1 %} 78 {% endfor %} 79 </tbody> 80 81 <tfoot> 82 <tr> 83 <td colspan="2"></td> 84 <td class="text-left"><button type="button" id="button-geo-zone" data-toggle="tooltip" title="{{ button_geo_zone_add }}" class="btn btn-primary"><i class="fa fa-plus-circle"></i></button></td> 85 </tr> 86 </tfoot> 87 </table> 88 </fieldset> 89 </form> 90 </div> 91 </div> 92 </div> 93 <script type="text/javascript"><!-- 94 var zone_to_geo_zone_row = {{ zone_to_geo_zone_row }}; 95 96 $('#button-geo-zone').on('click', function() { 97 html = '<tr id="zone-to-geo-zone-row' + zone_to_geo_zone_row + '">'; 98 html += ' <td class="text-left"><select name="zone_to_geo_zone[' + zone_to_geo_zone_row + '][country_id]" class="form-control" data-index="' + zone_to_geo_zone_row + '">'; 99 {% for country in countries %} 100 html += ' <option value="{{ country.country_id }}">{{ country.name|escape('js') }}</option>'; 101 {% endfor %} 102 html += '</select></td>'; 103 html += ' <td class="text-left"><select name="zone_to_geo_zone[' + zone_to_geo_zone_row + '][zone_id]" class="form-control"><option value="0">{{ text_all_zones }}</option></select></td>'; 104 html += ' <td class="text-left"><button type="button" onclick="$(\'#zone-to-geo-zone-row' + zone_to_geo_zone_row + '\').remove();" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>'; 105 html += '</tr>'; 106 107 $('#zone-to-geo-zone tbody').append(html); 108 109 $('zone_to_geo_zone[' + zone_to_geo_zone_row + '][country_id]').trigger(); 110 111 zone_to_geo_zone_row++; 112 }); 113 114 $('#zone-to-geo-zone').on('change', 'select[name$=\'[country_id]\']', function() { 115 var element = this; 116 117 if (element.value) { 118 $.ajax({ 119 url: 'index.php?route=localisation/country/country&user_token={{ user_token }}&country_id=' + element.value, 120 dataType: 'json', 121 beforeSend: function() { 122 $(element).prop('disabled', true); 123 $('button[form=\'form-geo-zone\']').prop('disabled', true); 124 }, 125 complete: function() { 126 $(element).prop('disabled', false); 127 $('button[form=\'form-geo-zone\']').prop('disabled', false); 128 }, 129 success: function(json) { 130 html = '<option value="0">{{ text_all_zones }}</option>'; 131 132 if (json['zone'] && json['zone'] != '') { 133 for (i = 0; i < json['zone'].length; i++) { 134 html += '<option value="' + json['zone'][i]['zone_id'] + '"'; 135 136 if (json['zone'][i]['zone_id'] == $(element).attr('data-zone-id')) { 137 html += ' selected="selected"'; 138 } 139 140 html += '>' + json['zone'][i]['name'] + '</option>'; 141 } 142 } 143 144 $('select[name=\'zone_to_geo_zone[' + $(element).attr('data-index') + '][zone_id]\']').html(html); 145 146 $('select[name=\'zone_to_geo_zone[' + $(element).attr('data-index') + '][zone_id]\']').prop('disabled', false); 147 148 $('select[name$=\'[country_id]\']:disabled:first').trigger('change'); 149 }, 150 error: function(xhr, ajaxOptions, thrownError) { 151 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 152 } 153 }); 154 } 155 }); 156 157 $('select[name$=\'[country_id]\']:disabled:first').trigger('change'); 158 //--></script></div> 159 {{ footer }}