We Keep Coding

How to delete values from JSON object array in php?

I have a PHP code and JSON as shown below:
PHP Code:
<?php if (!empty($_POST) && isset($_POST['savechanges']) && $_POST['savechanges'] == 1 && isset($_SESSION['pageadmin'])) {
$output = array();
$output['en_desc']=$_POST['en_desc'];
$output['code']=$_POST['code'];
$fp = fopen('../feeds/ptp-ess_landing_scommittees.json', 'w');
fwrite($fp, json_encode($output));
fclose($fp);
}
if(file_exists('../feeds/ptp-ess_landing_scommittees.json')){
$data = json_decode(file_get_contents('../feeds/ptp-ess_landing_scommittees.json'));
}
?>
<?php if($data) { ?>
<form method="post" id="myform" style="text-align:left;">
<input type="hidden" id="savechanges" name="savechanges" value="1">
<div style="text-align:center; margin-right:9px; margin-bottom:24.703px;">
<button type="submit">Save</button>
</div>
<?php foreach ($data->code as $key => $value) { ?>
<div class="house-senate-committee" style="text-align:center; margin-top:15px;">
<button type="button" onclick="removeRow(this)" style="margin-right:10px;">Delete</button>
<input type="text" name="code[]" style="margin-right:10px;" value="<?= $data->code[$key] ?>">
<input type="text" name="en_desc[]" value="<?= $data->en_desc[$key] ?>">
</div>
<?php } ?>
</form>
<?php } else { echo 'Cannot read JSON settings file'; }?>
JSON:
{"code":["AEFA","AGFO"], "en_desc":["Foreign Affairs and International Trade","Agriculture and Forestry"]}
The following DOM is generated through the PHP/JSON code above:
DOM (HTML):
<div class="house-senate-committee" style="text-align:center; margin-top:15px;">
<button type="button" onclick="removeRow(this)" style="margin-right:10px;">Delete</button>
<input type="text" name="code[]" style="margin-right:10px;" value="AEFA">
<input type="text" name="en_desc[]" value="Foreign Affairs and International Trade">
</div>
<div class="house-senate-committee" style="text-align:center; margin-top:15px;">
<button type="button" onclick="removeRow(this)" style="margin-right:10px;">Delete</button>
<input type="text" name="code[]" style="margin-right:10px;" value="AGFO">
<input type="text" name="en_desc[]" value="Agriculture and Forestry">
</div>
The following JS code deletes a row from the DOM on click of a delete button. On refreshing the page,
the deleted row comes back again as everything is rendered through JSON.
JS code:
<script>
function removeRow(el) {
el.parentNode.remove();
}
</script>
Problem Statement:
The above JS code is deleting the row (on click of a delete button) from the DOM but on refresing the page, everything is rendered again.
I am wondering what PHP code I need to add so that it delete the values from the JSON on saving the form when row is deleted from DOM through JS.
Step 1: User delete the row from the DOM on click of a delete button.
Step 2: On saving the form and rendering the page, that deleted row should not be present.
I know I have to use unset function in order to remove the values from the JSON but I am not sure how I can integrate it in the form.
unset($data->code);
unset($data->en_desc);

You have a typo here:
$data = json_decode(file_get_contents('../feeds/ptp-ess_landing_scommittees.json'));
it should be
$data = json_decode(file_get_contents('../feeds/ptp-ess_landing_committees.json'));
Look at the "s" :)
Edit: you also were saving the new file without actually checking if there is a post happening, here is the full code:
<?php
if (isset($_POST['submit'])) {
$output = array();
$output['en_desc'] = $_POST['en_desc'];
$output['code'] = $_POST['code'];
$fp = fopen('../feeds/ptp-ess_landing_committees.json', 'w');
fwrite($fp, json_encode($output));
fclose($fp);
}
if (file_exists('../feeds/ptp-ess_landing_committees.json')) {
$data = json_decode(file_get_contents('../feeds/ptp-ess_landing_committees.json'));
}
?>
<?php if ($data) { ?>
<form method="post" id="myform" style="text-align:left;">
<div style="text-align:center; margin-right:9px; margin-bottom:24.703px;">
<button type="submit" name="submit">Save</button>
</div>
<?php foreach ($data->code as $key => $value) { ?>
<div class="house-senate-committee" style="text-align:center; margin-top:15px;">
<button type="button" onclick="removeRow(this)" style="margin-right:10px;">Delete</button>
<input type="text" name="code[]" style="margin-right:10px;" value="<?= $data->code[$key] ?>">
<input type="text" name="en_desc[]" value="<?= $data->en_desc[$key] ?>">
</div>
<?php } ?>
</form>
<?php } else {
echo 'Cannot read JSON settings file';
} ?>
<script>
function removeRow(el) {
el.parentNode.remove();
}
</script>

How to sent id from one page to another when click on submit?

