diff options
| author | Geo Halkiadakis <gchalkiadakis@sklavenitis.co.gr> | 2026-07-12 15:51:52 +0300 |
|---|---|---|
| committer | Geo Halkiadakis <gchalkiadakis@sklavenitis.co.gr> | 2026-07-12 15:51:52 +0300 |
| commit | 02608271bb2a9f3a65ed536984d306ee14b48e34 (patch) | |
| tree | 3f23ec48a694ec014e845c4f70d9b5f1c065403c /public/tests/01.php | |
| download | kalassa-master.tar.gz kalassa-master.tar.bz2 kalassa-master.zip | |
Diffstat (limited to 'public/tests/01.php')
| -rw-r--r-- | public/tests/01.php | 129 |
1 files changed, 129 insertions, 0 deletions
diff --git a/public/tests/01.php b/public/tests/01.php new file mode 100644 index 0000000..eaa9000 --- /dev/null +++ b/public/tests/01.php @@ -0,0 +1,129 @@ +<!DOCTYPE html> +<html> +<head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <link rel="stylesheet" href="/css/select2.min.css" /><!-- v4.0.10 --> + + <style> + body { margin: 1em; font-family: Roboto, sans-serif; font-size: .92em; } + .container { width: 100%; max-width: 640px; margin: 1em auto; } + </style> +</head> +<body> + <div class="container"> + + <select class="" name="store_id[]" multiple="multiple"> + </select> + + <br/> + <br/> + + <h2><say>Καλημέρα</say></h2> + + <br/> + + <i><say>Όλα καλά;</say></i> + + <br/> + + <h3><say>Τι στο διάλο ειν' τούτο;</say></h3> + + <br/> + + <pre id="console"> + </pre> + + <a class="-echo-" href="#">Show Values</a> — + <a class="-select-" href="#">Select two Specific</a> — + <a class="-clear-" href="#">Clear Values</a> + + </div> +</body> + +<?php + $translate = array( + "Καλημέρα" => 'Good Morning!', + "Τι στο διάλο ειν' τούτο;" => "what the fuck is that?" + ); +?> + + <script> + + // translations +var trans = <?=json_encode($translate, JSON_PRETTY_PRINT|JSON_UNESCAPED_UNICODE)?>; +const tr_ = document.querySelectorAll("say"); // <say> tags host texts-to-translate +for (var i = 0; i < tr_.length; i++) { + tr_[i].outerHTML = _dotr(tr_[i].innerHTML); // replace innerHTML; remove <say> tag + // credits: izzulmakin@ https://stackoverflow.com/questions/4232961/ +} +function _dotr(x) { + for (var key in trans) { + if ((trans.hasOwnProperty(key)) && (key == x)) + return trans[key]; + } + console.log(x); // log un-translated phrases + return x; +} + + </script> + + + <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> + <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.4.1/jquery-migrate.min.js"></script> --> + <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.full.min.js"></script> + <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/i18n/el.js"></script> + + <script type="text/javascript"> + +var store_select2; +var storesData; + +// FUNCTION: Get selected value(s) of Select2 control +// pass arg: source-element +// return: value(s) comma-separated +// --------------------------------------------------------------------------- +function getValues(srcElm) { + var values = []; + var obj = srcElm.select2('data'); // get data array + if (obj.length === 0) return ''; // if empty list then nothig is selected + else { + obj.forEach(function(elm) { // loop through object elements array + values.push(elm.id); // push id + }); + } + return values.join(','); +} + +$(document).ready(function() { // ON DOCUMENT READY (code-block start) + + $.getJSON("/tests/stores.json", // ask for data + function(data) { + storesData = data.results; // when response arrives, construct select2 + store_select2 = $('select[name="store_id[]"]').select2({ + data: storesData, + width: '100%' + }); + } + ); + + $('.-echo-').click(function() { + $('#console').text( getValues(store_select2) ); // echo selected values + }); + + $('.-select-').click(function() { + store_select2.val([51,401]).trigger('change'); // set values 51,401 (Athens + Heraklion) + $('.-echo-').trigger('click'); + }); + + $('.-clear-').click(function() { + store_select2.val([]).trigger('change'); + $('.-echo-').trigger('click'); + }); + + +}); //// on document ready (code-block start) + + </script> + +</html> |