So I am trying to get create a HTML that uses javascript, PHP, and CSS. I am having issues figuring out how to get the PHP that pulls in my database to post on the website with a click of a button using a javascript function. I have tried to setup jquery and ajax but I just can't seem to get it to work. Everything is connected as it should be. I have googled and googled and tried many things so figured I would post and see if someone can help me out. If I post the PHP file into my HTML it works properly but I have multiple querys that I want associated with a button. If I can just get one button to work I should be good to go. Thank you.
JS
function mad_hosp(str) {
if(str == 0){
document.getElementById("output").innerHTML = "Error.";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("output").innerHTML = this.responseText;
}
};
xmlhttp.open("GET", "madison_narc.php?", true);
xmlhttp.send();
}
}
Here are my buttons in HTML
<div class="navbar">
Home
News
<div class="dropdown">
<button class="dropbtn">Dropdown
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown-content">
<button onclick="main_hosp()">
Huntsville Hospital
</button>
<button onclick="W&C_hosp()">
Womens and Childrens Hospital
</button>
<button onclick="mad_hosp()">
Madison Hospital
</button>
</div>
</div>
</div>
<p>Waiting for the location to be selected... <id="output"></p>
PHP
<?php
$sql = "SELECT
currentinventoryaudit.MedId as MedID,
(currentinventoryaudit.MedDescription) as MedicationDescription,
sum(currentinventoryaudit.CurrentCount) as TotalOnHand,
'MadisonNarcVault' as StationName
FROM
currentinventoryaudit
where
currentinventoryaudit.StationName like ('%CW101296%') and
currentinventoryaudit.MedDescription not like ('key%') and
currentinventoryaudit.MedDescription not like ('%zz-%') and
currentinventoryaudit.MedDescription not like ('%alp%')
group by
2
order by
2 asc;";
$result = mysqli_query($conn,$sql);
$resultCheck = mysqli_num_rows($result);
echo "<table>
<tr>
<th>MedID</th>
<th>Medication Description</th>
<th>Total On Hand</th>
<th>Station Name</th>
</tr>";
if($resultCheck > 0) {
while ($row = mysqli_fetch_assoc($result)){
echo"<tr>";
echo "<td>" . $row['MedID']."</td>";
echo "<td>" . $row ['MedicationDescription']."</td>";
echo "<td>" . $row ['TotalOnHand']."</td>";
echo "<td>" . $row ['StationName']."</td>";
echo "</tr>";
}
echo "</table>";
}
?>
This doesn't look like valid markup.
<p>Waiting for the location to be selected... <id="output"></p>
Use this instead:
<div id="output">
<p>Waiting for the location to be selected... </p>
</div>
document.getElementById("output") is looking for an element with an id attribute with a value of "output", not an id element.
Related
Single Hardware Modification
Mulitple Hardware Modifications
I am trying to set up an equipment log using MySQL, PHP, and JavaScript. I have been trying to teach myself over the past 3 months. A lot of what I have is from code I have found here or on other forums.
I have a page dedicated to inputting hardware changes on our equipment. The Subsystem and Component dropdowns are set to pull the subsystem list from the database, and the component list is populated based off subsystem selection. I have not gotten that far into JavaScript, so I do not fully understand some of what this code means.
I have the page set up to input one modification, then after submitting, there is a link to return to the page to add another modification. This option is working as expected. My dropdowns work and my data is input into my database as expected.
I am trying to set up a page so that if there are multiple modifications, they can be added on one page. All of my text input fields on the form work as expected. I am able to create the first dropdown for the subsystem and populate it with my table data, but the component dropdown does not populate. I have been following this tutorial from webslesson.com. In it he uses 1 table. I have been trying to adapt it for the 2 tables that I am using, but I am getting some of the functions wrong.
Would anyone be able to point me in the right direction of where I can learn where my code is going off track? I am trying to learn, but at this point I am not exactly sure how to phrase what I am looking for.
I appreciate you taking a look at this. Please do not be too harsh on my poor code. I am working to make it better as I learn.
Above are links to my CodePen.io and repl.it for the 2 versions of my page. I had to
This is my table setup:
lu_subsystem
|id|subsystem_name|
|--|--------------|
lu_component
|component_id|subsystem_id|component_name|
|------------|------------|--------------|
<?php
//index.php
include('database_connection.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>Add Remove Dynamic Dependent Select Box using Ajax jQuery with PHP</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<br />
<div class="container">
<h3 align="center">Add Remove Dynamic Dependent Select Box using Ajax jQuery with PHP</h3>
<br />
<h4 align="center">Enter Item Details</h4>
<br />
<form method="post" id="insert_form">
<div class="table-responsive">
<span id="error"></span>
<table class="table table-bordered" id="item_table">
<thead>
<tr>
<th>Enter Item Name</th>
<th>Subsystem</th>
<th>Component</th>
<th><button type="button" name="add" class="btn btn-success btn-xs add"><span class="glyphicon glyphicon-plus"></span></button></th>
</tr>
</thead>
<tbody></tbody>
</table>
<div align="center">
<input type="submit" name="submit" class="btn btn-info" value="Insert" />
</div>
</div>
</form>
</div>
</body>
</html>
<script>
$(document).ready(function(){
var count = 0;
$(document).on('click', '.add', function(){
count++;
var html = '';
html += '<tr>';
html += '<td><input type="text" name="item_name[]" class="form-control item_name" /></td>';
html += '<td><select name="subsystem_id[]" class="form-control subsystem_id" data-subsystem_id="'+count+'"><option value="">Select Subsystem</option><?php echo fill_select_box($connect, "0"); ?></select></td>';
html += '<td><select name="item_component_id[]" class="form-control item_component_id" id="item_component_id'+count+'"><option value="">Select Component</option></select></td>';
html += '<td><button type="button" name="remove" class="btn btn-danger btn-xs remove"><span class="glyphicon glyphicon-minus"></span></button></td>';
$('tbody').append(html);
});
$(document).on('click', '.remove', function(){
$(this).closest('tr').remove();
});
$(document).on('change', '.subsystem_id', function(){
var id = $(this).val();
var component_id = $(this).data('component_id');
$.ajax({
url:"fill_sub_category.php",
method:"POST",
data:{subsystem_id:subsystem_id},
success:function(data)
{
var html = '<option value="">Select Component</option>';
html += data;
$('#item_component_id'+component_id).html(html);
}
})
});
$('#insert_form').on('submit', function(event){
event.preventDefault();
var error = '';
$('.item_name').each(function(){
var count = 1;
if($(this).val() == '')
{
error += '<p>Enter Item name at '+count+' Row</p>';
return false;
}
count = count + 1;
});
$('.item_category').each(function(){
var count = 1;
if($(this).val() == '')
{
error += '<p>Select Item Category at '+count+' row</p>';
return false;
}
count = count + 1;
});
$('.item_component_id').each(function(){
var count = 1;
if($(this).val() == '')
{
error += '<p>Select Item Sub category '+count+' Row</p> ';
return false;
}
count = count + 1;
});
var form_data = $(this).serialize();
if(error == '')
{
$.ajax({
url:"insert.php",
method:"POST",
data:form_data,
success:function(data)
{
if(data == 'ok')
{
$('#item_table').find('tr:gt(0)').remove();
$('#error').html('<div class="alert alert-success">Item Details Saved</div>');
}
}
});
}
else
{
$('#error').html('<div class="alert alert-danger">'+error+'</div>');
}
});
});
</script>
<?php
//database_connection.php
$connect = new PDO("mysql:host=localhost; dbname=bunker_logs;", "root", "");
function fill_select_box($connect, $id)
{
$query = "
SELECT * FROM lu_subsystem
";
$statement = $connect->prepare($query);
$statement->execute();
$result = $statement->fetchAll();
$output = '';
foreach($result as $row)
{
$output .= '<option value="'.$row["id"].'">'.$row["subsystem_name"].'</option>';
}
return $output;
}
function fill_component_box($connect, $component_id)
{
$query = "
SELECT * FROM lu_component
WHERE component_id ='".$id."'
";
$statement = $connect->prepare($query);
$statement->execute();
$result = $statement->fetchAll();
$output = '';
foreach($result as $row)
{
$output .= '<option value="'.$row["component_id"].'">'.$row["component_name"].'</option>';
}
return $output;
}
?>
<?php
//fill_component.php
include('database_connection.php');
echo fill_component_box($connect, $_POST["subsystem_id"]);
?>
I have been looking into your code, and to be honest, I haven't done much in jQuery. However, I still want to give you an example on how you can implement the information on your page from my experience:
You can either pull the information directly from the database with PHP without using JavaScript. If you use PDO for this, you get a muldimension array.
You can then "walk" through the array with a foreach loop
$select ='<select id='yourChoice'>';
foreach($array as $component){
$name = component['name'];
$select.="<option value='$name'> $name </option>;
};
$select.='</select>';
In this case the $array is the full printout from the database, and goes through each row ( $component)
It then selects the column name, and fills it in.
If you want to do the same thing with JavaScript, you can do it with JSON, walking through that array.
Unfortunately, I don't have an example ready for that one at the moment.
I have been developing a website events page where I would like a small badge to display beside an event if it happens to take place on the current date.
I have stored my events in a database, where all dates are saved using the DATE data type. On the events page, information is retrieved using PHP/SQL.
I have created a script with jQuery to show the 'todayAlert' div when the date of an event matches the current date. Otherwise the div is meant to remain hidden. Unfortunately I can't get the script to work and the div is always hidden on the first event and always displayed with the following events. Can anyone help work out how to fix the script?
Code:
<div class='row'>
<!--Fetch and display events from database for SLIDE 1 -->
<?php
$query = "SELECT * FROM events ORDER BY eventDate DESC LIMIT 3;";
$result = mysqli_query($conn, $query);
if (mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_assoc($result)) {
$event = $row["eventName"];
$date = $row["eventDate"];
$time = $row["eventTime"];
$loc = $row["eventPlace"];
$desc = $row["eventDesc"];
echo " <div id='eventCard' align='center' class='col-md-4'>
<hr>
<h3>$event</h3>
<br>
<p><i class='far fa-calendar-times'></i> ". date("d/m/Y", strtotime($date)) ." <div id='todayAlert'><span class='badge badge-pill badge-danger'>Today!</span></div>
<br>
<i class='fas fa-map-marker-alt'></i> $loc
<br>
<i class='far fa-clock'></i> $time
<br>
<br>
<a href='events.php'>More Info </a>
</p>
<hr>
</div>
<script>
//show/hide event today alert depending on date
var today = new Date();
if(today.getDate() === $date){
$('#todayAlert').show();
} else {
$('#todayAlert').hide();
}
</script>
";
}
} else {
echo "
<div id='eventCard' align='center' class='col-md-4'>
<h1>No Results! <i class='fas fa-exclamation-circle'></i></h1>
</div>
";
}
?>
</div>
Note- also using Bootstrap v 4.4.1,
Thanks.
today.getDate() returns the current day of the month and it looks like $date contains day/month/year (not necessarily in that order). So when you compare the two it will always be false.
I've since solved this using pure PHP:
<!--Fetch and display events from database for SLIDE 2 -->
<?php
$query = "SELECT * FROM `events` ORDER BY `eventDate` DESC LIMIT 3 OFFSET 3;";
$result = mysqli_query($conn, $query);
if (mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_assoc($result)) {
$event = $row["eventName"];
$date = $row["eventDate"];
$time = $row["eventTime"];
$loc = $row["eventPlace"];
$desc = $row["eventDesc"];
$today = date("Y-m-d");
echo " <div id='eventCard' align='center' class='col-md-4'>
<hr>
<h3>$event</h3>
<br>
<p><i class='far fa-calendar-times'></i> ". date("d/m/Y", strtotime($date)) ." ";
echo " ".($today == $date ? "<span class='badge badge-pill badge-danger'>Today!</span>" : "")." ";
echo"
<br>
<i class='fas fa-map-marker-alt'></i> $loc
<br>
<i class='far fa-clock'></i> $time
<br>
<br>
<a href='events.php'>More Info </a>
</p>
<hr>
</div>
";
}
} else {
echo "
<div id='eventCard' align='center' class='col-md-4'>
<h1><i class='fas fa-exclamation-circle'></i> No Results!</h1>
</div>
";
}
?>
</div>
Like in the title I would like to use a variable inside the hyperlink to use it into the modal window.
I am not using bootstrap, it is a custom code but it works until I try to put some kind of <a href='#openModal?id=".$VARIABLE."'>
Is it possible to do that?
Regards
Update:
<?php
$query = "SELECT * FROM USER";
$result = mysqli_query ($connection,$query)
or die ("You couldn’t execute query");
echo "<div class='admin-table'>
<table cellspacing='15'>
<td><h3>Last Name</h3></td>
<td><h3>Name</h3></td>
<td><h3>Phone</h3></td>
<td><h3>Address</h3></td>
<td><h3>Postcode</h3></td>
<td><h3>Date of Birth</h3></td>
<td><h3>Email</h3></td>
<td><h3>Password</h3></td>
<td><h3>Role</h3></td>
</tr>";
while ($row = mysqli_fetch_array ($result, MYSQLI_ASSOC))
{
extract ($row);
echo "<tr>\n
<td>$USER_LASTNAME</td>\n
<td>$USER_FIRTSNAME</td>\n
<td>$USER_PHONE</td>\n
<td>$USER_ADDRESS</td>\n
<td>$USER_POSTCODE</td>\n
<td>$USER_DOB</td>\n
<td>$USER_EMAIL</td>\n
<td>$USER_PASSWORD</td>\n
<td>$USER_ROLE</td>\n
<td><a href='admin_user.php?id=".$USER_ID."'>Delete</a></td>\n
<td><a href='#openModal?id=".$USER_ID."'>Edit</a></td>\n
</tr>\n";
echo "<tr><td colspan ='15'><hr></td></tr>\n";
}
echo "</table></div>\n";
?>
<div id="openModal?id=<?php echo $USER_ID; ?>" class="modalDialog">
<div>X
<h2>$USER_ID</h2>
</div>
</div>
It is working the modal but its just taking the last id, I have to think another solution to pass the variable.
Many thanks for your help
Update 2:
Thank you very much! Now its working,
<?php
$query = "SELECT * FROM USER;";
$result = mysqli_query ($connection,$query) or die ("You couldn’t execute query");
//First echo the table with all your data as you want
echo "
<div class='admin-table'>
<table cellspacing='15'>
<tr>
<td><h3>Last Name</h3></td>
<td><h3>Name</h3></td>
<td><h3>Phone</h3></td>
<td><h3>Address</h3></td>
<td><h3>Postcode</h3></td>
<td><h3>Date of Birth</h3></td>
<td><h3>Email</h3></td>
<td><h3>Password</h3></td>
<td><h3>Role</h3></td>
</tr>";
//Fetch all rows for each user
while ($row = mysqli_fetch_array ($result, MYSQLI_ASSOC)) {
extract ($row);
echo "
<tr>
<td>$USER_LASTNAME</td>
<td>$USER_FIRTSNAME</td>
<td>$USER_PHONE</td>
<td>$USER_ADDRESS</td>
<td>$USER_POSTCODE</td>
<td>$USER_DOB</td>
<td>$USER_EMAIL</td>
<td>$USER_PASSWORD</td>
<td>$USER_ROLE</td>
<td><a href='admin_user.php?id=".$USER_ID."'>Delete</a></td>
<td><a href='#openModal?id=".$USER_ID."'>Edit</a></td>
<div id='openModal?id=".$USER_ID."' class='modalDialog'>
<div><a href='#close' title='Close' class='close'>X</a>
<h2>".$USER_ID."</h2>
<p>You can have additional details here.</p>
</div>
</div>
</tr>
<tr>
<td colspan ='15'><hr></td>
</tr>";
}
echo"
</table>
</div>";
?>
Try this:
echo '<a href="#openModal?id='.$VARIABLE.'">';
Update:
echo '<td>Edit</td>\n';
echo '<td>Delete</td>\n';
any reason you can't use onclick ?
<a href="#" onclick="myJsFunc();">
<script>
function myJsFunc() {
//code to open modal
}
</script>
UPDATE
If i have understood you correct you are trying to make a table showing all users and then when the admin clicks at element a modal pop ups providing additional info for the particular user.
<?php
$query = "SELECT * FROM USER;";
$result = mysqli_query ($connection,$query) or die ("You couldn’t execute query");
//First echo the table with all your data as you want
echo "
<div class='admin-table'>
<table cellspacing='15'>
<tr>
<td><h3>Last Name</h3></td>
<td><h3>Name</h3></td>
<td><h3>Phone</h3></td>
<td><h3>Address</h3></td>
<td><h3>Postcode</h3></td>
<td><h3>Date of Birth</h3></td>
<td><h3>Email</h3></td>
<td><h3>Password</h3></td>
<td><h3>Role</h3></td>
</tr>";
//Fetch all rows for each user
while ($row = mysqli_fetch_array ($result, MYSQLI_ASSOC)) {
extract ($row);
echo "
<tr>
<td>$USER_LASTNAME</td>
<td>$USER_FIRTSNAME</td>
<td>$USER_PHONE</td>
<td>$USER_ADDRESS</td>
<td>$USER_POSTCODE</td>
<td>$USER_DOB</td>
<td>$USER_EMAIL</td>
<td>$USER_PASSWORD</td>
<td>$USER_ROLE</td>
<td><a href='admin_user.php?id=".$USER_ID."'>Delete</a></td>
<td><a href='#openModal".$USER_ID."'>Edit</a></td>
</tr>
<tr>
<td colspan ='15'><hr></td>
</tr>";
}
echo"
</table>
</div>";
//Fetch again the rows to make the modals with the edit info
while ($row = mysqli_fetch_array ($result, MYSQLI_ASSOC)) {
extract ($row);
echo '
<div id="openModal'.$USER_ID.'" class="modalDialog">
<div>X
<h2>'.$USER_ID.'</h2>
<p>You can have additional details here.</p>
</div>
</div>';
}
?>
Old answer before the comments
It seems that single quotes and/or double quotes aren't escaped properly.
Also remember that in PHP string concatenation is made using " . " (dot) and in JavaScript using " + " (plus).
Update 1
I think that if you use the following you will be ok.
echo '<td>Delete</td>';
echo '<td>Edit</td>';
Update 2
Don't forget to add $variable at div too so <a> and div id are the same the same. E.g.
echo '<div id="openModal'.$variable.'" class="modalDialog"></div>';
at the moment i've coded out like
<div class="row">
<div class="col-lg-12">
<table id="usertable" class="table table-bordered table-hover text-center">
<thead>
<th class="col-lg-1 text-center">User ID</th>
<th class="col-lg-4 text-center">Username</th>
<th class="col-lg-4 text-center">Password</th>
<th class="col-lg-2 text-center">Role</th>
</thead>
<tbody>
<?php
require('dbconnectmssql.php');
$sql = "select [User_ID],[user_decoded],[pass_decoded],[permission] from [rfttest].[dbo].[users]";
$query = sqlsrv_query ($conn , $sql);
if($query === false)
{die( print_r( sqlsrv_errors(), true));}
while($row = sqlsrv_fetch_array( $query, SQLSRV_FETCH_NUMERIC))
{
echo "<tr>";
foreach($row as $x => $a)
{
echo "<td>".$a."</td>";
}
echo "<td>";
echo "<a href='#' ><span class='glyphicon glyphicon-wrench' aria-hidden='true'></span></a>";
echo "<a href='usercontrol.php?del=$row[0]'>";
echo "<span class='glyphicon glyphicon-trash' aria-hidden='true'></span>";
echo "</a>";
echo "</td>";
echo "</tr>";
}
?>
</tbody>
/table>
</div>
</div>
it's all about query out and show how many user in the table.
I've done the delete-record by link to PHP file and $_GET data (maybe improve later if have another solution that you will suggest )
Another things that i want to do is
Edit specific record without redirected to another page
My idea for right now is hidden form that popup after click edit such as i've click then form pop up with data record that stored and user can edit it and save it by submit to PHP file and then redirect back to this page
something like : Contain form within a bootstrap popover? post
the popover link
<div id="popover-head" class="hide">
some title
</div>
<div id="popover-content" class="hide">
<!-- MyForm -->
</div>
but i still can't figured out
How can i code out to make the link to open the specific popover-head/content maybe popover-head/content must be contain in id or something ?
What about PHP
What about JS/JQ also
Any solution what i just want only something to edit specific record that echo out
Sorry for my bad English
Thanks
You likely want to use AJAX for this.
This looks so painful to me - and if it worked a google spidering would delete all users on the page:
}
echo "<td>";
echo "<a href='#' ><span class='glyphicon glyphicon-wrench' aria-hidden='true'></span></a>";
echo "<a href='usercontrol.php?del=$row[0]'>";
echo "<span class='glyphicon glyphicon-trash' aria-hidden='true'></span>";
echo "</a>";
echo "</td>";
echo "</tr>";
}
It could be written
} ?>
<td>
<a href='#' ><span class='glyphicon glyphicon-wrench' aria-hidden='true'></span></a>
<a class="del" href='#' data-userid='<?PHP echo row["User_ID"]; ?>'>
<span class='glyphicon glyphicon-trash' aria-hidden='true'></span>
</a>
</td>
</tr>
<?PHP } ?>
And then
$(function() {
$(".del").on("click",function(e) {
e.preventDefault(); stop the page from reloading
var id=$(this).data("userid");
$.get("usercontrol.php?del="+id,function() {
alert(id + "deleted");
});
});
});
To edit
Popup a form with the data using .show() and .hide()
change the data
AJAX the changes on submit - be sure to use preventDefault to
stop actual submission $("form").on("submit",function(e) { e.preventDefault(); $.post("save.php",$(this).serialize(),function(data) { alert("saved"); $("#formDiv").hide() });});
show the result
close the popup
I have products in table I wish to display some when page load and remain data should display on button click, I have set limit as 6 per page, when page loading it is displaying first six rows and if I click on Load More button it is displaying another six rows here problem coming after got 12 rows from table when I click again on Load More button it is not working even I have more data in table, I have cross checked parameters also, it is fine parameters also sending with request. please help me how to solve this.
NOTE: when I test this script in core php it is working fine, when I implement this script in codeigniter first time click load more data working second time when i click it is not wokring.
Javascript Code Block
$('.more').click(function(){
var ID = $(this).attr("id");
var cats = $('input[name=cats]').val();
$("#more"+ID).html('<img src="<?=ROOT;?>resources/moreajax.gif" />');
$.post('<?=ROOT;?>product/dataLoad', {id:ID,cats:cats}, function(data){
if(data)
{
$('ol#updates').append(data);
$("#more"+ID).remove();
}
else
{
$(".morebox").html('The End');// no results
}
});
return false;
});
codeigniter controller function
public function dataLoad() {
if(isset($_POST['id']))
{
$lastmsg=$_POST['id'];
$cats = $_POST['cats'];
$query=mysql_query("select * from product where id > '".$lastmsg."' AND category_id IN ($cats) order by id asc limit 4");
$numrows = mysql_num_rows($query);
while($ob = mysql_fetch_array($query))
{
?>
<div>
<p>ID: <?=$ob['id']; </p>
<p>NAME: <?=$ob['name']; </p>
</div>
<?php
}//while
?>
<?php
if($numrows > 0)
{
?>
<div id="more<?php echo $ob['id']; ?>" class="morebox" style="clear:both">
<input type="hidden" name="cats" value="<?=$cats;?>" />
Load More
</div>
<?php
}
}
?>
product page code
<ol class="timeline" id="updates">
$str = implode(",",$cats);
$query = "select * FROM product WHERE category_id IN (".$str.") order by id asc limit 4";
$result=mysql_query($query);
$numrows = mysql_num_rows($result);
while($ob = mysql_fetch_array($result))
{
?>
<div>
<p>ID: <?=$ob['id']; </p>
<p>NAME: <?=$ob['name']; </p>
</div>
<?php
}//while
?>
</ol>
<?php
if($numrows > 0)
{
?>
<div id="more<?php echo $ob['id']; ?>" class="morebox" style="clear:both">
<input type="hidden" name="cats" value="<?=$cats;?>" />
Load More
</div>
<?php
}
?>
I solved this problem insted of this
$('.more').click(function(){
$("#updates").on("click",".more",function(){