library/options_listadd.inc

   1 <?php
   2
   3 /**
   4  * This include is just a HTML and JS *fragment* it CANNOT stand alone
   5  *
   6  * This file is used to include the capability to have a pop-up DIV in which
   7  * a user can add a new option to a list box. Primarily this is for the
   8  * demographics, history, and referral screens. This code could be used elsewhere
   9  * as long as it had the required supporting HTML and JS
  10  *
  11  * REQUIRED to make work:
  12  *  - jQuery
  13  *  - form element with the class '.addtolist'
  14  *  - be used in a file that already includes globals.php
  15  *
  16  * @package   OpenEMR
  17  * @link      http://www.open-emr.org
  18  * @author    Brady Miller <brady.g.miller@gmail.com>
  19  * @copyright Copyright (c) 2018 Brady Miller <brady.g.miller@gmail.com>
  20  * @license   https://github.com/openemr/openemr/blob/master/LICENSE GNU General Public License 3
  21  */
  22
  23 // TODO: Convert this to a modal or a dialog
  24
  25 use OpenEMR\Common\Csrf\CsrfUtils;
  26
  27 ?>
  28
  29
  30 <!-- hidden DIV used for creating new list items -->
  31 <div id="newlistitem" class="position-absolute bg-light border border-dark" style="display: none; padding: 5px; z-index: 5000;">
  32  <input type="hidden" name="newlistitem_listid" id="newlistitem_listid" value="" />
  33  <input type="hidden" name="newlistitem_fieldid" id="newlistitem_fieldid" value="" />
  34  <div id="specificForm">
  35  </div>
  36  <div class="text-center">
  37   <div style='margin-top: 0.5rem;'>
  38    <input type='button' class='btn btn-primary' name='newlistitem_submit' id='newlistitem_submit' value='<?php echo xla('Add'); ?>' />
  39    <input type='button' class='btn btn-secondary' name='newlistitem_cancel' id='newlistitem_cancel' value='<?php echo xla('Cancel'); ?>' />
  40   </div>
  41  </div>
  42 </div>
  43
  44
  45 <script>
  46
  47     // collect the custom state widget flag
  48     var stateCustomFlag = <?php echo json_encode($GLOBALS['state_custom_addlist_widget']); ?>;
  49
  50     // generic form for input box
  51     var generic = "<input type='text' class='form-control' name='newlistitem_value' id='newlistitem_value' size='20' maxlength='50' />";
  52
  53     // state form for input box
  54     var state   = "\
  55 <ul class='m-0 p-0 list-unstyled'>\
  56  <li class='text-center font-weight-bold' style='font-size:120%;'>\
  57     <?php echo xlt('Enter new State'); ?></li>\
  58  <li class='p-0' style='margin-top: 0.5rem;'>\
  59     <?php echo xlt('Full Name'); ?>:\
  60   <input type='text' class='form-control' name='newlistitem_value' id='newlistitem_value' size='20' maxlength='50' /><li>\
  61  <li class='p-0' style='margin-top: 0.5rem;'>\
  62     <?php echo xlt('Abbreviation'); ?>:\
  63   <input type='text' class='form-control' name='newlistitem_abbr' id='newlistitem_abbr' size='10' maxlength='50' /><li>\
  64 </ul>\
  65 ";
  66
  67 // jQuery makes life easier (sometimes)
  68
  69 $(function () {
  70
  71     /********************************************************/
  72     /************ List-box modification functions ***********/
  73     /********************************************************/
  74
  75     $("#newlistitem").on("keypress", function(evt) { if (evt.keyCode == 13) { SaveNewListItem(this, evt); return false; }});
  76     $(".addtolist").on("click", function(evt) { AddToList(this, evt); });
  77     $("#newlistitem_submit").on("click", function(evt) { SaveNewListItem(this, evt); });
  78     $("#newlistitem_cancel").on("click", function(evt) { CancelAddToList(this, evt); });
  79
  80     // display the 'new list item' DIV at the mouse position
  81     var AddToList = function(btnObj, e) {
  82         // capture the ID of the list and specific field being modified from the object's ID
  83         $('#newlistitem_listid').val($(btnObj).attr("id").replace(/^addtolistid_/g, ""));
  84         $('#newlistitem_fieldid').val($(btnObj).attr("fieldid"));
  85
  86         // REMOVE previous form
  87     $("#specificForm").empty();
  88
  89     // INSERT the selected form
  90     if (($("#newlistitem_listid").val() == "state") && (stateCustomFlag)) {
  91      // insert state form and clear values
  92          $("#specificForm").append(state);
  93          $('#newlistitem_value').val("");
  94          $('#newlistitem_abbr').val("");
  95     }
  96     else {
  97      // insert generic form and clear values
  98      $("#specificForm").append(generic);
  99      $('#newlistitem_value').val("");
 100         }
 101
 102         // make the item visible before setting its x,y location
 103         $('#newlistitem').css('display', 'inline');
 104         //getting height and width of the message box
 105         var height = $('#newlistitem').height();
 106         var width = $('#newlistitem').width();
 107         //calculating offset for displaying popup message
 108         leftVal = e.pageX - (width / 2) + "px";
 109         topVal = e.pageY - (height / 2) + "px";
 110         //show the DIV and set cursor focus
 111         $('#newlistitem').css({left:leftVal,top:topVal}).show();
 112         $('#newlistitem_value').focus();
 113     };
 114
 115     // hide the add-to-list DIV and clear its textbox
 116     var CancelAddToList = function(btnObj, e) {
 117         $('#newlistitem').hide();
 118     }
 119
 120     // save the new list item to the given list
 121     var SaveNewListItem = function(btnObj, e) {
 122     // VALIDATE the selected form
 123         //  Don't allow a number as first character
 124         //  Don't allow illegal characters (' and " for now) - still developing
 125     //   First, validate fields common to all forms
 126         if ($("#newlistitem_value").val().match(/^\d/)) {
 127             alert(<?php echo xlj('List items can not start with a number.'); ?>);
 128             $("#newlistitem_value").focus();
 129             return false;
 130         }
 131         if ($("#newlistitem_value").val().match(/[\'\"]/)) {
 132             alert(<?php echo xlj('List items contains illegal character(s).'); ?>);
 133             $("#newlistitem_value").focus();
 134             return false;
 135         }
 136     //  Second, validate form specific fields
 137         if (($("#newlistitem_listid").val() == "state") && (stateCustomFlag)) {
 138             // state forms specific validation
 139             if ($("#newlistitem_abbr").val().match(/^\d/)) {
 140                 alert(<?php echo xlj('List items can not start with a number.'); ?>);
 141                 $("#newlistitem_abbr").focus();
 142                 return false;
 143             }
 144             if ($("#newlistitem_abbr").val().match(/[\'\"]/)) {
 145                 alert(<?php echo xlj('List items contains illegal character(s).'); ?>);
 146                 $("#newlistitem_abbr").focus();
 147                 return false;
 148             }
 149         }
 150
 151         // PROCESS the selected form
 152         if (($("#newlistitem_listid").val() == "state") && (stateCustomFlag)) {
 153         // process state form
 154         //  (note we have collected a title and abbreviation)
 155         var listid = $("#newlistitem_listid").val();
 156         var newitem = $('#newlistitem_value').val();
 157         var newitem_abbr = $('#newlistitem_abbr').val();
 158
 159     }
 160     else {
 161         // process generic form
 162         //  (note we have only collected the title, so will make
 163         //   abbreviation same as title)
 164         var listid = $("#newlistitem_listid").val();
 165         var newitem = $('#newlistitem_value').val();
 166         var newitem_abbr = $('#newlistitem_value').val();
 167     }
 168
 169         // make the AJAX call to save the new value to the specified list
 170         // upon returning successfully, refresh the list box and select
 171         // the new list item
 172         $.getJSON("<?php echo $GLOBALS['webroot']; ?>/library/ajax/addlistitem.php",
 173                     {csrf_token_form: <?php echo js_escape(CsrfUtils::collectCsrfToken()); ?>,
 174                     listid: listid,
 175              newitem: newitem,
 176              newitem_abbr: newitem_abbr},
 177                     function(jsondata, txtresponse) {
 178                  if( jsondata.error == '' ){
 179               //process each widget with the same list
 180             $("select.addtolistclass_"+listid).each(function(){
 181                 var pointer = $(this);
 182                 var currentselected = pointer.val();
 183                 var listboxfield = pointer.attr("id");
 184                 var listbox = document.getElementById(listboxfield);
 185                             while (listbox.options.length > 0) { listbox.options[0] = null; }
 186                             $.each(jsondata.options, function () {
 187                     if (listboxfield == $('#newlistitem_fieldid').val()) {
 188                     // build select for the chosen widget field
 189                                     listbox.options[listbox.options.length] = new Option(this.title, this.id);
 190                                     if (this.id == newitem_abbr) {
 191                         pointer.val(this.id);
 192                                     }
 193                 }
 194                 else {
 195                     // build select for the other widgets using the same list
 196                     listbox.options[listbox.options.length] = new Option(this.title, this.id);
 197                     if (this.id == currentselected) {
 198                       pointer.val(currentselected);
 199                     }
 200                 }
 201               });
 202             });
 203             // now hide the DIV
 204             $('#newlistitem').hide();
 205              } else {
 206                alert(jsondata.error);
 207              }
 208            }
 209          );
 210
 211     }  // end SaveNewListItem
 212
 213 }); // end jQuery .ready
 214 </script>