Veröffentlichen von Formulardaten eines Formulars als verschachtelte JSON in einer JSON-Datei, die Daten aus einer anderen Datei enthält

Question

Titel dieser Frage kann verwirrend sein. Ich erläutere es hier. Ich habe 2 Formen: Eine für timeline und eine andere für events.
HTML code:

<link rel="stylesheet" type="text/css" href="jquery-ui.css"> 
<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript" src="jquery-ui.js"></script> 

<style> 
    .error {color: #FF0000;} 
    /* The Modal (background) */ 
.modal { 
    display: none; /* Hidden by default */ 
    position: fixed; /* Stay in place */ 
    z-index: 1; /* Sit on top */ 
    padding-top: 100px; /* Location of the box */ 
    left: 0; 
    top: -75px; 
    width: 100%; /* Full width */ 
    height: 100%; /* Full height */ 
    overflow: auto; /* Enable scroll if needed */ 
    background-color: rgb(0,0,0); /* Fallback color */ 
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ 
} 

/* Modal Content */ 
.modal-content { 
    position: relative; 
    background-color: #fefefe; 
    margin: auto; 
    padding: 0; 
    border: 1px solid #888; 
    width: 80%; 
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); 
    -webkit-animation-name: animatetop; 
    -webkit-animation-duration: 0.4s; 
    animation-name: animatetop; 
    animation-duration: 0.4s 
} 

/* Add Animation */ 
@-webkit-keyframes animatetop { 
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1} 
} 

@keyframes animatetop { 
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1} 
} 

/* The Close Button */ 
.close { 
    color: white; 
    float: right; 
    font-size: 28px; 
    font-weight: bold; 
} 

.close:hover, 
.close:focus { 
    color: #000; 
    text-decoration: none; 
    cursor: pointer; 
} 

.modal-header { 
    padding: 2px 16px; 
    background-color: #5cb85c; 
    color: white; 
} 

.modal-body {padding: 2px 16px;} 

.modal-footer { 
    padding: 2px 16px; 
    background-color: #5cb85c; 
    color: white; 
} 
</style> 

<div id="btnDiv"> 
    <button id="btn">Click here to create a new time line!</button> 
    <button id="btnOne">Click here to create a new Event!</button> 
</div> 

<div id="myModal" class="modal"> 

    <!-- Modal content --> 
    <div class="modal-content"> 
    <div class="modal-header"> 
     <span class="close">X</span> 
     <h2>Modal Header</h2> 
    </div> 
    <div class="modal-body"> 
     <p><span class="error">* required field.</span></p> 
     <form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> 
      Name: <input type="text" name="name"> 
      <span class="error">* <?php echo $nameErr;?></span> 
      <br><br> 
      E-mail: <input type="text" name="email"> 
      <span class="error">* <?php echo $emailErr;?></span> 
      <br><br> 
      Website: <input type="text" name="website"> 
      <span class="error"><?php echo $websiteErr;?></span> 
      <br><br> 
      Comment: <textarea name="comment" rows="5" cols="40"></textarea> 
      <br><br> 
      Gender: 
      <input type="radio" name="gender" value="female">Female 
      <input type="radio" name="gender" value="male">Male 
      <span class="error">* <?php echo $genderErr;?></span> 
      <br><br> 
      qwe: <textarea name="qwe" rows="5" cols="40"></textarea> 
      <br><br> 
      rty: <textarea name="rty" rows="5" cols="40"></textarea> 
      <br><br> 
      abc: <textarea name="abc" rows="5" cols="40"></textarea> 
      <br><br> 
      def: <textarea name="def" rows="5" cols="40"></textarea> 
      <br><br> 
      dob: <input type="text" id="dob" name="dob"> 
      <br><br> 
      <input type="submit" value="Submit"> 
     </form> 
    </div> 
    <div class="modal-footer"> 
     <h3>Modal Footer</h3> 
    </div> 
    </div> 

</div> 