I have a database which consists of question_id, question, and options. Where I'll display the question and options. When the user clicked on submit I want to store the option they clicked and the question_id.
I am able to store the option they clicked but want to know how to store the question_id.
$user_email = $_SESSION['email'];
$query1="SELECT * FROM votes WHERE user_email='$user_email'";
$query2="SELECT * FROM poll_question WHERE status='1'";
$fetch2 = mysqli_query($con,$query2);
<html>
<head>
<body>
<div class="container">
<br />
<br />
<br />
<div class="row">
<div class="col-md-6">
<?
while( $row2 = mysqli_fetch_array($fetch2))
{
?>
<form method="post" class="poll_form">
<h3><?echo $row2['question']?>?</h3>
<br />
<div class="radio">
<label><h4><input type="radio" name="poll_option" class="poll_option" value=<?echo $row2['option1']?> /><?echo $row2['option1']?></h4></label>
</div>
<div class="radio">
<label><h4><input type="radio" name="poll_option" class="poll_option" value=<?echo $row2['option1']?> /> <?echo $row2['option2']?></h4></label>
</div>
<br />
<?php
if( $count >0)
{ ?>
<button disabled="disabled" alt="<?php echo $row2['question_id']; ?>" rel="<?php echo $user_email; ?>" class="btn btn-primary poll_option" title="<?php echo $ip; ?>">Submit</button>
<h>You selected : <? echo $row1['vote_option']; ?></h>
<br>
<p id="demo"></p>
<?php
}
else
{ ?>
<button alt="<?php echo $row2['question_id']; ?>" rel="<?php echo $user_email; ?>" class="btn btn-primary poll_option" title="<?php echo $ip; ?>">Submit</button>
<?
}
?>
</form>
<? }
} ?>
<br />
</div>
</div>
<br />
<br />
<br />
</div>
</body>
<script type="text/javascript">
$(document).ready(function(){
$(".poll_form").submit(function(event){
event.preventDefault(); //prevents the form from submitting normally
var poll_option = '';
$('button.poll_option').each(function(){
if($(this).prop("checked"))
{
poll_option = $(this).val();
var option=poll_option;
}
var url = '<?php echo SITE_URL; ?>';
});
$.post("poll_vote.php",$('.poll_form').serialize(),
function(data)
{
if(data=="User Created Success"){
window.setTimeout(function () {
location.href ="<?php echo SITE_URL; ?>poll.php";
}, 100);
}
else{
$("#result").html(data);
}
}
);
//to reset form data
});
});
<? } ?>
</script>
</html>
Using th below function I am sending the poll_option to other where I kept the inset operation. Now I want to send the question_id also

Create a hidden input filed in your form
<input type="hidden" name="question_id" value="<?php echo $row2['question_id']; ?>">

Create a hidden input field in your form.
<input type="hidden" id="question_id" name="question_id" value="<?= $row2['question_id'] ?>">
PHP solution:
In this case your question_id will be included in the POST.
You can then access it by calling $_POST['question_id'].
Jquery solution:
In Jquery you can also access it by:
$("#question_id").val();

Select correct element to be shown

So I have the below code that I wish to change but I am unsure on the direction I need to go with this other than I need to use Javascript. Ideally I would like to click the button (id="popupbtn") so show the corresponding 'MainDescription' panel. The issue I have is that I have all of this in a loop so how do I go about making each button display the maindescription it is connected to?
I hope it makes sense because I'm spent awhile trying to figure out how to explain the I am having!
!--Quick Details-->
<h4 class="text-info"><?php echo $forsale['make'];?> <?php echo $forsale['model'];?> <?php echo $forsale['variant'];?></h4>
<h4>Price: £<?php echo $forsale['price'];?></h4>
<input type="hidden" id="stockbox" value="<?php echo $forsale['StockID'];?>">
<p id="stockref" class="form-control">Stock Ref: <?php echo $forsale['StockID'] ?></p>
<button type="button" class="btn btn-md form-control" id="popupbtn" onclick="MainDescription()">View More</button>
<div class="maindescription" id="maindesc" value="<?php echo $forsale['StockID'];?>" style="display:none">
<p id="descYear" class="form-control">Year: <?php echo $forsale['year'] ?></p>
<p id="descmileage" class="form-control">Mileage: <?php echo $forsale['mileage'] ?></p>
<p id="descFuel" class="form-control">Fuel: <?php echo $forsale['fuel'] ?></p>
<p id="descDoors" class="form-control">No. Doors: <?php echo $forsale['doors'] ?></p>
<p id="descTrans" class="form-control">Transmission: <?php echo $forsale['trans'] ?></p>
<p id="descEnginesize" class="form-control">Engine Size: <?php echo $forsale['enginesize'] ?></p>
<p id="description" class="form-control">Description: <?php echo $forsale['description'] ?></p>
</div>

You can use a function like this at the end of the HTML document to do that:
<script>
function MainDescription() {
const panel = document.getElementById('maindesc');
if (panel.style.display === 'none') {
panel.style.display = 'block'
} else {
panel.style.display = 'none'
}
}
</script>

error filling in testfield using mysql and php javascript ajax

