how to call a class function from jquery php? - php

I'm working with the plugin ParamQuery grid and to the data source need to get json data,
this what I want to do with $. getJson (...) {}, but I have a PHP class called data.php, which contains
a method called GetData other InsertData, DeleteData, (CRUD-using PDO), GetData returns the infromacion as json.
The problem is how to call the function from jquery?
the code I use is:
data.php
<?php
class Data {
private $db = NULL;
const DB_SERVER = "localhost";
const DB_USER = "root";
const DB_PASSWORD = "usbw";
const DB_NAME = "musicstore";
public function __construct() {
$dsn = 'mysql:dbname=' . self::DB_NAME . ';host=' . self::DB_SERVER;
try {
$this->db = new PDO($dsn, self::DB_USER, self::DB_PASSWORD);
} catch (PDOException $e) {
throw new Exception('Connection failed: ' . $e->getMessage());
}
return $this->db;
}
public function getData() {
$statement = $this->db->prepare("Select * from Customer");
$statement->execute();
if ($statement->rowCount() > 0) {
echo json_encode($statement);
}
return false;
}
}
?>
functionjquery.js
$.getJSON('Data.php', function(data) {
var obj = {};
obj.width = 1000;
obj.height = 400;
obj.colModel = [{title: "Rank", width: 150, dataType: "integer"},
{title: "Company", width: 200, dataType: "string"},
{title: "Revenues ($ millions)", width: 200, dataType: "float", align: "right"},
{title: "Profits ($ millions)", width: 200, dataType: "float", align: "right"}];
obj.dataModel = {data: data};
$("#grid_array").pqGrid(obj);
});

You need to create a page which constructs an instance of the Data class and then outputs the results of getData()
You shouldn't be echoing from inside a function though. Change your getData method to something like the following:
public function getData() {
$statement = $this->db->prepare("Select * from Customer");
$statement->execute();
return $statement->rowcount() > 0 ? $statement->fetchAll() : NULL;
}
Then, create a new page let's call it json_data.php for transparency's sake:
require_once "data.php";
$dataObj = new Data();
echo json_encode($dataObj->getData());
Now change your $.getJSON call in jQuery to request the json_data.php page.
$.getJSON('json_data.php', function(data) { ... });
And that should work.

Actually you can pass the parameter data along with the $.getJSON request to identify which method to be executed.
For Eg.
in functionjquery.js
$.getJSON('data.php', { method:'get' }, function(data) { ... });
in data.php
Change it as #Jason stated for best practice, and within that
if(isset($_GET['method'])){
switch (($_GET['method'])) {
case 'get':
echo json_encode(getData());
exit();
//other cases go here
default:
break;
}
}
In this way no need to create additional pages for each method

Related

Database not updating using php and jquery

Basically, I want the status to change based on the id. There's no error but it is not updating.
index.php
$(document).ready(function() {
$('.seatCharts-seat').click(function(){
var id = jQuery(this).attr("id");
$seatid = id;
$.post("class/booking.php",
{
seatid:$seatid
},
function(data, status){
console.log('data',data);
console.log('status',status);
console.log($seatid);
});
});
});
booking.php
<?php
require_once 'config.php';
class booking extends config{
public $id;
public function __construct($id){
$this->id = $id;
}
public function editTask(){
$con = $this->con();
$sql = "UPDATE `tbl_booking` SET `status`= 'unavailable' WHERE `id` = $this->id";
$data = $con->prepare($sql);
if($data->execute()){
return true;
}else{
return false;
}
}
}
?>
Option 1 is to create a common file to handle all ajax related activities for the project. Say I would call it as myAjaxHandler.php
Then I would include the required class files are creates its instances to get the required methods called. Keep in mind when your projects get bigger it would be a bit difficult to maintain.
myAjaxHandler.php
<?php
require_once 'booking.php';
if(!empty($_POST) && isset($_POST['seatid'])) {
$booking = new booking($_POST['seatid']);
$result = $booking->editTask();
echo $result; // Would get 1 for true & 0 for false
}
Changes to ajax
$.post("path/to/myAjaxHandler.php",
{
seatid: $seatid
},
function(data, status){
console.log('data',data);
console.log('status',status);
});
Option 2 is to have the above if block inside the booking.php file itself.
<?php
require_once 'config.php';
if(!empty($_POST) && isset($_POST['seatid'])) {
$booking = new booking($_POST['seatid']);
$result = $booking->editTask();
echo $result; // Would get 1 for true & 0 for false
}
class booking extends config { ... }
//Ajax
$.post("path/to/booking.php",
{
seatid: $seatid
},
function(data, status){
console.log('data',data);
console.log('status',status);
});