<div id="myModalOne" class="modal"> 

    <!-- Modal content --> 
    <div class="modal-content"> 
    <div class="modal-header"> 
     <span class="close">X</span> 
     <h2>Modal Header</h2> 
    </div> 
    <div class="modal-body"> 
     <p><span class="error">* required field.</span></p> 
     <form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> 
      Name: <input type="text" name="name"> 
      <span class="error">* <?php echo $nameErr;?></span> 
      <br><br> 
      E-mail: <input type="text" name="email"> 
      <span class="error">* <?php echo $emailErr;?></span> 
      <br><br> 
      Website: <input type="text" name="website"> 
      <span class="error"><?php echo $websiteErr;?></span> 
      <br><br> 
      Comment: <textarea name="comment" rows="5" cols="40"></textarea> 
      <br><br> 
      dob: <input type="text" id="dobOne" name="dob"> 
      <br><br> 
      <input type="submit" value="Submit"> 
     </form> 
    </div> 
    <div class="modal-footer"> 
     <h3>Modal Footer</h3> 
    </div> 
    </div> 

</div> 




<script> 
    $(function() { 
    $("#dob").datepicker(); 
    $("#dobOne").datepicker(); 
    }); 
    //modal for timeline 
    // Get the modal 
var modal = document.getElementById('myModal'); 

// Get the button that opens the modal 
var btn = document.getElementById("btn"); 

// Get the <span> element that closes the modal 
var span = document.getElementsByClassName("close")[0]; 

// When the user clicks the button, open the modal 
btn.onclick = function() { 
    modal.style.display = "block"; 
} 

// When the user clicks on <span> (x), close the modal 
span.onclick = function() { 
    modal.style.display = "none"; 
} 

// When the user clicks anywhere outside of the modal, close it 
window.onclick = function(event) { 
    if (event.target == modal) { 
     modal.style.display = "none"; 
    } 
} 

//modal for events 
    // Get the modal 
var modalOne = document.getElementById('myModalOne'); 

// Get the button that opens the modal 
var btn = document.getElementById("btnOne"); 

// Get the <span> element that closes the modal 
var span = document.getElementsByClassName("close")[0]; 

// When the user clicks the button, open the modal 
btn.onclick = function() { 
    modalOne.style.display = "block"; 
} 

// When the user clicks on <span> (x), close the modal 
span.onclick = function() { 
    modalOne.style.display = "none"; 
} 

// When the user clicks anywhere outside of the modal, close it 
window.onclick = function(event) { 
    if (event.target == modal) { 
     modalOne.style.display = "none"; 
    } 
} 
function alertjson(e) { 
    var file = new XMLHttpRequest(); 
    var file_path = 
    file.open(validation-data.json, r); 

} 
</script> 

PHP code:

<?php 
// define variables and set to empty values 
$nameErr = $emailErr = $genderErr = $websiteErr = ""; 
$name = $email = $gender = $comment = $website = $qwe = $rty = $abc = $def = $dob = ""; 

if ($_SERVER["REQUEST_METHOD"] == "POST") { 
    if (empty($_POST["name"])) { 
    $nameErr = "Name is required"; 
    } else { 
    $name = test_input($_POST["name"]); 
    } 

    if (empty($_POST["email"])) { 
    $emailErr = "Email is required"; 
    } else { 
    $email = test_input($_POST["email"]); 
    } 

    if (empty($_POST["website"])) { 
    $website = ""; 
    } else { 
    $website = test_input($_POST["website"]); 
    } 

    if (empty($_POST["comment"])) { 
    $comment = ""; 
    } else { 
    $comment = test_input($_POST["comment"]); 
    } 

    if (empty($_POST["gender"])) { 
    $genderErr = "Gender is required"; 
    } else { 
    $gender = test_input($_POST["gender"]); 
    } 

    if (empty($_POST["qwe"])) { 
    $qweErr = "Gender is required"; 
    } else { 
    $qwe = test_input($_POST["qwe"]); 
    } 

    if (empty($_POST["rty"])) { 
    $rtyErr = "Gender is required"; 
    } else { 
    $rty = test_input($_POST["rty"]); 
    } 

    if (empty($_POST["abc"])) { 
    $abcErr = "Gender is required"; 
    } else { 
    $abc = test_input($_POST["abc"]); 
    } 

    if (empty($_POST["def"])) { 
    $defErr = "Gender is required"; 
    } else { 
    $def = test_input($_POST["def"]); 
    } 

    if (empty($_POST["dob"])) { 
    $dobErr = "Gender is required"; 
    } else { 
    $dob = test_input($_POST["dob"]); 
    } 
} 

function test_input($data) { 
    $data = trim($data); 
    $data = stripslashes($data); 
    $data = htmlspecialchars($data); 
    // echo $data; //print data 
} 

