How to transfer a query from JavaScript to a PHP file

Question

I am continuing a project and I'm just a newbie in PHP and JavaScript. My code works well but my website loads very slow.

function FilterDots() {
    if($(".CmbCategoryFilter").val().toString() == "Laptop") {
        //$("." + $(".CmbCategoryFilter").val().toString()).show();
        //$(".ImgDots").hide();
        $(".DivBody").load("dots.php", {Query: "SELECT * FROM `Tbl_Units` WHERE `Category` = \"Laptop\" ORDER BY `NetBios_Name` ASC"});
    }
    else if($(".CmbCategoryFilter").val().toString() == "Desktop") {
        //$("." + $(".CmbCategoryFilter").val().toString()).show();
        //$(".ImgDots").hide();
        (".DivBody").load("dots.php", {Query: "SELECT * FROM `Tbl_Units` WHERE `Category` = \"Desktop\" ORDER BY `NetBios_Name` ASC"}); 
    }
    else {
        $(".DivBody").load("dots.php", {Query: "SELECT * FROM `Tbl_Units` ORDER BY `NetBios_Name` ASC"});
        //$(".ImgDots").show();
    }
}

This a function in my javascript. I'm using .load() to be able to include a query and load only the category desired.

Is there anyway that I can pass my Query to my dots.php without using .load()?

As @technophobia suggests, the current code is insanely insecure. The syntax of SQL queries should live only in your server-side code (i.e. PHP). You can keep using `load` or any other jquery AJAX method (read about this too), but just move the condition and the query itself to the PHP script. In other words - compare the value of the filter in your server-side script, and decide there which query is suitable. Note that this should not affect the speed of your site. That issue may be the fault of other factors. — Boaz, Jul 01 '15 at 06:30
Also the reason for slowness might lie somewhere else like server speed, PHP script, resources used in webpage and not neccessarly on client side code. — fsacer, Jul 01 '15 at 06:34
I think, it is because of using `.load()`. I need to load over hundreds of dots. When I use `$(".ImgDots").show()`, it works perfectly fine but I find no way to show only a specified category. — Rowel, Jul 01 '15 at 06:42

Gustaf Gunér · Answer 1 · 2015-07-01T06:45:17.620

3

This is possible to do via .load(), but I tend to use the .ajax() function instead. However, your example is as mentioned very insecure. You can easily just edit that client-side SQL into fetching someone's personal details for example.

EDIT: If you're worrying about the speed, you should maybe limit the amount of database rows you're querying. And then implement some kind of infinite-scroll/"Load more"-button that queries from a specific offset.

Do something like the example below. And make sure to validate in PHP too.

JS

$.ajax({
  url: "dots.php",
  method: "POST",
  data: {query: "Laptop"}
}).success(function(result) {
  $('.DivBody').html(result);
});

dots.php

$searchString = $_POST['query']; // This is "Laptop"
// Do your DB fetch...
// Return the result

You call the file dots.php via AJAX and pass in the string "Laptop" as query. Then that variable is reachable via $_POST['query']

Reference: http://api.jquery.com/jquery.ajax/

edited Jul 01 '15 at 06:45

answered Jul 01 '15 at 06:26

Gustaf Gunér

2,272
4
17
23

The `load()` method is using AJAX. – Boaz Jul 01 '15 at 06:26
Sure, his question was "Is there anyway that I can pass my Query to my dots.php without using .load()?". @LelioFaieta – Gustaf Gunér Jul 01 '15 at 06:29
2

@Gustaf The underlying question is about the loading speed. The OP probably would not see a performance gain by simply changing the jQuery interface to the `XMLHttpRequest` object. – Boaz Jul 01 '15 at 06:33
That's true, but an important part, is as mentioned and as I mentioned in my answer, the insecure aspect of the OP's code. But yes you're right. @Boaz – Gustaf Gunér Jul 01 '15 at 06:35
@Gustaf Sorry for being vague but my question is about the loading speed and how to solve it. – Rowel Jul 01 '15 at 06:44
@user3226156 Look at my answer, I gave you an example on how to approach that. You should also fix your insecure code! How many DB-rows are there? – Gustaf Gunér Jul 01 '15 at 06:44
@Gustaf 203 rows which means there are 203 dots for now. – Rowel Jul 01 '15 at 06:49
@user3226156 If there are 203 rows, maybe you should limit the amount of rows you query. As I said in my answer. Using SQL's `LIMIT` – Gustaf Gunér Jul 01 '15 at 07:01
@Gustaf I need all of them. – Rowel Jul 01 '15 at 07:04
Yeah, sure. But maybe you don't have to query them all at once. Use infinite scroll or something similar. Facebook doesn't fetch ALL recent posts, do they? That's for a reason. @user3226156 – Gustaf Gunér Jul 01 '15 at 07:19

How to transfer a query from JavaScript to a PHP file

1 Answers1