Dodawanie i usuwanie notatek ze strony

Makhart · 25 Stycznia 2016

Witam zrobiłem sobie w php takie coś:

<!DOCTYPE html>
<html lang="pl">
<head>
	<meta HTTP-EQUIV="REFRESH" CONTENT="0; URL=../?page=clipboard"> 
</head>
<body>
<?php
	$area = $_POST['area'];
	$file = '../note.php';
	$old = file_get_contents($file);
	$fp = fopen($file, "w");
		flock($fp, 2);
		$text = "
	<article>
		$area<br />
	</article>
".$old;
		$add = fwrite($fp, $text);
		flock($fp, 3);
		fclose($fp);
?>
</body>
</html>

Efekt tego wygląda tak:

https://i.imgur.com/LtMXZLe.png

Jakiś tam zrobiony przez ze mnie na szybko design i zapisywanie do pliku note.php

PS kod z góry może być dla niektórych być może nierozumny, więc wyjaśniam.. jako że polak potrafi to napisałem to jakoś tak magicznie że

artykuły które się dodają do pliku są zapisywanie odwrotnie .. czyli zapis polega na zasadzie dopisz z przodu - coś co w php normalnie się nie

da zrobić więc trzeba kombinować żeby potem te "posty / wpisy" były pokazywane od góry najnowsze.

Tutaj w tym momencie muszę prosić o pomoc. Szukałem czegoś w deseń removeThisChild lub removeChild żeby tam do tego article co się zapisuje za każdym razem dodawało również magiczny guzik-button, że w momencie jak ktoś kliknie w niego to on wie w jakim article jest i usuwa cały znacznik z zawartością z pliku note.php

Jeśli macie jakieś nowsze rozwiązania na miarę profesjonalizmu korzystania z mysql phpmyadmin to bardzo bym prosił. (robiłem to na pliku lokalnym dlatego że aż tak dużo danych tam nie miał aż zapisywać, a to miał być notatnik.

so..)

Pozdrawiam

Jakub · 26 Stycznia 2016

Ja bym to zrobił na bazie pliku .json zamiast tekstowego. Będzie to o wiele wygodniejsze do edycji. Załóżmy, że mamy taki plik JSON.

[
    "NOTKA1",
    "NOTKA2"
]

Pobieramy sobie zawartość naszego pliku, ja go nazwałem notes.json i dekodujemy go do postaci tablicy asocjacyjnej.

$content = file_get_contents('notes.json');
$json = json_decode($content, true);

Wyświetlamy nasze notatki wraz z przyciskiem

$numer = 0;
foreach($json as $a) {
  echo "{$a} <a href=\"?usun={$numer}\"><input type=\"button\" name=\button{$numer}\" value=\"USUŃ\"/></a> <br>";
  $numer++;
}

Po naciśnięciu przycisku USUŃ zostaniemy przekierowani do strony ?usun={numer}, wszystko zależy jakie jest "id" naszej notki. Nasze notatki do nic innego jak zwykła tablica w PHP, dlatego numer = 0, ponieważ tablice indeksujemy od 0. Z każdą notką po kolei numer będzie się zwiększał. Pierwsza notka 0, druga 1, trzecia 2 itd.

Sprawdzamy czy w linku mamy zdefiniowane zmienną 'usun' tablicy globalnej $_GET. Usuwamy z naszej tablicy element o danym "id". Sortujemy naszą tablicę (bez tego mając tablicę z wartościami 1, 2, 3 (czyli wartości będące na pozycjach 0, 1, 2) zostalibyśmy z dwoma liczbami 1 i 3, a pozycje wyglądałyby następująco: 0, 2. Po zastosowaniu array_values otrzymamy 0, 1). Enkodujemy naszą tablicę asocjacyjną do postaci JSONa, zapisujemy i przekierowujemy użytkownika na np. stronę główną lub w zależności od tego jak nazywa się strona z notatkami (efekt usunięcia widać natychmiast, bez konieczności ręcznego przeładowania).

if(isset($_GET['usun'])) {
  unset($json[$_GET['usun']]);
  $sorted_json = array_values($json);
  $new_content = json_encode($sorted_json, JSON_PRETTY_PRINT);
  file_put_contents('notes.json', $new_content);
  header('location: index.php');
}

Z góry zaznaczam, ze kod w żaden sposób nie jest zabezpieczony przed danymi wprowadzanymi przez użytkownika, to jest tylko kod przykładowy.

27 Stycznia 2016

Żeby dopisać coś z przodu, wystarczy zrobić tak

file_put_contents("note.php", "abc".file_get_contents("note.php"));

28 Stycznia 2016

I jeżeli, chcesz zrobić to porządnie (AJAX, obsługa braku JS itd.), to zrób to w ten sposób

<?php
class Note {
    private $content;
    private $timestamp;
    
    public function __construct($c, $ts)
    {
        $this->content = $c;
        $this->timestamp = $ts;
    }
    
