Rob
Rob

Reputation: 149

Using javascript function and variables in combination with PHP and MYSQL

On my page I have a search result that contains a list with users where each is followed by an "addfriend" button. Each row contains a username and userID. Meanwhile the ID of the user that requested the searchresult is stored in a Session variable.

When the addfriend-botton is clicked the following 2 things should happen:

  1. Store the userID and $_SESSION['userID'] is a MySQL table which describes the relationship.
  2. Do NOT refresh the page (this the core of my problem) but stay focussed and change the state of the button to e.g. "friend request send". I'm thinking of GetElementByID().style method.

I was thinking of this:

<a href="#" onClick="addFriend('<? echo $_SESSION['userID'];?>','<? echo $rij['userID']; ?>')">

which calls the javascript function addfriend

I was hoping to catch the two ID's like this:

<script>
function addfriend(id1, id2)
{
    //server side php code where I use value of 
    //the client-side javascript variables: +id1+ and +id2+ .
}
</script>

Is this at all possible or I'm I thinking the wrong way? Any suggetions on how to accomplish this?

Upvotes: 0

Views: 223

Answers (3)

Rac
Rac

Reputation: 61

You are in the right way, inside your addFriend() function, you can call one php file (via AJAX) and send the IDS without refresh the page. I think better you work with Jquery in this case, something like this:

<script>
function addfriend(id1, id2)
{
   $.ajax({
        type: 'POST',
        url: 'yourPHPfile.php',
        data: { your_id_1:id1, your_id_2:id2 },
        success: function(data){
                    if(data){
                       alert('Done!');
                    }
        },
        dataType: 'text'
    });
}
</script>

And in your PHP File you can do this:

<?php
    //receive Ids
    $id1 = $_POST['your_id_1'];
    $id2 = $_POST['your_id_2'];

    //do something here

    echo "OK!";
<?

to do this work you need download and add the jQuery plugin in your page, rather into head tag

<head>
     <script type="text/javascript" src="jquery.js"></script>          
</head>

Good work and don't give up! (:

Upvotes: 2

user428517
user428517

Reputation: 4193

You can do this using AJAX (asynchronous JavaScript and XML), which is really just a fancy term for "sending stuff to a server with JavaScript and getting a response back, without reloading the page". There's nothing special about AJAX; it just involves using plain old JavaScript to send an HTTP request.

Check out jQuery, a JavaScript library that handles most of the technical stuff for you. Specifically, look at its post() function, which allows you to send data to a PHP script using the $_POST system variable. There are lots of clear examples on that page.

Note that you don't need jQuery to use AJAX; jQuery is just a library that makes things easier. If you really want to learn how the JavaScript side of AJAX works, try following one of the many tutorials out there, such as Mozilla's or this one.

Upvotes: 1

Travesty3
Travesty3

Reputation: 14469

AJAX is the answer you're looking for.

It sounds like you already have a basic understanding of this, but to clarify, Javascript executes on the client side, and PHP executes on the server side. So you would have to make a call back to your server in order to interact with PHP/MySQL.

The purpose of AJAX is to do this without requiring a page refresh.

Upvotes: -1

Related Questions