Why my ajax function does not work on yii2

Hello *** please How can i use ajax function in yii2
in fact I am working on a product of this framework(yii2), not on it directly, But I think it's the same principle. and i want to draw charts (chartJs or googleChart or d3 ... anyway)
so in index file of backend area (xx/xx/xx/dashboard/index.php) I want to send an ajax request to an another php file (simple and logical)
this one is placed in the same folder as index (xx/xx/xx/dashboard) , but nothing happens ! :(
I notice that if I test my two files (indexAjax and phpDB) outside framework folders I get a nice result
but once it's has within framework files, they will no longer work :(
my code is as follows :
1/ part of my index file
<canvas id="mycanvas" width="400" height="400"></canvas>
<script>
$(function()
{
$.ajax({
url: "chartData.php",
type:'POST',
data:{'trigger':'trigger'},
success: function(data) {
alert(data);
console.log(data);
var idTab = [];
var resultatTab = [];
for(var i in data) {
idTab.push("data " + data[i].id);
resultatTab.push(data[i].resultat);
}
var chartdata = {
labels: idTab,
datasets : [
{
label: 'Player Score',
backgroundColor: 'deepskyblue',
borderColor: 'dodgerblue',
hoverBackgroundColor: 'orange',
hoverBorderColor: 'yellow',
data: resultatTab
}
]
};
var ctx = $("#mycanvas");
var doughnutGraph = new Chart(ctx, {
type: 'doughnut',
data: chartdata,
options:{responsive:false}
});
},
error: function(data) {
alert(JSON.stringify(data));
console.log(data);
}
});
}); // fin jQuery
</script>
2/ the 2nd file (php)
<?php
if (isset($_POST['trigger']))
{
//setting header to json
header('Content-Type: application/json');
//database
define('DB_HOST', '127.0.0.1');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_NAME', 'lab');
//get connection
$mysqli = new mysqli(DB_HOST, DB_USERNAME, DB_PASSWORD, DB_NAME);
if(!$mysqli){
die("Connection failed: " . $mysqli->error);
}
//query to get data from the table
$query = sprintf("SELECT * FROM score");
//execute query
$result = $mysqli->query($query);
//loop through the returned data
$data = array();
foreach ($result as $row) {
$data[] = $row;
}
//free memory associated with result
$result->close();
//close connection
$mysqli->close();
//now print the data
print json_encode($data);
}
NB: I must also say that I did not respect the principle of the MVC
i put everything in a same folder ... but I think it's still a choice
thanks a lot
I think you have to look how the routing in yii2 works
http://www.yiiframework.com/doc-2.0/guide-structure-overview.html
or here
http://www.yiiframework.com/doc-2.0/guide-start-hello.html
you can not directly call an php file ..
for example, in javascript:
$.get('/site/user-messages', function (data, status) {
if (status !== 'success') {
console.log('ERROR: '+ status);
return;
}
allData = JSON.parse(data);
});
here site is the controller and user-messages is the action
in this case the prettyUrl mode is enabled in urlManager
Add the content of you charData.php files in a proper action eg: inside siteController.php
public function actionChartData() {
your code
.........
return $this->render('your_related_view', [
/* your vars */
'my_var' => $my_var,
]);
}
the call the action i ajax using
$.ajax({
url: <?php echo \yii\helpers\Url::to(['/site/chart-data']) ?>,
type:'POST',
data:{'trigger':'trigger'},
success: function(data) {
........

AJAX returning 404

I am trying to send JSON from Twig template to PHP class, that will save in it database, but I keed getting 404 error.
This is content of my twig template. My targetis to send this commented off data var, but for testing purposes I replaced it.
function saveUser()
{
var e = document.getElementById("subject_select");
var subject = e.options[e.selectedIndex].text;
console.log(subject);
var e2 = document.getElementById("mark_select");
var mark = e2.options[e2.selectedIndex].value;
console.log(mark);
var e3 = document.getElementById("student_select");
var student = e3.options[e3.selectedIndex].value;
console.log(student);
//var data = ({ subject:subject, mark:mark, student:student}).serialize();
$.ajax({
type: "POST",
url: 'save/',
data: {subject:"a", mark:1, student:2},
success: function(response)
{
console.log(response);
}
});
and class in php:
class TestMark extends Controller
{
/**
* #Route("/save/", name="_save")
*/
public function saveAction(){
$mysqli = new mysqli("localhost", "root", null, "school");
/* check connection */
if (mysqli_connect_errno()) {
printf("Connect failed: %s\n", mysqli_connect_error());
exit();
}
if (!$this->getRequest()->isXmlHttpRequest())
{//no ajax request, no play...
$this->redirect(
$this->generateUrl('_gradebook')
);
}
$jsonString = $this->getRequest();
$jsonArray = json_decode($jsonString, true);
/* create a prepared statement */
if ($stmt = $mysqli->prepare('INSERT INTO marks (studentId, mark, subject) VALUES (?,?,?)')) {
/* bind parameters for markers */
$stmt->bind_param("ssss", $jsonArray['subject'], $jsonArray['mark'], $jsonArray['student']);
/* execute query */
$stmt->execute();
/* close statement */
$stmt->close();
}
/* close connection */
$mysqli->close();
}
}
UPDATE:
After some changes I'm getting error 500 with such log from Chrome console:
GET http://host/save/ 500 (Internal Server Error)
l.cors.b.crossDomain.send # jquery.min.js:4
n.extend.ajax # jquery.min.js:4
n.(anonymous function) # jquery.min.js:4
saveUser # gradebook:66
onclick # gradebook:125
JS and ajax:
<input type="hidden" value="{{ path('_save') }}" id="save_url">
<script>
function saveUser()
{
var requestUrl = $('#save_url').val();
var e = document.getElementById("subject_select");
var subject = e.options[e.selectedIndex].text;
console.log(subject);
var e2 = document.getElementById("mark_select");
var mark = e2.options[e2.selectedIndex].value;
console.log(mark);
var e3 = document.getElementById("student_select");
var student = e3.options[e3.selectedIndex].value;
//var data = ({ subject:subject, mark:mark, student:student }).serialize();
console.log(student);
$.post('{{path('AppBundle_ajax_update')}}',
{subject: 'mydata1', mark:'mydata2', student:'mydata3'},
function(response){
if(response.code == 100 && response.success){//dummy check
//do something
}
}, "json");
}
MarkController.php:
class MarkController extends Controller
{
/**
* #Route("/save/", name="_save")
*/
public function saveAction(){
$request = $this->container->get('request');
$mark = new Mark();
$mark->setSubject($request->query->get('subject'));
$mark->setMark($request->query->get('mark'));
$mark->setStudent($request->query->get('student'));
$em = $this->getDoctrine()->getManager();
$em->persist($mark);
$em->flush();
$response = array("code" => 100, "success" => true);
return new Response(json_encode($response));
}
}
Note: Rename your Controller class
TestMark
to
TestMarkController
Your controller isn't returning any response. Try returning:
return new Symfony\Component\HttpFoundation\Response('student saved');
after you close the mysql connection.
I also recommend getting the request url on the twig template. Like this:
<input type="hidden" value="{{ path('_save') }}" id="save_url">
Then, in your js:
var requestUrl = $('#save_url').val();
$.ajax({
...
url: requestUrl,
...
});
And as suggested by Imanali Mamadiev, you should rename your controller class.

Posting data with AngularJS, PHP and MySQL

I want to store an image as a blob into my database(MySQL) while using PHP Rest service, but I dont know how to do it. Here is my PHP code (I'm using Slim framework for PHP)
function addProblem() {
global $app;
$postdata = file_get_contents("php://input");
$req = json_decode($postdata); // Getting parameter with names
$paramName = $req->station; // Getting parameter with names
$paramAdres = $req->address; // Getting parameter with names
$paramCity = $req->city;// Getting parameter with names
$parampostal = $req->postalcode;
$parampic = $req->pictureOfDamage;
$paramdescrip= $req->description;
$sql = "INSERT INTO problems (Station,Address,Postalcode,City,PictureOfDamage,Description) VALUES (:station,:address,:postalcode,:city,:pictureOfDamage,:description)";
try {
$dbCon = getConnection();
$stmt = $dbCon->prepare($sql);
$stmt->bindParam(':station', $paramName);
$stmt->bindParam(':address', $paramAdres);
$stmt->bindParam(':city', $paramCity);
$stmt->bindParam(':postalcode', $parampostal);
$stmt->bindParam(':pictureOfDamage', $parampic);
$stmt->bindParam(':description', $paramdescrip);
$stmt->execute();
$dbCon = null;
echo json_encode("toegevoegd ");
} catch(PDOException $e) {
echo '{"error":{"text":'. $e->getMessage() .'}}';
}
}
and this is my angular code (i'm using fileuploader right now.)
.controller('MeldingController', function ($scope, $upload, $rootScope, $state, $http) {
$scope.station = $rootScope.station;
$scope.PictureOfDamage;
$scope.upload = function (files) {
if (files && files.length) {
for (var i = 0; i < files.length; i++) {
var pictureOfDamage = files[i];
return pictureOfDamage;
}
}
}
$scope.submit = function () {
console.log($scope.PictureOfDamage);
var data = {
station: $scope.station.name,
address: $scope.station.streetName,
postalcode: $scope.station.postalCode,
city: $scope.station.city,
pictureOfDamage: $scope.upload($scope.files) /* picture*/,
description: document.getElementById("Description").value
}
console.log('NOJSN ', data);
data = JSON.stringify(data);
console.log('JSON', data)
$http({
method: "POST",
url: 'http://localhost/Dats24/problem/add/',
data: data})
.success(function (data, status, headers, config) {
$state.go('GoogleMaps');
}).error(function (data, status, headers, config) {
console.log(data);
});
};
})
For your angular application, you can use the upload method of the $upload service like this:
file_upload: function(file) {
return $upload.upload({
url: 'http://your-upload-url/',
file: file
});
}
as described in here : https://github.com/danialfarid/ng-file-upload
Then on your service in PHP, you can get the file using
move_uploaded_file($_FILES['file']['tmp_name'], $file_path);
It will store the file on the path of your choice, then you can use PHP to do whatever you want with the file data.

AJAX request and PHP class functions

How to call a PHP class function from an ajax call
animal.php file
class animal
{
function getName()
{
return "lion";
}
}
Then in my ajax.php file I have an ajax request, need to get values from getName function
How to do that getName() function can I do like this?
<script type=text/javascript>
$.ajax({
type: "POST",
data: {
invoiceno:jobid
},
url: "animal/getName",
beforeSend: function() {
},
dataType: "html",
async: false,
success: function(data) {
result=data;
}
});
</script>
My answer is the same as Surreal Dreams answer, but with the code.
First. Class animal is OK. Leave it like that:
animal.php
<?php
class animal
{
function getName()
{
return "lion";
}
}
Next. Create a new animalHandler.php file.
<?php
require_once 'animal.php';
if(isset( $_POST['invoiceno'] )) {
$myAnimal = new animal();
$result = $myAnimal->getName();
echo $result;
}
Finally. Change your Javascript.
<script type=text/javascript>
$.ajax({
type: "POST",
data: {
invoiceno:jobid
},
url: "animalHandler.php",
dataType: "html",
async: false,
success: function(data) {
result=data;
}
});
</script>
That's is.
You need one additional script, because your animal class can't do anything on its own.
First, in another script file, include animal.php. Then make an object of the animal class - let's call it myAnimal. Then call myAnimal->getName() and echo the results. That will provide the response to your Ajax script.
Use this new script as the target of your Ajax request instead of targeting animal.php.
OOP Currently with php:
ajax.html program(client tier) -> program.php (middle tier) -> class.php (middle tier) -> SQL call or SP (db tier)
OOP Currently with DotNet:
ajax.html program(client tier) -> program.aspx.vb (middle tier) -> class.cls (middle tier) -> SQL call or SP (db tier)
My real-life solution:
Do OOA, do not OOP.
So, I have one file per table -as a class- with their proper ajax calls, and select the respective ajax call with a POST parameter (i.e. mode).
/* mytable.php */
<?
session_start();
header("Content-Type: text/html; charset=iso-8859-1");
$cn=mysql_connect ($_server, $_user, $_pass) or die (mysql_error());
mysql_select_db ($_bd);
mysql_set_charset('utf8');
//add
if($_POST["mode"]=="add") {
$cadena="insert into mytable values(NULL,'".$_POST['txtmytablename']."')";
$rs=mysql_query($cadena,$cn) or die(mysql_error().' : '.$cadena);
};
//modify
if($_POST["mode"]=="modify") {
$cadena="update mytable set name='".$_POST['txtmytablename']."' where code='".$_POST['txtmytablecode']."'";
$rs=mysql_query($cadena,$cn) or die(mysql_error().' : '.$cadena);
};
//erase
if($_POST["mode"]=="erase") {
$cadena="delete from mytable where code='".$_POST['txtmytablecode']."'";
$rs=mysql_query($cadena,$cn) or die(mysql_error().' : '.$cadena);
};
// comma delimited file
if($_POST["mode"]=="get") {
$rpta="";
$cadena="select * from mytable where name like '%".$_POST['txtmytablename']."%'";
$rs=mysql_query($cadena,$cn) or die(mysql_error().' : '.$cadena);
while($row = mysql_fetch_array($rs)) {
$rowCount = mysql_num_fields($rs);
for ($columna = 0; $columna < $rowCount; $columna++) {
$rpta.=str_replace($row[$columna],",","").",";
}
$rpta.=$row[$columna]."\r\n";
}
echo $rpta;
};
//report
if($_POST["mode"]=="report_a") {
$cadena="select * from mytable where name like '%".$_POST['txtmytablename']."%'";
$rs=mysql_query($cadena,$cn) or die(mysql_error().' : '.$cadena);
while ($row=mysql_fetch_array($rs)) {
echo $row['code']." ".$row['name']."<br/>"; // colud be a json, html
};
};
//json
if($_POST["mode"]=="json_a") {
$cadena="select * from mytable where name like '%".$_POST['txtmytablename']."%'";
$rs=mysql_query($cadena,$cn) or die(mysql_error().' : '.$cadena);
$result = array();
while ($row=mysql_fetch_array($rs)) {
array_push($result, array("id"=>$row['code'],"value" => $row['name']));
};
echo json_encode($result);
};
?>
Can you please mention which are you using any Framework?
You method is correct but I want to mention two things over here. First try your URL from the browser and check if its working correctly. Secondly don't use return, in *success: function(data) * data will contain only the output. so use Echo rather then return
For what it is worth, I have used a PHP proxy file that accepts an object as a post -- I will post it here. It works by providing class name, method name, parameters (as an array) and the return type. This is limited as well to only execute classes specified and a limited set of content types to return.
<?php
// =======================================================================
$allowedClasses = array("lnk","objects"); // allowed classes here
// =======================================================================
$raw = file_get_contents("php://input"); // get the complete POST
if($raw) {
$data = json_decode($raw);
if(is_object($data)) {
$class = $data->class; // class: String - the name of the class (filename must = classname) and file must be in the include path
$method = $data->method; // method: String - the name of the function within the class (method)
#$params = $data->params; // params: Array - optional - an array of parameter values in the order the function expects them
#$type = $data->returntype; // returntype: String - optional - return data type, default: json || values can be: json, text, html
// set type to json if not specified
if(!$type) {
$type = "json";
}
// set params to empty array if not specified
if(!$params) {
$params = array();
}
// check that the specified class is in the allowed classes array
if(!in_array($class,$allowedClasses)) {
die("Class " . $class . " is unavailable.");
}
$classFile = $class . ".php";
// check that the classfile exists
if(stream_resolve_include_path($classFile)) {
include $class . ".php";
} else {
die("Class file " . $classFile . " not found.");
}
$v = new $class;
// check that the function exists within the class
if(!method_exists($v, $method)) {
die("Method " . $method . " not found on class " . $class . ".");
}
// execute the function with the provided parameters
$cl = call_user_func_array(array($v,$method), $params );
// return the results with the content type based on the $type parameter
if($type == "json") {
header("Content-Type:application/json");
echo json_encode($cl);
exit();
}
if($type == "html") {
header("Content-Type:text/html");
echo $cl;
exit();
}
if($type == "text") {
header("Content-Type:text/plain");
echo $cl;
exit();
}
}
else {
die("Invalid request.");
exit();
}
} else {
die("Nothing posted");
exit();
}
?>
To call this from jQuery you would then do:
var req = {};
var params = [];
params.push("param1");
params.push("param2");
req.class="MyClassName";
req.method = "MyMethodName";
req.params = params;
var request = $.ajax({
url: "proxy.php",
type: "POST",
data: JSON.stringify(req),
processData: false,
dataType: "json"
});
Try this:
Updated Ajax:
$("#submit").on('click', (function(e){
var postURL = "../Controller/Controller.php?action=create";
$.ajax({
type: "POST",
url: postURL,
data: $('form#data-form').serialize(),
success: function(data){
//
}
});
e.preventDefault();
});
Update Contoller:
<?php
require_once "../Model/Model.php";
require_once "../View/CRUD.php";
class Controller
{
function create(){
$nama = $_POST["nama"];
$msisdn = $_POST["msisdn"];
$sms = $_POST["sms"];
insertData($nama, $msisdn, $sms);
}
}
if(!empty($_POST) && isset($_GET['action']) && $_GET['action'] == ''create) {
$object = new Controller();
$object->create();
}
?>
For every ajax request add two data, one is class name and other is function name
create php page as follows
<?php
require_once 'siteController.php';
if(isset($_POST['class']))
{
$function = $_POST['function'];
$className = $_POST['class'];
// echo $function;
$class = new $className();
$result = $class->$function();
if(is_array($result))
{
print_r($result);
}
elseif(is_string($result ) && is_array(json_decode($result , true)))
{
print_r(json_decode($string, true));
}
else
{
echo $result;
}
}
?>
Ajax request is follows
$.ajax({
url: './controller/phpProcess.php',
type: 'POST',
data: {class: 'siteController',function:'clientLogin'},
success:function(data){
alert(data);
}
});
Class is follows
class siteController
{
function clientLogin()
{
return "lion";
}
}
I think that woud be a sleek workaround to call a static PHP method via AJAX which will also work in larger applications:
ajax_handler.php
<?php
// Include the class you want to call a method from
echo (new ReflectionMethod($_POST["className"], $_POST["methodName"]))->invoke(null, $_POST["parameters"] ? $_POST["parameters"] : null);
some.js
function callPhpMethod(className, methodName, successCallback, parameters = [ ]) {
$.ajax({
type: 'POST',
url: 'ajax_handler.php',
data: {
className: className,
methodName: methodName,
parameters: parameters
},
success: successCallback,
error: xhr => console.error(xhr.responseText)
});
}
Greetings ^^

Categories