    public function getContent() {
        return $this->content;
    }
    public function getOutput() {
        $godzina = date("H:i", $this->getTimestamp());
        return <<<EOF
    <article data-ts="{$this->timestamp}">
        <p>{$this->content}</p>
        <span delBtn><a href="?do=remove&ts={$this->timestamp}">X</a></span>
        <span class='artDetails'>napisano o {$godzina}</span>
    </article>    
EOF;
    }
    public function getTimestamp() {
        return $this->timestamp;
    }
}

class Notes {
    private $notesList;
    
    //
    private $dbFile = "zbior.data";
    //
    
    public function __construct() {
        $this->notesList = array();
        if (file_exists($this->dbFile))
            $this->notesList = unserialize(file_get_contents($this->dbFile));
    }
    
    public function getNotesList() {
        return $this->notesList;
    }
    public function getOutput() {
        $html = "<div class='notesList'>";
        foreach (array_reverse($this->getNotesList()) as $note)        
            $html .= $note->getOutput();
        $html .= "</div>";
        return $html;
    }
    public function addNote($content) {
        $this->notesList[] = new Note($content, time());
        $this->saveNotesList();
        return end($this->notesList)->getOutput();
    }
    public function removeNote($ts) {
        for ($i = 0; $i < count($this->getNotesList()); $i++)        
            if ($this->notesList[$i]->getTimestamp() == $ts)
            {
                array_splice($this->notesList, $i, 1);                
                $this->saveNotesList();
                break;
            }
    }
    public function saveNotesList() {        
        file_put_contents($this->dbFile, serialize($this->getNotesList()));
    }
}
class Output {
    public static function showError($txt)
    {
        if (isset($_SERVER['HTTP_X_REQUESTED_WITH']))
            self::ajaxResponse(false, $txt);
        else
            print "<div style='height:60px;background:darkred;color:white;'>{$txt}</div>";
        exit;
    }
    public static function ajaxResponse($succ, $c)
    {
        if (!isset($_SERVER['HTTP_X_REQUESTED_WITH']))
            header("Refresh: 0;url={$_SERVER['PHP_SELF']}");
        else
            print json_encode(array("success" => intval($succ), "content" => $c));
        exit;
    }
    
    //
    private $content;    
    
    public function addContent($c) {
        $this->content .= $c;
    }
    public function __construct($c) { 
        $this->content = $c;
    }
    public function sendOutput() {        
        print <<<EOF
        <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Notatki</title>
<script src="http://code.jquery.com/jquery-2.2.0.min.js"></script>
<style>
html {
    font-family: Segoe-UI, Helvetica, Verdana;
}
article {
    background: #DDD;
    text-align:center;
    width:100%;
    padding: 10px;
    margin-top: 5px;
    min-height:55px;
}
.artDetails {
    float: right;
    font-style: italic;
    color: grey;
    font-size: small;
    margin-right: 5px;
    margin-bottom: 10px;
    display:block;
}
[delBtn] {
    color: red;
    font-weight: bold;
    cursor: pointer;
    float:right;
    margin-right: 5px;
}
[delBtn] > a, [delBtn] > a:visited {
    text-decoration: none;
    color:inherit;
}
</style>
</head>
<body>
<div>
<form method="post">
<input type='hidden' name='do' value='add' />
<textarea style='width:100%;height:250px;' name='content'></textarea><br />
<input type='submit' value='Dodaj' id='btnSubmit' style='float:right;'/>
</form>
</div><br /><br />
{$this->content}

<script>
    $("form").submit(function() {
        $.ajax({
           method: "POST",
           data: $(this).serialize(),
           complete: function(d) {
               d = $.parseJSON(d.responseText);
               if (d.success == 1) {
                   $(".notesList").prepend(d.content);
                    $("[name='content']").val("");
               }
               else 
                    alert(d.content);
           }
        });
        return false;
    });
    $(".notesList").on("click", "[delBtn]", function() {
       var callingElement = this;
       $.get($(this).find("a").attr("href"), function(d) {
           d = $.parseJSON(d);
          if (d.success == 1)
                $(callingElement).parent("article").remove();
          else
                alert(d.content); 
       });
       return false;
    });
</script>
</body>
</html>
EOF;
exit;
    }
}

$notes = new Notes();

switch (isset($_REQUEST['do']) ? $_REQUEST['do'] : "") {
    case "remove":
        if (!is_numeric($_REQUEST['ts']))
            Output::showError("Niepoprawne dane wejściowe");
        $notes->removeNote($_REQUEST['ts']);
        Output::ajaxResponse(true, "");
    break;
    case "add":
        if (!isset($_REQUEST['content']))
            Output::showError("Niepoprawne dane wejściowe");
        Output::ajaxResponse(true, $notes->addNote($_REQUEST['content']));
    break;
    default:
        $output = new Output($notes->getOutput());
        $output->sendOutput();
    break;
}

efekt:

Zaloguj się

👋 Witaj na MPCForum!

Dodawanie i usuwanie notatek ze strony

Rekomendowane odpowiedzi

Makhart

Makhart

Jakub

Jakub

Gość

Gość

Gość

Gość

Zarchiwizowany