I'm trying to apply AJAX to my tbody only not all tableWait until all jQuery Ajax requests are done?Reference — What does this symbol mean in PHP?apply datatables.js style to table loaded by ajaxPopulate HTML table from AJAX responseSql special character to Html charactersRefreshing only an HTML table, not the entire pageHow to displaying database value in a table tbodyHow to apply table classes to AJAX response tablePut data from Postgresql database to table using Ajax and PhPCan this AJAX + PHP code be improved in terms of security, performance, etc.?
Should I cheat if the majority does it?
Hiding a solar system in a nebula
Can you use a reaction to affect initiative rolls?
Why is the saxophone not common in classical repertoire?
Are there advantages in writing by hand over typing out a story?
How frequently do Russian people still refer to others by their patronymic (отчество)?
What is the difference between figures illustration and images?
What is the difference between a historical drama and a period drama?
No point shuffling, just pick your cards
How is /a/ pronounced before n/m in French?
Old story where computer expert digitally animates The Lord of the Rings
Why did my leaking pool light trip the circuit breaker, but not the GFCI?
Go function to test whether a file exists
How did sloshing prevent the Apollo Service Module from moving safely away from the Command Module and how was this fixed?
What can a novel do that film and TV cannot?
How did שְׁלֹמֹה (shlomo) become Solomon?
What does the ash content of broken wheat really mean?
My mother co-signed for my car. Can she take it away from me if I am the one making car payments?
Does this circuit have marginal voltage level problem?
I had an c.p.a file late returns, stating i would get money. but i.r.s. says they were filed too late
Versicle and response symbols
Cannot update a field to a Lookup, MasterDetail, or Hierarchy from something else (44:13)
How can I get a file's size with C++17?
Upload csv into QGIS
I'm trying to apply AJAX to my tbody only not all table
Wait until all jQuery Ajax requests are done?Reference — What does this symbol mean in PHP?apply datatables.js style to table loaded by ajaxPopulate HTML table from AJAX responseSql special character to Html charactersRefreshing only an HTML table, not the entire pageHow to displaying database value in a table tbodyHow to apply table classes to AJAX response tablePut data from Postgresql database to table using Ajax and PhPCan this AJAX + PHP code be improved in terms of security, performance, etc.?
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
I'm trying to apply Ajax to my
tbodyonly not all mytablebut I can't do this. The AJAX working good if I put my complete table in page. I want to split my table header &tbodyto be in separated page. The following code is AJAX:function jsQueryData()
var objData =
action: actionSplit0 + '/QueryData',
;
$.post(
index_File,
objData,
function(data, status)
$('#table-container').html(data)
,
'html'
)
This is the code of my
table. If I put the table code completely in one page the AJAX working good:<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
<?php foreach ($allData1 as $data): ?>
<tr>
<td><?=$data->2; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>I have tried to split the above code to be
tbodyin separate page but the data didn't come as a table but alltds come together.
php ajax
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
add a comment |
I'm trying to apply Ajax to my
tbodyonly not all mytablebut I can't do this. The AJAX working good if I put my complete table in page. I want to split my table header &tbodyto be in separated page. The following code is AJAX:function jsQueryData()
var objData =
action: actionSplit0 + '/QueryData',
;
$.post(
index_File,
objData,
function(data, status)
$('#table-container').html(data)
,
'html'
)
This is the code of my
table. If I put the table code completely in one page the AJAX working good:<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
<?php foreach ($allData1 as $data): ?>
<tr>
<td><?=$data->2; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>I have tried to split the above code to be
tbodyin separate page but the data didn't come as a table but alltds come together.
php ajax
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
add a comment |
I'm trying to apply Ajax to my
tbodyonly not all mytablebut I can't do this. The AJAX working good if I put my complete table in page. I want to split my table header &tbodyto be in separated page. The following code is AJAX:function jsQueryData()
var objData =
action: actionSplit0 + '/QueryData',
;
$.post(
index_File,
objData,
function(data, status)
$('#table-container').html(data)
,
'html'
)
This is the code of my
table. If I put the table code completely in one page the AJAX working good:<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
<?php foreach ($allData1 as $data): ?>
<tr>
<td><?=$data->2; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>I have tried to split the above code to be
tbodyin separate page but the data didn't come as a table but alltds come together.
php ajax
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
I'm trying to apply Ajax to my
tbodyonly not all mytablebut I can't do this. The AJAX working good if I put my complete table in page. I want to split my table header &tbodyto be in separated page. The following code is AJAX:function jsQueryData()
var objData =
action: actionSplit0 + '/QueryData',
;
$.post(
index_File,
objData,
function(data, status)
$('#table-container').html(data)
,
'html'
)
This is the code of my
table. If I put the table code completely in one page the AJAX working good:<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
<?php foreach ($allData1 as $data): ?>
<tr>
<td><?=$data->2; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>I have tried to split the above code to be
tbodyin separate page but the data didn't come as a table but alltds come together.
php ajax
php ajax
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
edited Apr 9 at 7:59
Harun
722 silver badges6 bronze badges
722 silver badges6 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
asked Mar 25 at 18:00
tokhy2000tokhy2000
24 bronze badges
24 bronze badges
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
if i understand your problem, you want to set your thead static but your tbody by AJAX, if yep,
HTML:
<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
JS (JQUERY):
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var tableData=$("table").ediTable(
json:
body:response
,
editable:false // if you do not want it editable.
)
//and if you want to send JSON data of table you can :
jsonData=tableData.data();
// now you can send jsonData to PHP via ajax ...
);
Ref Lib:https://github.com/OxiGen1001/ediTable/
if i misunderstood your problem please let me know!
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
add a comment |
You will need to return ajax results as json.
I did not see your table and database structure so let me create a table as follows and insert values into it for purpose
of testing
CREATE TABLE `users` (
`id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT,
`username` varchar(100) NOT NULL,
`name` varchar(100) NOT NULL,
`email` varchar(100) NOT NULL,
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
Insert Statetments for testing
INSERT INTO `users` (`id`, `username`, `name`, `email`, `timestamp`) VALUES
(1, 'nancy1', 'Nancy moore ', 'nancyfake@gmail.com', '2018-11-16 05:02:35'),
(2, 'tony1', 'tony moore ', 'tonyfake@gmail.com', '2018-11-16 05:08:23');
Here is a Re-write of your index.php reflecting ajax/jquery codes
<!doctype html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var len = response.length;
for(var i=0; i<len; i++)
var id = response[i].id;
var username = response[i].username;
var name = response[i].name;
var email = response[i].email;
var tr_str = "<tr>" +
"<td align='center'>" + (i+1) + "</td>" +
"<td align='center'>" + username + "</td>" +
"<td align='center'>" + name + "</td>" +
"<td align='center'>" + email + "</td>" +
"</tr>";
$("#userTable tbody").append(tr_str);
);
);
</script>
</head>
<body>
<div class="container">
<table id="userTable" border="1" >
<thead>
<tr>
<th width="5%">S.no</th>
<th width="20%">Username</th>
<th width="20%">Name</th>
<th width="30%">Email</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</body>
</html>
config.php
Remember to edit database credentials to suit yours
<?php
$host = "localhost"; /* Host name */
$user = "root"; /* User */
$password = ""; /* Password */
$dbname = "your-db-name here"; /* Database name */
$con = mysqli_connect($host, $user, $password,$dbname);
// Check connection
if (!$con)
die("Connection failed: " . mysqli_connect_error());
result.php
<?php
include "config.php";
$return_arr = array();
$query = "SELECT * FROM users ORDER BY NAME";
$result = mysqli_query($con,$query);
while($row = mysqli_fetch_array($result))
$id = $row['id'];
$username = $row['username'];
$name = $row['name'];
$email = $row['email'];
$return_arr[] = array("id" => $id,
"username" => $username,
"name" => $name,
"email" => $email);
// Encoding array in JSON format
echo json_encode($return_arr);
Thats all. Let me know how it goes
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
can i send JSON data to php variable then use foreach ?
– tokhy2000
Mar 26 at 1:56
1
must you loop using for each. Ajax has an approach. The best bet is the solution i created for you okay. this is the title of your question "I'm trying to apply AJAX to my tbody only not all table". If you are looking foreach approach, you have to rephrase your question and see who helps okay
– Nancy Mooree
Mar 26 at 7:31
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55343939%2fim-trying-to-apply-ajax-to-my-tbody-only-not-all-table%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
if i understand your problem, you want to set your thead static but your tbody by AJAX, if yep,
HTML:
<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
JS (JQUERY):
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var tableData=$("table").ediTable(
json:
body:response
,
editable:false // if you do not want it editable.
)
//and if you want to send JSON data of table you can :
jsonData=tableData.data();
// now you can send jsonData to PHP via ajax ...
);
Ref Lib:https://github.com/OxiGen1001/ediTable/
if i misunderstood your problem please let me know!
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
add a comment |
if i understand your problem, you want to set your thead static but your tbody by AJAX, if yep,
HTML:
<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
JS (JQUERY):
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var tableData=$("table").ediTable(
json:
body:response
,
editable:false // if you do not want it editable.
)
//and if you want to send JSON data of table you can :
jsonData=tableData.data();
// now you can send jsonData to PHP via ajax ...
);
Ref Lib:https://github.com/OxiGen1001/ediTable/
if i misunderstood your problem please let me know!
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
add a comment |
if i understand your problem, you want to set your thead static but your tbody by AJAX, if yep,
HTML:
<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
JS (JQUERY):
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var tableData=$("table").ediTable(
json:
body:response
,
editable:false // if you do not want it editable.
)
//and if you want to send JSON data of table you can :
jsonData=tableData.data();
// now you can send jsonData to PHP via ajax ...
);
Ref Lib:https://github.com/OxiGen1001/ediTable/
if i misunderstood your problem please let me know!
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
if i understand your problem, you want to set your thead static but your tbody by AJAX, if yep,
HTML:
<table class="table table-striped table-bordered table-hover
main-table-h">
<thead>
<tr>
<td scope="col" class="search-th">
<input type="text" name="" value=""> <!-- for search -->
</td>
</tr>
<tr>
<th scope="col" class="align-top">item no</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
JS (JQUERY):
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var tableData=$("table").ediTable(
json:
body:response
,
editable:false // if you do not want it editable.
)
//and if you want to send JSON data of table you can :
jsonData=tableData.data();
// now you can send jsonData to PHP via ajax ...
);
Ref Lib:https://github.com/OxiGen1001/ediTable/
if i misunderstood your problem please let me know!
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
answered Apr 9 at 1:27
Mohammed MessaoudiMohammed Messaoudi
1066 bronze badges
1066 bronze badges
add a comment |
add a comment |
You will need to return ajax results as json.
I did not see your table and database structure so let me create a table as follows and insert values into it for purpose
of testing
CREATE TABLE `users` (
`id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT,
`username` varchar(100) NOT NULL,
`name` varchar(100) NOT NULL,
`email` varchar(100) NOT NULL,
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
Insert Statetments for testing
INSERT INTO `users` (`id`, `username`, `name`, `email`, `timestamp`) VALUES
(1, 'nancy1', 'Nancy moore ', 'nancyfake@gmail.com', '2018-11-16 05:02:35'),
(2, 'tony1', 'tony moore ', 'tonyfake@gmail.com', '2018-11-16 05:08:23');
Here is a Re-write of your index.php reflecting ajax/jquery codes
<!doctype html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var len = response.length;
for(var i=0; i<len; i++)
var id = response[i].id;
var username = response[i].username;
var name = response[i].name;
var email = response[i].email;
var tr_str = "<tr>" +
"<td align='center'>" + (i+1) + "</td>" +
"<td align='center'>" + username + "</td>" +
"<td align='center'>" + name + "</td>" +
"<td align='center'>" + email + "</td>" +
"</tr>";
$("#userTable tbody").append(tr_str);
);
);
</script>
</head>
<body>
<div class="container">
<table id="userTable" border="1" >
<thead>
<tr>
<th width="5%">S.no</th>
<th width="20%">Username</th>
<th width="20%">Name</th>
<th width="30%">Email</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</body>
</html>
config.php
Remember to edit database credentials to suit yours
<?php
$host = "localhost"; /* Host name */
$user = "root"; /* User */
$password = ""; /* Password */
$dbname = "your-db-name here"; /* Database name */
$con = mysqli_connect($host, $user, $password,$dbname);
// Check connection
if (!$con)
die("Connection failed: " . mysqli_connect_error());
result.php
<?php
include "config.php";
$return_arr = array();
$query = "SELECT * FROM users ORDER BY NAME";
$result = mysqli_query($con,$query);
while($row = mysqli_fetch_array($result))
$id = $row['id'];
$username = $row['username'];
$name = $row['name'];
$email = $row['email'];
$return_arr[] = array("id" => $id,
"username" => $username,
"name" => $name,
"email" => $email);
// Encoding array in JSON format
echo json_encode($return_arr);
Thats all. Let me know how it goes
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
can i send JSON data to php variable then use foreach ?
– tokhy2000
Mar 26 at 1:56
1
must you loop using for each. Ajax has an approach. The best bet is the solution i created for you okay. this is the title of your question "I'm trying to apply AJAX to my tbody only not all table". If you are looking foreach approach, you have to rephrase your question and see who helps okay
– Nancy Mooree
Mar 26 at 7:31
add a comment |
You will need to return ajax results as json.
I did not see your table and database structure so let me create a table as follows and insert values into it for purpose
of testing
CREATE TABLE `users` (
`id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT,
`username` varchar(100) NOT NULL,
`name` varchar(100) NOT NULL,
`email` varchar(100) NOT NULL,
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
Insert Statetments for testing
INSERT INTO `users` (`id`, `username`, `name`, `email`, `timestamp`) VALUES
(1, 'nancy1', 'Nancy moore ', 'nancyfake@gmail.com', '2018-11-16 05:02:35'),
(2, 'tony1', 'tony moore ', 'tonyfake@gmail.com', '2018-11-16 05:08:23');
Here is a Re-write of your index.php reflecting ajax/jquery codes
<!doctype html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var len = response.length;
for(var i=0; i<len; i++)
var id = response[i].id;
var username = response[i].username;
var name = response[i].name;
var email = response[i].email;
var tr_str = "<tr>" +
"<td align='center'>" + (i+1) + "</td>" +
"<td align='center'>" + username + "</td>" +
"<td align='center'>" + name + "</td>" +
"<td align='center'>" + email + "</td>" +
"</tr>";
$("#userTable tbody").append(tr_str);
);
);
</script>
</head>
<body>
<div class="container">
<table id="userTable" border="1" >
<thead>
<tr>
<th width="5%">S.no</th>
<th width="20%">Username</th>
<th width="20%">Name</th>
<th width="30%">Email</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</body>
</html>
config.php
Remember to edit database credentials to suit yours
<?php
$host = "localhost"; /* Host name */
$user = "root"; /* User */
$password = ""; /* Password */
$dbname = "your-db-name here"; /* Database name */
$con = mysqli_connect($host, $user, $password,$dbname);
// Check connection
if (!$con)
die("Connection failed: " . mysqli_connect_error());
result.php
<?php
include "config.php";
$return_arr = array();
$query = "SELECT * FROM users ORDER BY NAME";
$result = mysqli_query($con,$query);
while($row = mysqli_fetch_array($result))
$id = $row['id'];
$username = $row['username'];
$name = $row['name'];
$email = $row['email'];
$return_arr[] = array("id" => $id,
"username" => $username,
"name" => $name,
"email" => $email);
// Encoding array in JSON format
echo json_encode($return_arr);
Thats all. Let me know how it goes
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
can i send JSON data to php variable then use foreach ?
– tokhy2000
Mar 26 at 1:56
1
must you loop using for each. Ajax has an approach. The best bet is the solution i created for you okay. this is the title of your question "I'm trying to apply AJAX to my tbody only not all table". If you are looking foreach approach, you have to rephrase your question and see who helps okay
– Nancy Mooree
Mar 26 at 7:31
add a comment |
You will need to return ajax results as json.
I did not see your table and database structure so let me create a table as follows and insert values into it for purpose
of testing
CREATE TABLE `users` (
`id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT,
`username` varchar(100) NOT NULL,
`name` varchar(100) NOT NULL,
`email` varchar(100) NOT NULL,
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
Insert Statetments for testing
INSERT INTO `users` (`id`, `username`, `name`, `email`, `timestamp`) VALUES
(1, 'nancy1', 'Nancy moore ', 'nancyfake@gmail.com', '2018-11-16 05:02:35'),
(2, 'tony1', 'tony moore ', 'tonyfake@gmail.com', '2018-11-16 05:08:23');
Here is a Re-write of your index.php reflecting ajax/jquery codes
<!doctype html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var len = response.length;
for(var i=0; i<len; i++)
var id = response[i].id;
var username = response[i].username;
var name = response[i].name;
var email = response[i].email;
var tr_str = "<tr>" +
"<td align='center'>" + (i+1) + "</td>" +
"<td align='center'>" + username + "</td>" +
"<td align='center'>" + name + "</td>" +
"<td align='center'>" + email + "</td>" +
"</tr>";
$("#userTable tbody").append(tr_str);
);
);
</script>
</head>
<body>
<div class="container">
<table id="userTable" border="1" >
<thead>
<tr>
<th width="5%">S.no</th>
<th width="20%">Username</th>
<th width="20%">Name</th>
<th width="30%">Email</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</body>
</html>
config.php
Remember to edit database credentials to suit yours
<?php
$host = "localhost"; /* Host name */
$user = "root"; /* User */
$password = ""; /* Password */
$dbname = "your-db-name here"; /* Database name */
$con = mysqli_connect($host, $user, $password,$dbname);
// Check connection
if (!$con)
die("Connection failed: " . mysqli_connect_error());
result.php
<?php
include "config.php";
$return_arr = array();
$query = "SELECT * FROM users ORDER BY NAME";
$result = mysqli_query($con,$query);
while($row = mysqli_fetch_array($result))
$id = $row['id'];
$username = $row['username'];
$name = $row['name'];
$email = $row['email'];
$return_arr[] = array("id" => $id,
"username" => $username,
"name" => $name,
"email" => $email);
// Encoding array in JSON format
echo json_encode($return_arr);
Thats all. Let me know how it goes
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
You will need to return ajax results as json.
I did not see your table and database structure so let me create a table as follows and insert values into it for purpose
of testing
CREATE TABLE `users` (
`id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT,
`username` varchar(100) NOT NULL,
`name` varchar(100) NOT NULL,
`email` varchar(100) NOT NULL,
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
Insert Statetments for testing
INSERT INTO `users` (`id`, `username`, `name`, `email`, `timestamp`) VALUES
(1, 'nancy1', 'Nancy moore ', 'nancyfake@gmail.com', '2018-11-16 05:02:35'),
(2, 'tony1', 'tony moore ', 'tonyfake@gmail.com', '2018-11-16 05:08:23');
Here is a Re-write of your index.php reflecting ajax/jquery codes
<!doctype html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$.ajax(
url: 'result.php',
type: 'get',
dataType: 'JSON',
success: function(response)
var len = response.length;
for(var i=0; i<len; i++)
var id = response[i].id;
var username = response[i].username;
var name = response[i].name;
var email = response[i].email;
var tr_str = "<tr>" +
"<td align='center'>" + (i+1) + "</td>" +
"<td align='center'>" + username + "</td>" +
"<td align='center'>" + name + "</td>" +
"<td align='center'>" + email + "</td>" +
"</tr>";
$("#userTable tbody").append(tr_str);
);
);
</script>
</head>
<body>
<div class="container">
<table id="userTable" border="1" >
<thead>
<tr>
<th width="5%">S.no</th>
<th width="20%">Username</th>
<th width="20%">Name</th>
<th width="30%">Email</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</body>
</html>
config.php
Remember to edit database credentials to suit yours
<?php
$host = "localhost"; /* Host name */
$user = "root"; /* User */
$password = ""; /* Password */
$dbname = "your-db-name here"; /* Database name */
$con = mysqli_connect($host, $user, $password,$dbname);
// Check connection
if (!$con)
die("Connection failed: " . mysqli_connect_error());
result.php
<?php
include "config.php";
$return_arr = array();
$query = "SELECT * FROM users ORDER BY NAME";
$result = mysqli_query($con,$query);
while($row = mysqli_fetch_array($result))
$id = $row['id'];
$username = $row['username'];
$name = $row['name'];
$email = $row['email'];
$return_arr[] = array("id" => $id,
"username" => $username,
"name" => $name,
"email" => $email);
// Encoding array in JSON format
echo json_encode($return_arr);
Thats all. Let me know how it goes
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
answered Mar 25 at 18:41
Nancy MooreeNancy Mooree
9021 gold badge3 silver badges10 bronze badges
9021 gold badge3 silver badges10 bronze badges
can i send JSON data to php variable then use foreach ?
– tokhy2000
Mar 26 at 1:56
1
must you loop using for each. Ajax has an approach. The best bet is the solution i created for you okay. this is the title of your question "I'm trying to apply AJAX to my tbody only not all table". If you are looking foreach approach, you have to rephrase your question and see who helps okay
– Nancy Mooree
Mar 26 at 7:31
add a comment |
can i send JSON data to php variable then use foreach ?
– tokhy2000
Mar 26 at 1:56
1
must you loop using for each. Ajax has an approach. The best bet is the solution i created for you okay. this is the title of your question "I'm trying to apply AJAX to my tbody only not all table". If you are looking foreach approach, you have to rephrase your question and see who helps okay
– Nancy Mooree
Mar 26 at 7:31
can i send JSON data to php variable then use foreach ?
– tokhy2000
Mar 26 at 1:56
can i send JSON data to php variable then use foreach ?
– tokhy2000
Mar 26 at 1:56
1
1
must you loop using for each. Ajax has an approach. The best bet is the solution i created for you okay. this is the title of your question "I'm trying to apply AJAX to my tbody only not all table". If you are looking foreach approach, you have to rephrase your question and see who helps okay
– Nancy Mooree
Mar 26 at 7:31
must you loop using for each. Ajax has an approach. The best bet is the solution i created for you okay. this is the title of your question "I'm trying to apply AJAX to my tbody only not all table". If you are looking foreach approach, you have to rephrase your question and see who helps okay
– Nancy Mooree
Mar 26 at 7:31
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55343939%2fim-trying-to-apply-ajax-to-my-tbody-only-not-all-table%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
