JSFiddle - React, Tailwind, and code Playground

by TCHdevlp

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<button id='test'>
  tester 1
</button>

<button id='test2'>
  tester 2
</button>

<div id="testdialog">
</div>
</div>

JavaScript

showConfirmMessage = function(titleName, messages, options, callbackOK, callbackCANCEL) {
	    //PERFCOM.util.popup.bindConfirmCallBacks(callbackOK, callbackCANCEL);
	    var $perfcomConfirmDialog = $('<div id="perfcomConfirmDialog" title="'+titleName+'" style="display:none;" ></div>');
      var messageFinal = "";
      
      //si messges est un tableau, on boucle sur les messages
      if(Array.isArray(messages)){
      		
      	  $.each(messages, function(index, message){
          	messageFinal += formatMessageAlerte(message);
          });
      }
      //sinon
      else{
      	messageFinal = formatMessageAlerte(messages);
      }
      $perfcomConfirmDialog.append($(messageFinal));
	    $perfcomConfirmDialog.dialog();
	};
  
  function formatMessageAlerte(message){
  	return'<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>'+message+'</p>';
  };
  
  
  
  $("#test").on('click', function(){
  	showConfirmMessage('un seul message', 'tention !!', null);
  });
  
 $("#test2").on('click', function(){
    var array = ['toto','titi'];
  	showConfirmMessage('deux message', array, null);
  });