$file = dirname(__FILE__).'/validation-data.json'; 
$file_content = file_put_contents($file, json_encode($_REQUEST, JSON_PRETTY_PRINT)); 
//echo $file_content; 
//var_dump($file_content); 
?> 
<?php 
    echo "<h2>Your Input:</h2>"; 
    echo $name; 
    echo "<br>"; 
    echo $email; 
    echo "<br>"; 
    echo $website; 
    echo "<br>"; 
    echo $comment; 
    echo "<br>"; 
    echo $gender; 
    echo "<br>"; 
    echo $qwe; 
    echo "<br>"; 
    echo $rty; 
    echo "<br>"; 
    echo $abc; 
    echo "<br>"; 
    echo $def; 
    echo "<br>"; 
    echo $dob; 
?> 

PHP code die Formulardaten an json schreibt ist:

$file = dirname(__FILE__).'/validation-data.json'; 
$file_content = file_put_contents($file, json_encode($_REQUEST, JSON_PRETTY_PRINT)); 

Jedes Mal, wenn ich die Daten von einem Formular abgesendet haben, es wird erfolgreich in die JSON-Datei geschrieben. Dies ist das Beispiel json:

{ 
    "name": "asd", 
    "email": "test@attendize.website", 
    "website": "esdfs", 
    "comment": "qasdas", 
    "dob": "08\/03\/2016" 
} 

Wenn ich die Daten eines anderen Formular ausfüllen und einreichen, dann werden die alten Werte nur durch neue Werte ersetzt. Aber ich möchte, dass neue Daten in die gleiche JSON-Datei geschrieben werden wie verschachtelte Werte. Wie kann ich es tun?

Answer 1

Dies sollte eine vorübergehende Lösung sein, weil es nicht perfekt ist und auf sicherere und zuverlässigere Weise erreicht werden könnte. Dies begrenzt ein wenig, wie es funktioniert, also sollten Sie dies für bessere Ergebnisse optimieren. Aber im Allgemeinen funktioniert es und einige Dinge wurden ziemlich verändert.

Alle PHP-Code (außer mit Your Input Satz) war Modus über HTML und JS.

Dies wird Hinweis Fehler lösen, weil jetzt habe ich aktiviert error_reporting alle Fehler zeigen und beide Modalverben sind diese Mitteilungen voll.

• In Ihrem zweiten modalen Ich habe auch neue Zeile (kurz vor einreichen Linie):

<input type="hidden" value="1" name="secondModal">

• Schließlich modifizierten PHP-Code (viel, tatsächlich).

Alle Bereiche, die geändert wurden, sind am Ende des PHP-Codes.

if (empty($_POST["dob"])) { 
    $dobErr = "Gender is required"; 
} else { 
    $dob = test_input($_POST["dob"]); 
} 
// All those ifs above 

// Add all values into array 
$array = array(
    'name' => $name, 
    'email' => $email, 
    'website' => $website, 
    'comment' => $comment, 
    'gender' => $gender, 
    'qwe' => $qwe, 
    'rty' => $rty, 
    'abc' => $abc, 
    'def' => $def, 
    'dob' => $dob 
); 

// Was this the second modal? 
if ($_POST['secondModal'] == 1) { 
    // Get serialized values from temporary file 
    $content = file_get_contents('temp_array.txt'); 
    $array = unserialize($content); 

    // Add into already existing array new values 
    $array['name2'] = $name; 
    $array['email2'] = $email; 
    $array['website2'] = $website; 
    $array['comment2'] = $comment; 
    $array['dob2'] = $dob; 

    // Add newly modified array into .json file 
    $file = dirname(__FILE__).'/validation-data.json'; 
    file_put_contents($file, json_encode($array, JSON_PRETTY_PRINT)); 
} else { 
    // Serializing array for much easier reading when we use this later 
    $results = serialize($array); 
    file_put_contents('temp_array.txt', ''); 
    file_put_contents('temp_array.txt', $results); 
} 
// End of PHP code 

Die Grundidee dabei ist, dass Speicher $array in temporäre .txt Datei serialisiert. Nachdem wir das zweite Modal ausgefüllt haben, rufen wir dasselbe Array ab, indem wir es entserialisieren und neue Werte hinzufügen. Dann speichern wir in .json Datei.

Dies ergibt 1 Array mit Werten aus beiden Modalitäten.