I have these panels in Bootstrap, with text written directly from html, that is, without bringing it from the database ..
The question is, is there any way to edit what you have written directly from the front end, ie without having to make a form using php and save the data to then bring them from the database?
thanks.
You can achieve it with JQuery, through an element (for example a button) that allows you to edit the text, that is, you could not simply click on the text and start editing; The solution is the following:
$('button').click(function(){
var $div=$('div'), isEditable=$div.is('.editable');
$('div').prop('contenteditable',!isEditable).toggleClass('editable')
}).editable{ background:#EAEAEA}<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>Texto editable...</div>
<br>
<button>Editar Texto</button>Pressing the button will allow you to edit and when you press it again it will block you (as it comes by default).
I hope it serves you.
Here is an example of how you could do it in Javascript.
<h1 id="mi-h1">
Texto definido desde HTML
</h1>
<div>
<input id="input" type="text">
<button id="button">
Cambiar texto
</button>
</div>
In my html I have a <h1> tag with text defined from the html code. Which will be changed with the writing in the input when you click on the button.
let h1 = document.getElementById('mi-h1');
let input = document.getElementById('input');
let button = document.getElementById('button');
button.onclick = () => {
let texto = input.value;
h1.innerHTML=texto;
}
I declare some variables referring to the html elements. Clicking on the button stores the writing in the input and puts it on the <h1> tag.