Skip to content

aa.gusti / opensipkd-base

Go to a project
Commit 21482e15 by aa.gusti
Options

perbikan template select2_ms

1 parent 1927989d
Inline Side-by-side
Showing 1 changed file with 48 additions and 46 deletions
opensipkd/base/views/widgets/select2_ms.pt
...@@ -7,11 +7,9 @@ ...@@ -7,11 +7,9 @@
optgroup_class optgroup_class|field.widget.optgroup_class; optgroup_class optgroup_class|field.widget.optgroup_class;
multiple multiple|field.widget.multiple; multiple multiple|field.widget.multiple;
url url|field.widget.url; url url|field.widget.url;
slave slave|field.widget.slave;" slave slave|field.widget.slave;" tal:omit-tag="">
tal:omit-tag="">
<style> <style>
.select2-selection.form-control { .select2-selection.form-control {
padding: 0px 0px; padding: 0px 0px;
} }
...@@ -20,10 +18,8 @@ ...@@ -20,10 +18,8 @@
.select2-container--default .select2-selection--single { .select2-container--default .select2-selection--single {
border: 1px solid #ccc; border: 1px solid #ccc;
} }
</style> </style>
<input type="hidden" name="__start__" value="${name}:sequence" <input type="hidden" name="__start__" value="${name}:sequence" tal:condition="multiple" />
tal:condition="multiple" />
<select tal:attributes=" <select tal:attributes="
name name; name name;
...@@ -34,18 +30,15 @@ ...@@ -34,18 +30,15 @@
style style; style style;
attributes|field.widget.attributes|{};"> attributes|field.widget.attributes|{};">
<tal:loop tal:repeat="item values"> <tal:loop tal:repeat="item values">
<optgroup tal:condition="isinstance(item, optgroup_class)" <optgroup tal:condition="isinstance(item, optgroup_class)" tal:attributes="label item.label">
tal:attributes="label item.label"> <option tal:repeat="(value, description) item.options" tal:attributes="
<option tal:repeat="(value, description) item.options"
tal:attributes="
selected python:field.widget.get_select_value(cstruct, value); selected python:field.widget.get_select_value(cstruct, value);
class css_class; class css_class;
label field.widget.long_label_generator and description; label field.widget.long_label_generator and description;
value value" value value"
tal:content="field.widget.long_label_generator and field.widget.long_label_generator(item.label, description) or description"/> tal:content="field.widget.long_label_generator and field.widget.long_label_generator(item.label, description) or description" />
</optgroup> </optgroup>
<option tal:condition="not isinstance(item, optgroup_class)" <option tal:condition="not isinstance(item, optgroup_class)" tal:attributes="
tal:attributes="
selected python:field.widget.get_select_value(cstruct, item[0]); selected python:field.widget.get_select_value(cstruct, item[0]);
class css_class; class css_class;
value item[0]">${item[1]}</option> value item[0]">${item[1]}</option>
...@@ -54,47 +47,56 @@ ...@@ -54,47 +47,56 @@
<script type="text/javascript"> <script type="text/javascript">
deform.addCallback( deform.addCallback(
'${field.oid}', '${field.oid}',
function (oid) { function (oid) {
$('#' + oid).select2({ $('#' + oid).select2({
containerCssClass: 'form-control', containerCssClass: 'form-control',
placeholder: "${str(field.widget.placeholder).replace('"','\\"')|""}" || undefined, placeholder: "${str(field.widget.placeholder).replace('"','\\"')|""}" || undefined,
allowClear: "${hasattr(field.widget, 'placeholder')}", allowClear: "${hasattr(field.widget, 'placeholder')}",
tags: ${str(getattr(field.widget, 'tags', 'undefined')).lower()} tags: ${str(getattr(field.widget, 'tags', 'undefined')).lower()}
}); });
} }
); );
</script> </script>
<script type="text/javascript" tal:condition="url and slave"> <script type="text/javascript" tal:condition="url and slave">
deform.addCallback( deform.addCallback(
'${field.oid}', '${field.oid}',
function (oid) { function (oid) {
$('#' + oid).change(function () { $('#' + oid).change(function () {
$("#${slave}").val(""); $("#${slave}").val("");
$("#${slave}").empty(); $("#${slave}").empty();
$("#${slave}").append('<option value="" selected disabled>Pilih Data...</option>'); $("#${slave}").append('<option value="" selected disabled>Pilih Data...</option>');
let value = $(this).val(); let value = $(this).val();
if (value) { if (value) {
$.ajax({ $.ajax({
type: "GET", type: "GET",
url: "${url}" + value, url: "${url}" + value,
success: function (res) { success: function (res) {
if (res) { if (res) {
$.each(res, function (key, value) { var def_value = null;
$("#${slave}").append('<option value="' + key + '">' + value + '</option>'); if (res.hasOwnProperty("default")) {
}); values = res.values;
} else { def_value = res.default;
$("#${slave}").empty();
} }
else
values = res;
$.each(values, function (key, value) {
if (key === def_value)
$("#${slave}").append('<option value="' + key + '" selected>' + value + '</option>');
else
$("#${slave}").append('<option value="' + key + '">' + value + '</option>');
});
} else {
$("#${slave}").empty();
} }
}); }
} });
$("#${slave}").change(); }
}); $("#${slave}").change();
}); });
});
</script> </script>
<input type="hidden" name="__end__" value="${name}:sequence" <input type="hidden" name="__end__" value="${name}:sequence" tal:condition="multiple" />
tal:condition="multiple" /> </div>
</div>
\ No newline at end of file \ No newline at end of file
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!