Stuck in endless loop while creating buttons - javascript

I'm trying to create a website, where I can insert products with a button.
So for now I got one button which creates one div as a product box. When the button is clicked it becomes invisible, under this I can see the div now; and under the div, there's the next button which should be able to create one more divs (always the same way).
The problem is that I can't find any solution to do that. I always land in an endless loop.
If you're wondering about the mailer, the idea for the first step is, to send a mail as newsletter for every created product.
Here's my code:
<?php
echo "<form action='index.php' method='GET'>";
echo "<input type='submit' name='insert' id='insert' value='INSERT'>";
echo "</form>";
if ($_GET["insert"]) {
echo " <script language='JavaScript'> ";
echo "";
echo " ";
echo " document.getElementById('insert').style.visibility='hidden' ";
echo "";
echo "</script>";
echo " <div class='article'>";
echo "<h2>product</h2>";
echo "<p>";
echo "EXAMPLE";
echo "</p>";
echo "</div> ";
echo "<form action='index.php' method='GET'>";
echo "<input type='submit' name='ins ert' id='insert' value='INSERT'>";
echo "</form>";
//send mail
$message = "hello TEST!";
for ($i = 0; $i < $z; $i++) {
mail('' . $res[$i] . '', 'Newsletter', $message);
}
}
?>

You are hiding an "id=insert" item, and then creating a second "id=insert" item. So you get 2 identical id, which is not good.
You should "remove" the "id=insert" rather than "hide" it. jquery may help you on that.
(And so you may not need to remove the "id=insert" item, but rather "add" a new div "after" your last product).

Related

Undefined index after json_decode

I have a problem when I'm trying to get the contents of a JavaScript Array and pass its value to a PHP Array Variable.
What I'm doing is that, when a user clicks a button, the value of the item clicked will be added to the javascript array and every time the javascript array updates, the PHP variable will also update and so the contents of the div displaying the contents of the PHP array. I'm not using forms for this matter but buttons
However, when I try to use the json_decode function to get the values of a JavaScript array, it's giving me a Message: undefined index: data error
I'm a beginner in JavaScript, jQuery and AJAX so please bear with me
This is my code:
<script>
// ARRAY VARIABLE WHERE ITEM VALUES WILL BE STORED
var food_item = new Array();
// FUNCTION TO BE TRIGGERED WHEN USER CLICKED THE BUTTON, GET THE ITEM'S VALUE AND ADD IT TO ARRAY
function addToTray(data){
food_item.push(document.getElementById(data).value);
dataString = food_item; // array?
var jsonString = JSON.stringify(dataString);
$.ajax({
type: "POST",
url: "main",
data: {data: jsonString},
cache: false,
success: function(){
alert("OK");
}
});
}
</script>
<body>
...
// LINE OF CODE RESPONSIBLE FOR FETCHING JAVASCRIPT ARRAY VALUES
$this->session->userdata['food_tray'] = json_decode($_POST['data']);
// DIV TO BE UPDATED
<div class="col-md-3 food-tray" id="food-items" style="margin-top: 7%">
<!--FOOD TRAY-->
<div class="panel-heading">
<h3 class="ft-header">Food Tray</h3>
</div>
<div class="panel-body">
<?php
$count_fi = count($this->session->userdata('food_tray'));
echo "<p>Your Items (" . $count_fi . ")</p>";
if($count_fi == 0){
echo "<p class='no-avail-list'>NO ITEMS ADDED IN FOOD TRAY</p>";
}else{
echo "<table class='table borderless'>";
for($i = 0; $i < $count_fi; $i++){
echo "<tr>";
echo "<td>" . $this->session->userdata['food_tray'][$i] . "</td>";
echo "<td>P 200.00</td>";
echo "<td><form method='post'><input type='number' name='qty' min='1' max='100' value='1'/></form></td>";
echo "</tr>";
}
echo "</table>";
echo "<a href='' class='btn btn-success' data-toggle='modal' data-target='#myModal'>
Add Friend</a>";
echo "<a href='".base_url()."index.php/CheckOut' class='btn btn-warning'>Proceed to Checkout</a>";
}
?>
</div>
</div>
...
<?php
foreach($query->result() as $row){
echo "<div class='col-lg-7'>";
echo "<div class='thumbnail'>";
$file_name = strtolower(preg_replace('/[^A-Za-z0-9\-.]/', '', $row->name));
/*if(file_exists(FCPATH . '/assets/images/main/food/' . $file_name . '.jpg')){
echo "<img src='".base_url()."/assets/images/main/food/".$file_name.".jpg' alt='' width='320px' height='100px'>";
}else{
echo "<img src='http://placehold.it/320x150' alt=''>";
}*/
echo "<img src='http://placehold.it/320x150' alt=''>";
echo "<div class='caption'>";
echo "<h5 class='pull-right'>&#x20B1 " . $row->price . "</h5>";
echo "<h5><a href='#'>" . $row->name . "</a></h5>";
echo "<h5>Calorie Count : " . ($row->calorie_count == NULL ? "Not Available" : $row->calorie_count) . "</h5>";
// BUTTON FOR `addToTray()` FUNCTION
echo "<button class='btn btn-primary' id='".$row->id."' value='".$row->name."' style='width:100%' onclick='addToTray(".$row->id.")'>Add to Tray</button>";
// var_dump($row->name);
echo "</div>";
echo "</div>";
echo "</div>";
}
?>
</body>
Anyone who knows how to solve this problem? Any help would be appreciated.
create your session as
$array = array ('food_tray' => json_decode($javascriptarray));
$this->session->set_userdata($array);
check if your javascript libraries are loaded in sources tab.

