Visual editor & append to message accordion

This commit is contained in:
2022-09-09 19:31:33 -04:00
parent 6b362482e4
commit 159fd25d16
+58 -10
View File
@@ -88,7 +88,7 @@
<input type='hidden' name='contractId' value='<?php echo $contract_id; ?>'>
<div class="form-group">
<textarea cols="18" onkeypress="textContentChanged();" style="height:180px;" rows="3" id='jobmessage' name='jobmessage' class="textarea wysihtml5 wysihtml5-min form-control" placeholder="Enter message here ..."></textarea>
<textarea cols="18" onchange="textContentChanged();" style="height:180px;" rows="3" id='jobmessage' name='jobmessage' class="textarea wysihtml5 wysihtml5-min form-control" placeholder="Enter message here ..."></textarea>
</div>
<div class="form-group">
@@ -269,7 +269,7 @@
<script type="text/javascript">
<!--
var length_limit = 500;
const length_limit = 500;
var timerId = setTimeout(function tick() {
$.ajax({
url: "/proj/thisjobfiles?jobID=<?php echo $jobID; ?>"
@@ -288,13 +288,17 @@
function textContentChanged(){
/*
if (length_limit <= document.message.jobmessage.value.length){
document.message.jobmessage.value = document.message.jobmessage.value .substring(0, length_limit);
}
$('#remain_text').text(length_limit -document.message.jobmessage.value.length);
*/
var r = length_limit -document.message.jobmessage.value.length;
if (r < 0) r = 0;
$('#remain_text').text(r);
// document.message.remain_text.value= length_limit -document.message.jobmessage.value.length;
/*
if (document.message.jobmessage.value.length > 0 ){
// alert(100);
document.message.btn_cancel.disabled = false;
@@ -302,6 +306,17 @@
else{
document.message.btn_cancel.disabled = true;
}
*/
if(document.message.jobmessage.value.length > length_limit)
{
document.message.btn_submit.disabled = true;
}
else
{
document.message.btn_submit.disabled = false;
}
console.log('JobMessage Length = '+document.message.jobmessage.value.length);
console.log('JobMessage Value = '+document.message.jobmessage.value);
}
function SendMessage() {
@@ -318,12 +333,30 @@
} else {
$('#jobs_contract_message > tbody:last-child').append(res);
}
var id = Date.now();
var html = `<div class="accordion-item">
<h2 class="accordion-header" id="kt_accordion_1_header_1">
<button class="accordion-button fs-4 fw-semibold"
type="button" data-bs-toggle="collapse" data-bs-target="#kt_accordion_1_` + id + `"
aria-expanded="true" aria-controls="kt_accordion_1_body_1">
<b></b><?= $_SESSION["firstname"] ?>-` + d_str + `
</button>
</h2>
<div id="kt_accordion_1_` + id + `" class="accordion-collapse collapse" aria-labelledby="kt_accordion_1_header_1" data-bs-parent="#kt_accordion_1">
<div class="accordion-body">
` + document.message.jobmessage.value + `
</div>
</div>
</div>`;
document.message.jobmessage.value = '';
$('#jobmessage').data("wysihtml5").editor.clear();
//$('#jobmessage').data("wysihtml5").editor.clear();
$('#jobmessage').trumbowyg('empty');
$('#sendmessagenote').html('<div class=\"text-left\"><div class=\"alert alert-info no-border\">Message was sent!</div></div>');
// Append
$(html).prependTo('#kt_accordion_1');
} else {
alert(data);
alert('<div class=\"text-left\"><div class=\"alert alert-danger no-border\">Failed to send message</div></div>');
$('#sendmessagenote').html('<div class=\"text-left\"><div class=\"alert alert-danger no-border\">Failed to send message</div></div>');
}
document.message.btn_cancel.disabled = false;
document.message.btn_submit.disabled = false;
@@ -331,8 +364,23 @@
}
$(document).ready(function () {
var length_limit = 500;
$('#jobmessage').data("wysihtml5").editor.observe("load", function () {
$('#jobmessage').trumbowyg({
btns: [
['viewHTML'],
['undo','redo'],// Only supported in Blink browsers
['formatting'],
['strong','em','del'],
['superscript','subscript'],
['link'],
/* ['insertImage'], */
['justifyLeft','justifyCenter','justifyRight','justifyFull'],
['unorderedList','orderedList'],
['horizontalRule'],
['removeformat'],
['fullscreen']
]
});
/*$('#jobmessage').data("wysihtml5").editor.observe("load", function () {
editor.composer.element.addEventListener("keyup", function () {
// enter your listener-triggered code or function call here
var content = $(this).html();
@@ -341,7 +389,7 @@
$(this).html(content.substr(0, length_limit));
}
});
});
});*/
});
// -->
</script>