Fragmentem mojego projektu jest panel użytkownika.
Użytkownik może wybrać z listy co umieścił i to wyedytować.
Do edycji opisu chciałbym dać mu edytor tekstowy a nie zwykłą <textarea>
I ten edytor nie chce się uruchomić.

Tak więc mamy 3 strony:
- panel.php
-lista.php
- modyfikowanie.php
W przedstawionym poniżej kodzie pominąłem zapytanie do bazy danych w pliku lista.php bo i tak to niczego nie wnosi.
Plik panel.php
Plik ten zawiera dwie funkcje js pierwsza z nich umieszcza zawartość pliku lista.php w divie "miejsce".
i przycisk do uruchomienia funkcji lista.
Kod
<html>
<head>
<script>
function lista(){
var hr = new XMLHttpRequest();
var url = "lista.php";
hr.open("POST", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("miejsce").innerHTML = return_data;
}
}
hr.send(); // Actually execute the request
document.getElementById("miejsce").innerHTML = "processing...";
}
function edytuj(id){
var id = document.getElementById("btn-"+ id).value;
var vars = "id="+id;
var hr = new XMLHttpRequest();
var url = "modyfikowanie.php";
hr.open("POST", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("miejsce").innerHTML = return_data;
}
}
hr.send(vars); // Actually execute the request
document.getElementById("miejsce").innerHTML = "processing...";
}
</script>
</head>
<body>
<button class='button' onclick='lista()'>lista</button>
</br>
<div id="miejsce"></div>
</body>
</html>
<head>
<script>
function lista(){
var hr = new XMLHttpRequest();
var url = "lista.php";
hr.open("POST", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("miejsce").innerHTML = return_data;
}
}
hr.send(); // Actually execute the request
document.getElementById("miejsce").innerHTML = "processing...";
}
function edytuj(id){
var id = document.getElementById("btn-"+ id).value;
var vars = "id="+id;
var hr = new XMLHttpRequest();
var url = "modyfikowanie.php";
hr.open("POST", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("miejsce").innerHTML = return_data;
}
}
hr.send(vars); // Actually execute the request
document.getElementById("miejsce").innerHTML = "processing...";
}
</script>
</head>
<body>
<button class='button' onclick='lista()'>lista</button>
</br>
<div id="miejsce"></div>
</body>
</html>
Następnie mamy plik lista.php
Pięć przycisków "edytuj" służących do edytowania (czyli uruchomienia pliku "modyfikuj.php" 5 umieszczonych przez klienta ofert.
Kod
<?php
$ile_znalezionych =5;
for($i=0; $i <$ile_znalezionych; $i++){
echo "<input type='hidden' id='btn-$i' name='numer' value=$i>";
echo "<button class='button' onclick='edytuj($i)'>Edytuj</button>";
echo "</br>";
}
?>
$ile_znalezionych =5;
for($i=0; $i <$ile_znalezionych; $i++){
echo "<input type='hidden' id='btn-$i' name='numer' value=$i>";
echo "<button class='button' onclick='edytuj($i)'>Edytuj</button>";
echo "</br>";
}
?>
I dochodzimy do sedna czyli pliku modyfikuj.php
Kod
<script src="jodit/jodit.min.js"></script>
<link rel="stylesheet" href="jodit/jodit.min.css">
<style>
#box {
padding: 100px;
margin: 20px;
position: relative;
}
</style>
<script>
const editor = new Jodit('#editor', {
language: 'pl',
// textIcons: true,
uploader: {
url: 'https://xdsoft.net/jodit/connector/index.php?action=fileUpload'
},
filebrowser: {
ajax: {
url: 'https://xdsoft.net/jodit/connector/index.php'
}
}
});
</script>
<div id="box">
<div id="editor">
Tu powinien być edytor
</div>
</div>
<link rel="stylesheet" href="jodit/jodit.min.css">
<style>
#box {
padding: 100px;
margin: 20px;
position: relative;
}
</style>
<script>
const editor = new Jodit('#editor', {
language: 'pl',
// textIcons: true,
uploader: {
url: 'https://xdsoft.net/jodit/connector/index.php?action=fileUpload'
},
filebrowser: {
ajax: {
url: 'https://xdsoft.net/jodit/connector/index.php'
}
}
});
</script>
<div id="box">
<div id="editor">
Tu powinien być edytor
</div>
</div>
I teraz tak jak uruchomię wyłącznie plik "modyfikuj.php to edytor jest.
Jeżeli dojdę do niego poprzez pliki panel/lista to edytora nie ma.
Gdzie jest błąd?