Show specific text from a php loop of database results using jquery

I have selected data from my database and I have looped through the results to display them on my page. I have 3 results which are shown. Each result has a button with an id called decrease. When I click this button, an alert with the name of the item containing the alert button should be displayed. I am using jQuery to achieve this.
My problem is that whenever I click the button, the name of only the first item in the results array is displayed. The buttons in the other two results don't seem to work. What am I doing wrong?
The code that loops through the result and displays the items in the database table:
if(mysqli_num_rows($run) >= 1){
while($row = mysqli_fetch_assoc($run)) {
$name = $row['name'];
$quantity = $row['quantity'];
$price = $row['price'];
$image = $row['image'];
$category = $row['category'];
$total = $price * $quantity;
echo "<div class=\"post-container\">\n";
echo "<div class=\"post-thumb\">\n";
echo "<img src='$image'>\n";
echo "</div>\n";
echo "<div class=\"post-title\">\n";
echo "<h4 style=\"font-weight:bold;\">\n";
echo "$name\n";
echo "<span id=\"deletion\">Delete</span>\n";
echo "</h4>\n";
echo "</div>\n";
echo "<div class=\"post-content\">\n";
echo "<ul style=\"list-style-type:none;\">\n";
echo "<li>Cost Per Item: <span id=\"cost\">$price</span>/=</li>\n";
echo "<li>\n";
echo "Quantity: \n";
echo "<button type=\"submit\" id=\"decrease\" class=\"glyphicon glyphicon-minus\" title=\"Decrease Quantity\"></button>\n";
echo "\n";
echo "<span id=\"cost\" class=\"quantity\">&nbsp$quantity&nbsp</span>\n";
echo "\n";
echo "<button type=\"submit\" id=\"increase\" class=\"glyphicon glyphicon-plus\" title=\"Increase Quantity\"></button>\n";
echo "</li>\n";
echo "<li>Total Cost: <span id=\"cost\">$total</span>/=</li>\n";
echo "</ul>\n";
echo "</div>\n";
echo "</div>";
}
}
And here's the jquery:
$("#decrease").click(function(){
var name = $(this).parent("li").parent("ul").parent("div.post-content").siblings("div.post-title").find("a").text();
alert(name);
});
Your HTML markup is invalid as there can be only one element with given id - id must be unique. You can use classes instead, for example class decrease will have selector .decrease, that will pertain to all your buttons.

Oop check if database table is empty

I have a selector wich gets information from the database. But when my database table is empty, the selector still shows up like this:
However, when my database is empty. I don't want to show the selector. but a message that says something like: Database is empty! Add something.
My code for the selector:
$results = $database->Selector();
echo "<form name='form' method='POST' id='selector'>";
echo "<select name='train_name' id='train_name' multiple='multiple'>";
// Loop trough the results and make an option of every train_name
foreach($results as $res){
echo "<option value=" . $res['train_name'] . ">" . $res['train_name'] . "</option>";
}
echo "</select>";
echo "<br />" . "<td>" . "<input type='submit' name='Add' value='Add to list'/>" . "</td>";
echo "</form>";
The function:
function selector() {
$sql = "SELECT train_name, train_id FROM train_information ORDER BY train_name";
$sth = $this->pdo->prepare($sql);
$sth->execute();
return $sth->fetchAll();
}
EDIT:
Got this now:
$results = $database->Selector();
if(count($results) > 0) {
//Form etc here//
}else echo "nope";
It is working now! :D

How to render UI using php and angular for display and in place update

<?php
$ach_json = json_decode ( $ach, true );
for($i = 0; $i < count ( $ach_json ); $i ++) {
echo "<ng:switch on='edit'>";
echo "<div ng:switch-when='true'>";
$title = $ach_json [$i] ['title'];
echo "<h3>title $title</h3><br>";
echo "<input type='image' src='http:'..' name='edit' value='$i' ng-click='editClick()'>";
echo "</div>";
echo "<div ng:switch-when='false'>";
echo "Title: <input type='text' ng-model='title' value=$title> <br>";
echo "<button ng-click='updateRequest()'>update</button>";
echo "</ng:switch>";
}
?>
</form>
here I display title, when someone clicks on edit button, I change it to textbox and give the user to update . once someone clicks on update , now I will make a rest call and need to show updated title.

php post form with variable and javascript submit

I have a list of items from a database and I am trying to post to a specific entry in that list using javascript to submit a form. I have no idea why it's not working though. Here is my code...
<?php
...
while loop to get results {
echo "<form action='scheduled.php?id=$row[id]' method='post' id='sche'>";
echo "<td onclick=\"javascript:document.getElementById('sche').submit();\">".$row['firstname'];
echo "</td>";
echo "</form>";
}
?>
The weird part is that it WILL post, but it doesn't pull the right 'id'. It will take the first one on the list and post to that 'id'.
my URL reads "...scheduled.php?id="
Because of the loop, you are defining many different forms with the same id "sche". You need to give each element their own id.
<?php
...
while loop to get results {
echo "<form action='scheduled.php?id=$row[id]' method='post' id='sche_$row[id]'>";
echo "<td onclick=\"javascript:document.getElementById('sche_$row[id]').submit();\">".$row['firstname'];
echo "</td>";
echo "</form>";
}
?>
Notice the new sche_$row[id] for "id"

Categories