I have a problem with getJSON. Following is the scenario -
Here is my HTML code -
<h3 align="center"> Example 1</h3>
<table align="center">
<tr>
<td><select name="stud_sel" onChange="getDetails(this)">
<option value="100">Lohith</option>
<option value="101">Ranjeet</option>
<option value="102">Karthik</option>
<option value="103">Pav</option>
</select></td>
</tr>
</table>
<br/>
<!--HERE WRITE THE RESPONSE DATA -->
<div id ="stud_tbl" align="center"> </div>
<!---END-->
Here is my Javascript function ---->
function getDetails(id) {
var myTable = '' ;
myTable += '<table id="myTable" cellspacing=0 cellpadding=2 border=1>' ;
var id_val = id.value;
//window.alert(id_val);
var url = "http://localhost:81/json-with-jquery/json.php?id="+id_val;
alert (url);
$.getJSON(url, function(json) {
$.each(json, function(i,v) {
myTable += "<tr><td>"+i+"</td><td>"+v+"</td></tr></table>";
});
$("#stud_tb1").html(myTable) ;
});
};
And the PHP file from where data is coming to my JS function is -
<?php
include 'configure.php';
$stud_id = $_GET['id'];
echo $_GET['id'];
$qr = "SELECT * FROM student_details WHERE regno = $stud_id";
$res= mysql_query($qr);
$row = mysql_fetch_array($res);
$stud_arr["full_name"] = $row["full_name"];
$stud_arr["reg_no"] = $row["regno"];
$stud_arr["address"] = $row["address"];
$stud_arr["mark1"] = $row["mark1"];
$stud_arr["mark2"]= $row["mark2"];
$stud_arr["mark3"] = $row["mark3"];
header('Content-type: application/json');
echo json_encode($stud_arr);
?>
The problem here is when I run my PHP file individually, it's giving me the expected data in JSON format, with the help of json_encode($stud_array).
The same when I am trying to display on my HTML page, I don't receive any data on the page.
The "alert(url)" in my JS function is properly alerting message as "http://localhost:81/json-with-jquery/json.php?id=102" when I selected the list item with ID 102.
Am not sure why the data is not being displayed. I hope I have the Javascript written properly. Please help.
Populate your table properly,
myTable="<table>";
$.each(json, function(i,v) {
myTable += "<tr><td>"+i+"</td><td>"+v+"</td></tr>";
});
myTable+="</table>";
Your output is not valid json that's the problem, your echo $_GET['id']; is breaking your json output, remove it. If you want to send it in the output put it in the json response.
$stud_arr["id"] = $_GET['id'];
header('Content-type: application/json');
echo json_encode($stud_arr);
Related
I have multiple select options. however, i want when i select 1 option or two or whatever to change the columns <th></th> of html dynamically and get data from database
Currently I have created the multiple select option and html table
<select class="selectpicker" id="sensor" name="sensor[]" multiple>
<option
value="temperature">Temperature</option>
<option value="humidity">Humidity</option>
<option value="presure">Presure</option>
<option
value="level">Level</option>
</select>
$query = "SELECT ".$selectedSensorOption." from p1";
$result = $db_handle->runQuery($query);
foreach ($result as $key => $value) {
<table>
<tr>
<th>$result</th>
</tr>
<tr>
<td>$result</td>
I want to get dynamic columns and fields as well from MySQL db based on multiple select options
A straight forward way of doing this is to use the key values of the result to act as the headers and then output each row of data as the values (comments in code)...
// Output table start and header row
echo "<table><tr>";
// Use the first rows results as the header values
foreach ( $result[0] as $header => $value ) {
echo "<th>{$header}</th>";
}
echo "</tr>";
// Output each data row
foreach ($result as $values) {
echo "<tr>";
// Loop over each item in the row and output the value
foreach ( $values as $value ) {
echo "<td>{$value}</td>";
}
echo "</tr>";
}
echo "</table>";
You can create shorter code (using implode() etc.), but sometimes simpler code is easier to start with and maintain.
Using the returned column names means you may be able to use specific headings using column aliases - something like
id as `User ID`, fullname as `Name`
I used AJAX. Hope this helps ;D
read.php
<?php
//include header
header('Content-Type: application/json');
$conn= mysqli_connect("localhost","my_user","my_password","my_db");
if (mysqli_connect_errno()){
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$type = $_GET["type"];
if($type == "GetCategory"){
//SAMPLE QUERY
$sql = "SELECT CategoryID,CategoryName from Category";
$data = array();
$results = $db -> query($sql);
while($row = mysqli_fetch_assoc($results)){
$data[] = $row;
}
echo json_encode($data);
}
if($type == "GetSubCategory"){
$CategoryID = $_POST["CategoryID"];
//SAMPLE QUERY
//LET'S ASSUME THAT YOU HAVE FOREIGN KEY
$sql = "SELECT SubCategoryID,SubCategoryName from SubCategory where CategoryID = '".$CategoryID."'";
$data = array();
$results = $db -> query($sql);
while($row = mysqli_fetch_assoc($results)){
$data[] = $row;
}
echo json_encode($data);
}
?>
index.html
<select id="category"></select>
<select id="subcategory"></select>
<!--PLEASE INCLUDE JQUERY RIGHT HERE E.G. <script src='jquery.min.js'></script>-->
<!--DOWNLOAD JQUERY HERE https://jquery.com/-->
<script>
LoadCategory();
function LoadCategory(){
$.ajax({
url:"read.php?type=GetCategory",
type:"GET",
success:function(data){
var options = "<option selected disabled value="">Select
Category</option>";
for(var i in data){
options += "<option value='"+data[i].CategoryID+"'>" + data[i].CategoryName + "</option>";
}
$("#category").html(options);
}
});
}
function LoadSubCategory(CategoryID){
$.ajax({
url:"read.php?type=GetSubCategory",
type:"POST",
data:{
CategoryID : CategoryID
},
success:function(data){
var options = "<option selected disabled value="">Select Sub-Category</option>";
for(var i in data){
options += "<option value='"+data[i].SubCategoryID+"'>" + data[i].SubCategoryName + "</option>";
}
$("#subcategory").html(options);
}
});
}
$("#category").change(function(){
LoadSubCategory(this.value);
});
first you have to get the headers, you can use explode to get the header keys.
you'll use two loops, the first one to build the header and the second one to build the body. inside the body loop, you have to use another loop to get the correct value for each column
<select class="selectpicker" id="sensor" name="sensor[]" multiple>
<option value="temperature">Temperature</option>
<option value="humidity">Humidity</option>
<option value="presure">Presure</option>
<option value="level">Level</option>
</select>
<?php
$query = "SELECT ".$selectedSensorOption." from p1";
$results = $db_handle->runQuery($query);
//get the headers if $selectedSensorOption is not an array
$headers = explode(',', $selectedSensorOption)
?>
<table>
<thead>
<tr>
<!-- loop and fill the header -->
<?php foreach ($headers as $header) : ?>
<th><?= ucfirst($header) ?></th>
<?php endforeach; ?>
</tr>
</thead>
<tbody>
<!-- loop and fill the body-->
<?php foreach ($results as $result) : ?>
<tr>
<!-- loop and fill each column -->
<?php foreach ($headers as $header) : ?>
<th><?= $result[$header] ?></th>
<?php endforeach; ?>
</tr>
<?php endforeach; ?>
</tbody>
</table>
Hi i have a function in jquery and using $.Post to send data on a php file where my query is working fine and sending data back
js
function send_agenda_data(cidade_data){
var data = {'cidade_data':cidade_data};
$.post('includes/agenda_data.php',data,function(info){
});
}
This function works fine and when i alert the data coming back that also works fine
here is php
<?php
include_once("connection.php");
$cidade_data = $_POST['cidade_data'];
if (isset($cidade_data)) {
$sql = mysql_query("select * from agenda where cidade = '$cidade_data'", $con) or die(mysql_error());
if (mysql_num_rows($sql) > 0) {
while ($data = mysql_fetch_object($sql))
{
$date = $data->data;
$cidade = htmlentities($data->cidade);
$estado = htmlentities($data->estado);
$local = htmlentities($data->local);
$endereco = htmlentities($data->endereco);
$site_local = htmlentities($data->site_local);
$site_ingresso = htmlentities($data->site_ingresso);
$endereco = htmlentities($data->endereco);
}
}
else{
echo "No Data";
}
}
?>
this works fine if i use directly using php and echo the variables in tags now
$.post('includes/agenda_data.php',data,function(info){
//need data here
});
i want to know how i can get the php returned data in js here and how i assign that data into tags. also want to know there is while loop in php is here will be also loop to populate all rows ?
if i use direct php in my webpage then i can use like this in while loop
<div><?php echo $date; ?></div>
<div><?php echo $cidade; ?></div>
<div><?php echo $estado; ?></div>
<div><?php echo $local; ?></div>
.
.
.
how can i get in $.Post case
Your loop is somewhat incorrect. You're simply fetching each row's data, and then overwriting the previous row's data in all those variables. You should be building an array of results, which you can then send over to the client-side JS code. e.g. something like
$data
while($row = mysql_fetch_assoc($result)) {
$data[] = $row;
}
echo json_encode($data);
On the client side, you'll receive an array of objects you can iterate over:
$.post('includes/agenda_data.php',data,function(data){
$.each(data, function(idx, row) {
$('#date').innerHTML = row['date'];
...
});
});
exactly what you do in that JS loop is up to you.
As well, note that your PHP code is vulnerable to SQL injection attacks.
$.post is an AJAX call, thus you need to echo the result in PHP, to make sure you can use the results.
Try using
echo json_encode($your_data)
And to use the data in client side (browser), you can use
http://api.jquery.com/jQuery.parseJSON/
That parseJSON is used so you can use the data easier.
Why not use jQuery to fill the contents of the div by assigning a class as in this example:
<div class="date"><?php echo $date; ?></ div>
<div class="cidade"><?php echo $cidade; ?></ div>
<div class="estado"><?php echo $estado; ?></ div>
<div class="local"><?php echo $local; ?></ div>
and with jQuery, the success of $.post retrieve the information returned and integrate like this.
$('.date').html(info[0]['date']);
a user checks the type of zones and choose the type of change; this script will load the change description details from a database into a textarea field in html.
Then what I want to happend next is:
the descriptions text gets appended with the different zones the changes will take place within the html description textarea. I do not want the zones to be appended to my description data in my database. The issue is the appending of the different zones to the description field is not working..
I am using javascript to append the text. Can someone advice me why I need to correct my code?
<html>
<head>
<script language="JavaScript" type="text/javascript">
// who says we found anything? Maybe this id does not even exist.
function getData(combobox){
var value = combobox.options[combobox.selectedIndex].value
// TODO: check whether the textarea content has been modified.
// if so, warn the user that continuing will lose those changes and
// reload a new page, and abort function if so instructed.
document.location.href = '?change_type='+value;
data_center = [],
data_centers = "";
inputs = document.getElementsByTagName('input');
for (var x = 0, len = inputs.length; x < len; x++) {
{
if (inputs[x].type == "checkbox" && inputs[x].name == 'data_center[]') {
if (inputs[x].checked === true) {
data_center.push(inputs[x].value);
}
}
}
data_centers = (data_center.length > 0 ? ': ' + data_center.join(', ') : '') + '.';
document.getElementById('description').value += data_centers;
document.getElementById('impact').value += data_centers;
}
}
</script>
</head>
<?php
require_once("db_handler.php");
// $_REQUEST is both _GET and _POST
if (isset($_REQUEST['change_type'])) {
$change_type = mysql_real_escape_string($_REQUEST['change_type']);
} else {
$change_type = False;
}
$query = "SELECT `changeID` , `changeName` FROM `change`;";
$exec = mysql_query($query); // You need to be already connected to a DB
if (!$exec) {
trigger_error("Cannot fetch data from change table: " . mysql_error(), E_USER_ERROR);
}
if (0 == mysql_num_rows($exec)) {
trigger_error("There are no changes in the 'change' table. Cannot continue: it would not work. Insert some changeids and retry.", E_USER_ERROR);
}
$options = '';
while($row = mysql_fetch_array($exec))
{
// if the current pageid matches the one requested, we set SELECTED
if ($row['changeID'] === $change_type)
// who says we found anything? Maybe this id does not even exist.
$sel = 'selected="selected"';
else
{
// If there is no selection, we use the first combo value as default
if (False === $change_type)
$change_type = $row['changeID'];
$sel = '';
}
$options .= "<option value=\"{$row['changeID']}\" $sel>{$row['changeName']}</option>";
}
mysql_free_result($exec);
if (isset($_POST['description']))
{
$change_data = mysql_real_escape_string($_POST['description']);
$query = "INSERT INTO change ( changeID, description ) VALUE '{$change_type}', '{$change_data}' ) ON DUPLICATE KEY UPDATE description=VALUES(description);";
if (!mysql_query($query))
trigger_error("An error occurred: " . mysql_error(), E_USER_ERROR);
}
$query = "SELECT `changeID` , `changeName` FROM `change`;";
$exec = mysql_query($query); // You need to be already connected to a DB
// abbreviated unchanged code.
$query = "SELECT `description`, `impact` FROM `change` WHERE `changeID`='{$change_type}';";
$exec = mysql_query($query);
if (mysql_num_rows($exec) > 0)
{
// if it does, we're inside a textarea and we directly output the text
$row = mysql_fetch_array($exec);
$textareaDescription = $row['description'];
$textareaImpact = $row['impact'];
} else {
$textareaDescription = '';
$textareaImpact = '';
}
mysql_free_result($exec);
?>
<body bgcolor="white">
<form name="changeform" method="post" action="email_form.php">
<table>
<tr valign="top">
<td><b>Data Center</b></td>
<td><input name="data_center[]" type="checkbox" value="[Zone10]"/>[Zone10]
<input name="data_center[]" type="checkbox" value="[Zone11]"/>[Zone11]
</td>
</tr>
<tr valign="top">
<td><b>Change Type</b></td>
<td><select id="change_type" name="change_type" onChange="getData(this)""><?php print $options; ?></select></td>
</tr>
<tr valign="top">
<td><b>Description</b></td>
<td><textarea name="description" id="description" cols="50" rows="10"><?php print $textareaDescription; ?></textarea></td>
</tr>
<tr valign="top">
<td><b>Service Impact</b></td>
<td><textarea name="impact" id="impact" cols="50" rows="10"><?php print $textareaImpact; ?></textarea></td>
</tr>
<tr valign="top">
<td align="center" colspan="2"><input type="submit" value="submit change" /></td>
</tr>
</table>
</form>
</body>
</html>
The following lines look like there might be something wrong:
for (var x = 0, len = inputs.length; x < len; x++)
{
{
Unless that is syntax that I'm just not familiar with.
Is there any way you could show us the actual code, running? Looking at something like this is a bit hard to digest without being able to see it in action.
Hey guys I am trying to get a specific name from a table. Here is my code:
$(document).ready(function () {
$("#NotesAccessor").click(function () {
var notes_name = $(this).document.getElementById("#user_table");
alert(notes_name);
run();
});
});
Here is the above this is where I am trying to access the associated username with which table row was click with the #notesAccessor
Table:
.........
<td>
$csvusername
</td>
.........
<td>
";
if ($checkNotes[1] == 'No')
{
echo "None";
}
if ($checkNotes[1] == 'Yes')
{
echo "<a href='#' id='NotesAccessor'>Click to access</a>";
}
echo "
</td>
........
My question is - how do I get the $csvusername of the associated NotesAccessor so I can then send this to a dialog in Jquery and open of the notes of that one person I need to get.
Hope this makes sense.
update:
here is full table:
<table class='results'>
<tr class='firsttr' style='background:gray;'>
<td>First Name</td>
<td>Last Name</td>
<td>Email</td>
<td>Phone</td>
<td>Username</td>
<td>Password</td>
<td>Status</td>
<td>Combined Single Limit</td>
<td>Bodily Injury Each Person</td>
<td>Bodily Injury Each Accident</td>
<td>Property Damage</td>
<td>Address</td>
<td>Notes</td>
<td>#</td>
</tr>"; $j = 0; while ($row = $sth->fetch(PDO::FETCH_ASSOC)) { $val = 1; $csvfirst
= $row; $csvfirstname = $csvfirst['firstname']; $csvlastname = $csvfirst['lastname'];
$csvemail = $csvfirst['email']; $csvphone = $csvfirst['phone']; $csvusername
= $csvfirst['username']; $csvpassword= $csvfirst['password']; $csvstatus
= $csvfirst['status']; $csvnotes = $csvfirst['notes']; $csl = $csvfirst['Combinedlimit'];
$bodyinj = $csvfirst['bodyinjur']; $eachacc = $csvfirst['bodyinjureachacc'];
$propertydmg = $csvfirst['propertydmg']; // Select the current employees
address $psql = "SELECT MailingAdrs FROM insuranceverificationdisclaimer
WHERE TraineeUsername =:user"; $psth= $DBH->prepare($psql); $psth->execute(array(':user'
=> $csvusername )); while ($prow = $psth->fetch(PDO::FETCH_ASSOC)) { $pcheck
= $prow; $address = $pcheck['MailingAdrs']; } if ($csvstatus != "No Longer
Work Here" && $csvstatus == "Confirmed"){ //check to see if notes exist
if (empty($csvnotes)) { $checkNotes = 0; } else { $checkNotes = 1; } $memberfirstnamearray[$j]
= $csvfirstname; $memberlastnamearray[$j] = $csvlastname; $memberemailarray[$j]
= $csvemail; $memberphonearray[$j] = $csvphone; $membercsl[$j] = $csl;
$memberbodyinj[$j] = $bodyinj; $membereachacc[$j] = $eachacc; $memberpropertydmg[$j]
= $propertydmg; $memberstatus[$j] = $csvstatus; $memberaddress[$j] = $address;
$j++; $i++; echo "
<tr>
<td>$csvfirstname</td>
<td>$csvlastname</td>
<td>$csvemail</td>
<td>$csvphone</td>
<td class='user_table'>$csvusername</td>
<td>$csvpassword</td>
<td>$csvstatus</td>
<td>$csl</td>
<td>$bodyinj</td>
<td>$eachacc</td>
<td>$propertydmg</td>
<td>$address</td>
<td>"; if ($checkNotes == 0) { echo "None"; } if ($checkNotes == 1) { echo
"<a href='#' id='NotesAccessor'>Click to access</a>"; } echo "</td>
<td>$i</td>
</tr>"; } }
</table>
You are mixing pure JavaScript with jQuery, you can solve it as follows.
First of all, you can put a class to identify the <td> with $csvusername, like class='td_with_csvusername' and then do this:
$(document).ready(function () {
$(".NotesAccessor").on("click", function () {
var td = $(this).parent().parent().find(".td_with_csvusername");
alert(td.html());
});
});
Posting the output HTML is better than the PhP version but I assume you have HTML similar to this:
<table>
<tbody>
<tr>
<td>UserName</td>
<td><a href='#' id='NotesAccessor'>Click to access</a>"</td>
</tr>
</tbody>
</table>
Then you can look for the previous sibling of the parent of the anchor by using jQuery's parent() and prev(), similar to this:
$(document).ready(function () {
$("#NotesAccessor").click(function () {
var notes_name = $(this).parent().prev().html();
alert(notes_name);
//run();
});
});
DEMO - Looking to the matching username column
If the above HTML is not like that then please post the exact output as it is important for knowing how to traverse to the matching td in the same tr when you click the anchor. Assuming that is what you are trying to achieve.
Edit
Only seen your update now. I know you already have a solution but for completeness I have added to this answer anyway in case it is useful to future users.
In your sample code you already have class on the user-name cell user_table. You can use that to target instead then. Also, given you said you will have several rows with the #NoteAccessor, you should change the id="NoteAccessor" to class="NoteAccessor" as ids have to be unique or it is invalid HTML. In addition jQuery only returns the first element with a matched id.
The script which you end up with is straight forward then using parent() as before but now you can also use prevAll() specifying the class selector:
$(document).ready(function () {
// using class ".NotesAccessor" instead of id "#NotesAccessor"
// as element is repeated in each tr
$(".NotesAccessor").click(function () {
var notes_name = $(this).parent().prevAll('.user_table').html();
alert(notes_name);
});
});
DEMO - Using parent() and prevAll('.user_table')
I have this script:
<script type='text/javascript' src='js/jquery-1.4.4.mi.js'></script>
<script type='text/javascript'>
$('.filterMonth').change(function(){
alert('ijijiji');
$.ajax({
url: 'ajax/filterMandays.php',
//type: 'GET',
success: function(data){
//data is returned back
$('#mandayTable').html(data);
}
});
});
</script>
and this html:
<select name ="filterMonth">
<?php
$array_month = array("January","February","March","April","May","June","July","August","September","October","November","December");
foreach($array_month as $key => $month)
{
$value_month = $key+1;
echo "<option value = '$value_month'>$month</option>";
}
?>
</select>
-
<select name = "filterYear" onChange = "filter(filterMonth.value, filterYear.value)">
<?php
$curYear = date('Y');
for($i = 1990; $i<=$curYear+10; $i++)
{
if($i == $curYear)
{
echo "<option value = '$i' selected = 'selected'>$i</option>";
}
else
{
echo "<option value = '$i'>$i</option>";
}
}
?>
</select>
</td>
</tr>
</br>
</br>
<tr>
<div id="mandayTable"></div>
and this php page:
<?php
include("all.php");
$q = "SELECT md.mandays_id,md.employeenum,md.month,md.year,md.required_man_days,d.firstname,d.lastname
FROM tbl_mandays md,tbl_employee_details d
WHERE md.active = '1'
AND md.employeenum = d.employeenum
AND md.month = '10';";
$res = $db->Execute($q);
echo "<table border = 1>";
echo "<tr><th>Employee Number</th><th>First Name</th><th>Last Name</th><th>Month-Year</th><th>Required Man Days</th><th>Edit/Delete</th></tr>";
while($rows = $res->FetchRow())
//for($i=0;$i<5;$i++)
{
//iterating through // check if employee
// // if(isset($row[])) { }
$mandays_id = $rows[0];
$empnum = $rows[1];
$month_year = $rows[2] ."-" .$rows[3];
$required_man_days = $rows[4];
$firstname = $rows['month'];
$lastname = $rows[6];
//echo approvers here are not taken
//<a href=\"view_team.php?id=".$empnum."\" -> for someone to view the people beneath them (like org tree)
echo "<tr><td>".$empnum . "</td><td>".$firstname ."</td><td>".$lastname ."</td><td>" . $month_year ."</td><td>" .$required_man_days . "</td><td width = \"200\" align = \"center\"><a href = 'edit_mandays.php?mandays_id=$mandays_id');'>Edit/Delete</a></td></tr>";
}
echo "</table>";
?>
the script should basically load the php page in the div in the html once the "filterMonth" has been changed. but it doesn't work.
what seems to be the problem? :(
The selector in your jQuery is $('.filterMonth') but your select box doesn't have the filterMonth class. You need to change it to $('select[name=filterMonth]').
In order for the jQuery selector to contain your select, you need to make sure that it runs after the Select element is in the DOM (ie: lower down the HTML), or run your JavaScript once the document has finished loading, for example:
<script type='text/javascript' src='js/jquery-1.4.4.mi.js'></script>
<script type='text/javascript'>
jQuery(function() {
// do your DOM selections here, this function only runs once the document is loaded
});
</script>