user3274505
user3274505

Reputation: 1

run php query in onchange event

I am newbie here and i having difficulty to construct the mysql query in the javascript. The idea is to run the mysql query when the dropdown value change.

Below are the code: html code

  <select name="cmbStatus" id="cmbStatus" onchange="check()">
            <option value="All" selected>All</option>
            <option value="New">New</option>
            <option value="In Progress">In Progress</option>
            <option value="Down">Down</option>
            <option value="Complete">Complete</option>
          </select>
            <label>
            <input type="text" name="textfield" id="textfield">
            </label

JS code

<script>
function check()
{
    document.getElementById("textfield").value = document.getElementById("cmbStatus").value;
}
</script>

PHP code

$query="SELECT * FROM incident_ticket where Status = 'cmbstatus.value' ";
$result=mysql_query($query);
$num=mysql_numrows($result);

Upvotes: 0

Views: 12275

Answers (6)

Jori
Jori

Reputation: 1152

The only way to do that is using AJAX (or similar, but with other data encapsulation methods, like JSON), which is a very broad topic. Too broad to be explained here in detail, but I will give an overview.

Basically AJAX (Asynchronous Javascript And XML) is a way of asynchronously requesting server information by using XML encoding. As the name suggest you will be using Javascript. The Javascript API in most browsers provide in this need with the XMLHttpRequest object (or ActiveXObject in older IE's). So lets create a new object:

ajax = new XMLHttpRequest();

This object provides a few methods and fields, but we will only discuss the most important ones: open(), send(), onreadystatechange, readyState, status and responseXML. To load a webpage (can be anything, but usually this is xml or generated xml from a php page, in your example we are reading nothing, but just requesting to trigger a PHP script) we use the open() method, like this (just an example):

ajax.open("GET", "some_php_file.php");

Now we have built a request we can send it:

ajax.send();

Done! This will most likely trigger your PHP script, but if we want to do it right, we should check for any errors by registering a (anonymous) status change function (the onreadystatechange field). This function will be triggered when the status of the request chances (e.x. from LOADING to DONE)

ajax.onreadystatechange = function()
{
  if (ajax.readyState != 4 || ajax.status != 200)
  {
    // Do some error handling, like displaying a user visible error message or something
    // The requested information is available as an XML object in the responseXML field
  }
}

readyState = 4 means that the file has been requested (state is DONE) and status is the HTTP response status code for success (200 OK).

You can also use the jQuery library, which simplifies this, but implements essentially the same process.

Hope this helps!

Upvotes: 1

Michal Artazov
Michal Artazov

Reputation: 4648

As already mentioned, problem is that PHP script runs on the server while JS runs "real-time" in the browser. You're goal can be acomplished quiet easily though.

The idea is that you'll bind the AJAX call to the onchange event. I recommend using jQuery for that.

JS

$('#cmbStatus').change(function() {
    $.post("script.php", { value: this.value });
    $('#textfield').val(this.value);
});

script.php

$query="SELECT * FROM incident_ticket where Status = '" . $_POST['value'] . "' ";
$result=mysql_query($query);
$num=mysql_numrows($result);

Replace script.php with the valid url of the script. I didn't test it so you'll maybe need to change something but I think you'll get the idea.

Upvotes: 0

Jite
Jite

Reputation: 5847

Php code runs on the server, while javascript (if not server-side javascript) runs on the client.
This means that you can not run php code directly in a javascript function on javascript events, cause its already ran on the server before the page is even loaded on the client.
What is usually used in cases like this, is called AJAX.

With ajax you send a request to a php script on the server (with the data that you wish to update), and in the php script you run the query.

There are a few different javascript libraries that makes sending requests like this easy, most people would probably recommend using jQuery, in which a simple ajax post request would look something like:

$.ajax({
  type: "POST",
  url: "thephpscript.php",
  data: data,
  success: function(){/*onsuccess*/}
});

But this would require you to load the jquery library before doing the request. Which is another question and for which i would recommend reading the jquery docs: http://www.jquery.com


Furthermore:
I would really recommend that you do NOT use the mysql_* functions in PHP either.
The mysql_* api is deprecated and will be removed in future versions of php.
The code you got in your example is also open for sql-injections, which is very bad.
Use mysqli or PDO instead, and either escape the data before using it in query or use prepared statements.

Upvotes: 3

krishna
krishna

Reputation: 4089

Use ajax to transfer value to a php file and execute query in that php file on changing the select value

$("#cmbStatus").onchange(function(e) {


jQuery.post("runquery.php", {

selcval:$("#cmbStatus").val()

},  function(data, textStatus){



});

});

in runquery.php execute the php code what you want to perform on change of select value like this

$query="SELECT * FROM incident_ticket where Status = '".$_POST['selcval']."' ";
$result=mysql_query($query);
$num=mysql_numrows($result);

Upvotes: 0

Akhil Sidharth
Akhil Sidharth

Reputation: 746

Use Ajax. you cant directly run MySQL from Javascript. What you can do is, on its on change, using ajax transfer it to a different PHP page, where you can run your SQL script

Upvotes: 0

Jignesh Patel
Jignesh Patel

Reputation: 1022

You need to use ajax to execute php code when user change dropdown value on html page.

Upvotes: 0

Related Questions