Mercurial > hg > extraction-interface
changeset 18:115dda3d1728
configTagsInTopic with select-list-move UI
author | Zoe Hong <zhong@mpiwg-berlin.mpg.de> |
---|---|
date | Mon, 23 Feb 2015 10:55:28 +0100 |
parents | 82f8c6bd2b69 |
children | f60969462226 |
files | develop/views/Extractapp/configtagsintopic.php |
diffstat | 1 files changed, 116 insertions(+), 20 deletions(-) [+] |
line wrap: on
line diff
--- a/develop/views/Extractapp/configtagsintopic.php Fri Feb 20 17:57:02 2015 +0100 +++ b/develop/views/Extractapp/configtagsintopic.php Mon Feb 23 10:55:28 2015 +0100 @@ -12,9 +12,123 @@ </head> <body> +<script type="text/javascript"> +function SelectMoveRows(s1, s2) +{ + var selId = ''; + var selText = ''; + // Move rows from s1 to s2 from bottom to top + for (i = s1.options.length - 1; i >= 0; i--) + { + if (s1.options[i].selected == true) + { + selId = s1.options[i].value; + selText = s1.options[i].text; + var newRow = new Option(selText,selId); + s2.options[s2.length] = newRow; + s1.options[i] = null; + } + } + SelectSort(s2); +} +function SelectSort(selList) +{ + var id = ''; + var t = ''; + for (x = 0; x < selList.length - 1; x++) + { + for (y = x+1; y < selList.length; y++) + { + if (selList[x].text > selList[y].text) + { + // Swap rows + id = selList[x].value; + t = selList[x].text; + selList[x].value = selList[y].value; + selList[x].text = selList[y].text; + selList[y].value = id; + selList[y].text = t; + } + } + } +} + - <form autocomplete='off' action="Javascript:checkTopic(this)"> +function checkTopic(t) { + // TODO: save the modification into topic_tag_relation + var id = t.name; + var val; + console.log(id); + + + + +} + +</script> + +<div class="container-fluid"> + <div class="row"> + <div class="col-xs-12 col-sm-12 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3"> + + <form name="config" autocomplete='off' action="Javascript:checkTopic(this)"> + <h3>Topic: <?php echo $topic_name;?> </h3> + + <table class="table"> + <thead> + <tr> + <td class="text-warning"> Selected tags </td> + <td></td> + <td class="text-warning"> Other tags </td> + </tr> + </thead> + <tbody> + <tr> + <td> + <select name="InTopic" size="<?php echo count($taglistArray)*0.8; ?>" class="form-control" multiple> + <?php + foreach ($taglistArray as $taglistValue) { + if ($taglistValue['topic_id'] == $topic) { + echo "<option value='".$taglistValue['tag']."' class='text-primary'>".$taglistValue['name']."</option>"; + } + } + ?> + </select> + </td> + <td align="center" valign="middle"> + <input type="button" value="<< Add" class="btn btn-primary" onClick="SelectMoveRows(document.config.Others, document.config.InTopic)"><br> + <br> + <input type="button" value="Remove >>" class="btn btn-warning" onClick="SelectMoveRows(document.config.InTopic, document.config.Others)"><br> + </td> + <td > + <select name="Others" size="<?php echo count($taglistArray)*0.8; ?>" class="form-control" multiple> + <?php + foreach ($taglistArray as $taglistValue) { + if ($taglistValue['topic_id'] != $topic) { + echo "<option value='".$taglistValue['tag']."' class='text-muted' >".$taglistValue['name']."</option>"; + } + } + ?> + </select> + </td> + </tr> + <tr> + <td></td> + <td><input type="submit" value="Submit" class="btn btn-lg btn-success"></td> + <td></td> + </tr> + </tbody> + </table> + + + </form> + </div> + </div> +</div> + + <!-- + <form name="config" autocomplete='off' action="Javascript:checkTopic(this)"> <h3>Topic: <?php echo $topic_name;?> </h3> <div> Select/Unselect the following tags for the topic. </div> <input type="submit" value="Submit"> @@ -47,26 +161,8 @@ </table> </form> + --> - <script type="text/javascript"> - function checkTopic(t) { - console.log("DEBUG"); - // TODO: save the modification into topic_tag_relation - - var id = t.name; - var val; - console.log(id); - /* - if (t.checked) { - val = '1'; - } else { - val = '0'; - } - */ - - } - - </script> </body> </html>