Passing two variables from php to ajax using dropdown

Question

How can I pass the two values (filter & $user_id) to Ajax?

PHP:

$user_id = 3; 
echo "<select name=\"filter\" data-userid=\"".$user_id."\"
onchange=\"getPoints(this.value)\">
<option value=\"one\">One</option>
<option value=\"two\">Two</option>
</select>";

AJAX:

function getPoints(filter)
{
    var userid = $(this).attr('data-userid');

$.ajax({
type: "GET",
url: 'http://website.com?user_id='+userid,
data: '&action='+filter,
success: function(result){
$("#Target").html(result);
}
});
};

I want to get this url:

http://website.com?user_id=3&action=one

I have the problem with passing $user_id to Ajax. Thank you in advance.

give an id to select control and try to append <option>value<option> dynamically by jaquery,ajax — Itz Raghu
– Itz Raghu, Commented Jan 8, 2016 at 7:49

urfusion · Accepted Answer · 2016-01-08 11:24:03Z

2

your code should be like

function getPoints(filter)
{
    var userid = $(this).attr('data-userid');

    $.ajax({
        type: "GET",
        url: 'http://website.com',
        data: {action: filter, user_id: user_id},
        success: function (result) {
            $("#Target").html(result);
        }
    });
}

Or if I talk about your way then it should be

function getPoints(filter)
{
    var userid = $(this).attr('data-userid');

    $.ajax({
        type: "GET",
        url: 'http://website.com?user_id='+userid+'&action='+filter,
        success: function (result) {
            $("#Target").html(result);
        }
    });
}

It is always better to use data: {action: filter, user_id: user_id} because it will treated like object itself.

EDIT JS

 function getPoints(filter)
    {
        var user_id = document.getElementById('test_class').getAttribute('data-userid');
        console.log(user_id);
        $.ajax({
            type: "GET",
            url: 'http://website.com',
            data: {action: filter, user_id: user_id},
            success: function (result) {
                $("#Target").html(result);
            }
        });
    }

PHP

$user_id = 3; 
echo "<select id='test_class' name=\"filter\" data-userid=\"".$user_id."\"
onchange=\"getPoints(this.value)\">
<option value=\"one\">One</option>
<option value=\"two\">Two</option>
</select>";

edited Jan 8, 2016 at 11:24

answered Jan 8, 2016 at 7:48

urfusion

5,4995 gold badges56 silver badges91 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Shamss Zaidan Over a year ago

The problem with (var userid = $(this).attr('data-userid');) He returns undefined

Shamss Zaidan Over a year ago

I need to use function getPoints(filter). The name of the function is important for my project. Your first solution did not work. The problem is with returning the userid

Nacho Moço · Accepted Answer · 2016-01-08 07:55:29Z

0

Try something like this

function getPoints(filter){
  var userid = $(this).data('userid');

  $.ajax({
  type: "GET",
  url: 'http://website.com?user_id='+userid,
  data: { action:filter, user_id: userid},
  success: function(result){
   $("#Target").html(result);
  }
 });
};

answered Jan 8, 2016 at 7:55

Nacho Moço

4573 silver badges7 bronze badges

2 Comments

Shamss Zaidan Over a year ago

The problem with (var userid = $(this).attr('data-userid');) He returns undefined.

Shamss Zaidan Over a year ago

I use alert('userid: ' + userid); and het returns userid: undefined.

Collectives™ on Stack Overflow

Passing two variables from php to ajax using dropdown

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related