slightly varied question but I have a script that runs and gets data from a mysql db. The end result shows them as buttons, when i click the buttons it gives me an alert with the correct id number correspsonding to whats selected, but when i try to put that into a textfield is isnt the same, its basically the last in the mysql? WHy would the alert show the correct and the updated textfield so totally different information??
The working php that alerts the correct info is :
<?php
include('config.php');
$action = $_REQUEST['action'];
if($action=="showAll"){
$stmt=$dbcon->prepare('SELECT product_id, product_name FROM products ORDER BY product_name');
$stmt->execute();
}else{
$stmt=$dbcon->prepare('SELECT product_id, product_name FROM products WHERE cat_id=:cid ORDER BY product_name');
$stmt->execute(array(':cid'=>$action));
}
?>
<div class="row">
<?php
if($stmt->rowCount() > 0){
while($row=$stmt->fetch(PDO::FETCH_ASSOC))
{
extract($row);
?>
<div class="col-xs-3">
<div style="border-radius:3px; border:#cdcdcd solid 1px; padding:22px;"><button type="button" class="btn btn-default" onclick="alert('<? echo $product_id; ?>')"><?php echo $product_name; ?></button></div><br />
</div>
<?php
}
}else{
?>
<div class="col-xs-3">
<div style="border-radius:3px; border:#cdcdcd solid 1px; padding:22px;"><button type="button" class="btn btn-default" onclick="alert('<? echo $product_id; ?>')"><?php echo $product_name; ?></button></div><br />
</div>
<?php
}
?>
</div>
<div>
text : <input id="textField1" type="text" value="0" align="right" size="13"/><br>
</div>
<script>
function display()
{
document.getElementById("textField1").value = "<? echo $product_name; ?>";
}
</script>
But if change the button to use the 'display script' it just shows last in database?

Move child div into a parent div

Im trying to output posts and comments reddit style. This is the expected result (mockup HMTL) but currently I look like this.
This is the code I'm using right now to output posts and comment:
<?php if(!empty(getMessage())): ?>
<div class="container">
<h1>The nested comment exampel!</h1>
<?php
$i=0; //initialize flag
foreach (getMessage() as $value){ ?>
<div class="comment" id="<?= $value->id; ?>">
//you don't need level class
<?php if($value->visible == 0) : ?>
<?= $value->date ?><br>
Deleted
<?php elseif($value->visible == 1): ?>
<?= $value->date ?> X <?= 'id: '. $value->id . ', sort order: ' .$value->sort_order . ', level: '.$value->level ;?><br>
<?= $value->comment_text ?>
<form action="index.php" method="post">
<input type="hidden" name="id" value="<?= $value->id ?>" />
<input type="hidden" name="parent" value="<?= $value->reply_to ?>" />
Add comment: <input type="text" name="svar">
<input type="submit">
</form>
<?php endif; ?>
<?php
$i++; //sum flag
}
for($x=0; $x<=$i; $x++) { //paint div closers
echo '</div>' ;
}
?>
<? endif; ?>
</div>
What if I change the foreach statement to
<?php if(!empty(getMessage())): ?>
<div class="container">
<h1>The nested comment exampel!</h1>
<?php foreach (getMessage() as $value){ ?>
<div class="level_<?= $value->level; ?> comment" id="<?= $value->id; ?>">
<?php if($value->visible == 0) : ?>
<?= $value->date ?><br>
Deleted
<?php elseif($value->visible == 1): ?>
<?= $value->date ?> X <?= 'id: '. $value->id . ', sort order: ' .$value->sort_order . ', level: '.$value->level ;?><br>
<?= $value->comment_text ?>
<form action="index.php" method="post">
<input type="hidden" name="id" value="<?= $value->id ?>" />
<input type="hidden" name="parent" value="<?= $value->reply_to ?>" />
Add comment: <input type="text" name="svar">
<input type="submit">
</form>
<?php endif; ?>
</div>
<?php } endif; ?>
</div>
And output everything "flat". And depending on class, move it to the "right" div with jQuery.
So if <div class="level_0 comment" id="1"> is the parent div (level_0), div with level 1 <div class="level_1 comment" id="3"> should be inside the parent div. And <div class="level_2 comment" id="14"> level 2 should be inside the child div, level 1. This fiddle hopefully gives a better understanding: And this tree of comments can contain numerous of the same level class, so how do we know it is moves inside right div? Due to SELECT * FROM tree ORDER BY reply_to ASC, sort_order ASC, every comment is fetch already sorted. So it won't be a problem, the child should be moved "one" div up.
Here is some sample data.
This is the function I am using to retrieve data:
function getMessage(){
$app = new Connection();
$sql = 'SELECT *
FROM tree ORDER BY reply_to ASC, sort_order ASC';
$query = $app->getConnection()->prepare($sql);
$query->execute();
return $query->fetchAll();
}
How can I output data reddit style with jQuery.

Surely this is a CSS fix?
Output all comments in a list and pad each one according to the level class.
.level_0 { margin-left: 0px; }
.level_1 { margin-left: 10px; }
.level_2 { margin-left: 20px; }
etc..