mirror of
https://github.com/Combodo/iTop.git
synced 2026-04-23 02:28:44 +02:00
N°931 TagSet widget and its POC are now more generic (to be used in all AttributeSet hierarchy)
This commit is contained in:
Pierre Goiffon
96
test/attributeset_widget_poc.html
Normal file
96
test/attributeset_widget_poc.html
Normal file
@@ -0,0 +1,96 @@
|
||||
<!--
|
||||
~ Copyright (c) 2010-2018 Combodo SARL
|
||||
~
|
||||
~ This file is part of iTop.
|
||||
~
|
||||
~ iTop is free software; you can redistribute it and/or modify
|
||||
~ it under the terms of the GNU Affero General Public License as published by
|
||||
~ the Free Software Foundation, either version 3 of the License, or
|
||||
~ (at your option) any later version.
|
||||
~
|
||||
~ iTop is distributed in the hope that it will be useful,
|
||||
~ but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
~ GNU Affero General Public License for more details.
|
||||
~
|
||||
~ You should have received a copy of the GNU Affero General Public License
|
||||
~ along with iTop. If not, see <http://www.gnu.org/licenses/>
|
||||
~
|
||||
-->
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AttributeSet fields widget test</title>
|
||||
|
||||
<script>
|
||||
var aDictEntries = {"Core:AttributeSet:placeholder": "click to add"};
|
||||
</script>
|
||||
|
||||
<script src="../js/utils.js"></script>
|
||||
<script src="../js/jquery-3.3.1.min.js"></script>
|
||||
<script src="../js/jquery-ui-1.11.4.custom.min.js"></script>
|
||||
<script src="../js/selectize.min.js"></script>
|
||||
<script src="../js/jquery.itop-set-widget.js"></script>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="../css/light-grey.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/selectize.default.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<form>
|
||||
<div class="field_container">
|
||||
<div>
|
||||
<div class="field_value">
|
||||
<div class="attribute-edit">
|
||||
<div class="field_input_zone field_input_tagset">
|
||||
<label>Exemple un champ : </label>
|
||||
<textarea id="tagset-field" rows="30" cols="60">
|
||||
{
|
||||
"possible_values": [
|
||||
{
|
||||
"code": "critical",
|
||||
"label": "Critical ticket"
|
||||
},
|
||||
{
|
||||
"code": "high",
|
||||
"label": "don't forget it !"
|
||||
},
|
||||
{
|
||||
"code": "normal",
|
||||
"label": "when time available"
|
||||
},
|
||||
{
|
||||
"code": "low",
|
||||
"label": "don't worry ;)"
|
||||
}
|
||||
],
|
||||
"max_items_allowed": 3,
|
||||
"partial_values": [
|
||||
"low"
|
||||
],
|
||||
"orig_value": [
|
||||
"critical",
|
||||
"low"
|
||||
],
|
||||
"added": "",
|
||||
"removed": ""
|
||||
}
|
||||
</textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
<script>
|
||||
$("#tagset-field").set_widget({isDebug: true});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,117 +0,0 @@
|
||||
<!--
|
||||
~ Copyright (c) 2010-2018 Combodo SARL
|
||||
~
|
||||
~ This file is part of iTop.
|
||||
~
|
||||
~ iTop is free software; you can redistribute it and/or modify
|
||||
~ it under the terms of the GNU Affero General Public License as published by
|
||||
~ the Free Software Foundation, either version 3 of the License, or
|
||||
~ (at your option) any later version.
|
||||
~
|
||||
~ iTop is distributed in the hope that it will be useful,
|
||||
~ but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
~ GNU Affero General Public License for more details.
|
||||
~
|
||||
~ You should have received a copy of the GNU Affero General Public License
|
||||
~ along with iTop. If not, see <http://www.gnu.org/licenses/>
|
||||
~
|
||||
-->
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>TagSet fields widget test</title>
|
||||
|
||||
<script>
|
||||
var aDictEntries = {"Core:AttributeTagSet:placeholder": "click to add"};
|
||||
</script>
|
||||
|
||||
<script src="../js/utils.js"></script>
|
||||
<script src="../js/jquery-3.3.1.min.js"></script>
|
||||
<script src="../js/jquery-ui-1.11.4.custom.min.js"></script>
|
||||
<script src="../js/selectize.min.js"></script>
|
||||
<script src="../js/jquery.itop-tagset-widget.js"></script>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="../css/selectize.default.css">
|
||||
|
||||
<style>
|
||||
div.selectize-control {
|
||||
position: static;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
div.selectize-input {
|
||||
width: auto;
|
||||
min-width: 8em;
|
||||
}
|
||||
|
||||
div.selectize-input.has-items:after {
|
||||
content: "➕";
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.selectize-control > div.selectize-input > div.item.partial-code {
|
||||
color: floralwhite;
|
||||
background-color: grey;
|
||||
background-image: linear-gradient(to bottom, white, grey);
|
||||
border-color: darkgray;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
div.selectize-control > div.selectize-input > div.item.partial-code.active {
|
||||
background-image: linear-gradient(to bottom, grey, darkgrey);
|
||||
}
|
||||
|
||||
div.selectize-control > div.selectize-input > div.item.partial-code > a.remove {
|
||||
border-color: grey;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<form>
|
||||
<label>Exemple un champ : </label>
|
||||
<textarea id="tagset-field" rows="30" cols="60">
|
||||
{
|
||||
"possible_values": [
|
||||
{
|
||||
"code": "critical",
|
||||
"label": "Critical ticket"
|
||||
},
|
||||
{
|
||||
"code": "high",
|
||||
"label": "don't forget it !"
|
||||
},
|
||||
{
|
||||
"code": "normal",
|
||||
"label": "when time available"
|
||||
},
|
||||
{
|
||||
"code": "low",
|
||||
"label": "don't worry ;)"
|
||||
}
|
||||
],
|
||||
"partial_values": [
|
||||
"low"
|
||||
],
|
||||
"orig_value": [
|
||||
"critical",
|
||||
"low"
|
||||
],
|
||||
"added": "",
|
||||
"removed": ""
|
||||
}
|
||||
</textarea>
|
||||
</form>
|
||||
|
||||
|
||||
<script>
|
||||
$("#tagset-field").tagset_widget({isDebug: true});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user