How to send or assign Jquery Variable value to php variable?

Question

I wanted to get a img src to php variable when a user clicks it so i used jquery function to get img src when user clicks that image.Below jquery is for fetching img src

$("img").click(function() {
    var ipath = $(this).attr('src');
})

now i tried something like this to get the ipath value to php variable

$.ajax({ type:'POST', url: 'sample.php',
 dataType: 'HTML', data: dataString,
 success: function(data)
{
 } 
});
});

I'm not sure about using Ajax correctly can anyone help with Ajax function to get this done? Thank you.

no errors..i don't know to get this value to a php vaiable in sample.php — sun, May 28 '13 at 06:14

Robert · Accepted Answer · 2013-05-28T06:37:14.150

4

You should make ajax call when img is clicked for example:

$(function (){
   $("#myimg").click(function() {
      $.ajax({
        type: "POST",
        url: "some.php",
        data: { param: $(this).attr('src'); }
      }).done(function( msg ) {
             alert( "Data Saved: " + msg );
     });
  });
}

html code

<img src="http://yourimage.jpg" alt="image" id="myimg" />

in some.php use

 echo $_POST['param'];

to get value and if you used type:GET you should use then $_GET to obtain value.

edited May 28 '13 at 06:37

answered May 28 '13 at 06:11

Robert

19,800
5
55
85

Should i use form action and method before this script? – sun May 28 '13 at 06:32
1

you don't have to because there is no form submitted only click action :) I've edited with html code. When you use #myimg it affects only item where id="myimg" if you used on $("img") it will affect every image you click. – Robert May 28 '13 at 06:35
I'm working with $(Img) alone.after clicking it when i check sample.php file its showing error Error suppression ignored for Notice: Undefined index: param – sun May 28 '13 at 07:37
because you just call it as some.php without GET params if you called it `some.php?param=asdfasdf` there will be no notice. If you use $_POST then don't open some.php just see what message is alerted in js. Your ajax request if there are no errors in javascript will work with no problem. These are basics really. Also `$(Img)` is incorrect it should be `$('img')` – Robert May 28 '13 at 08:16
Thanks Robert.its saying Data Saved, now how can i access Saved Data in sample.php – sun May 28 '13 at 08:33
if you put in sample.php `echo $_POST['param']` it should say `data saved your_attr_src_here` there are other options too read about json datatype and `json_encode()` php function – Robert May 28 '13 at 10:00
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/30746/discussion-between-raj-and-robert) – sun May 28 '13 at 10:30

score 3 · Answer 2 · answered May 28 '13 at 06:13

please try this. hope it will help.

$("img").click(function() {
   var imgSrc = $(this).attr('src');

    jQuery.ajax({
            type: 'post',                    
            url:'somepage.php',            
            data:{"imgSrc" : imgSrc},
            dataType:'json',                
            success: function(rs)
            {
                alert("success");
            }
        });  
});

try to fetch "imgSrc" on "somepage.php" as "$_post["imgSrc"].

score 1 · Answer 3 · answered May 28 '13 at 06:10

1

As written here you should do it as follows:

$.ajax({
    type : 'POST',
    url : 'sample.php',
    dataType : 'HTML',
    data : {
        param : 'value'
    },
    success : function(data) {
    }
});
});

and then in php your variable will be in $_POST['param']

answered May 28 '13 at 06:10

k102

7,861
7
49
69

success call back function is working,but in sample.php i get error **Notice: Undefined index: param** – sun May 28 '13 at 08:08
Use firebug+firephp to debug this – k102 May 28 '13 at 10:12

score 1 · Answer 4 · edited Apr 25 '18 at 12:35

1

$("img").click(function() {
    var ipath = $(this).attr('src');
    $.ajax({ type:'POST', url: 'sample.php',
        dataType: 'HTML',
        data : {
            path: ipath 
        },
        success: function(data)
        {

        } 
    });//end of ajax

})//end of click

You can get this value in php script as $_POST['path']

edited Apr 25 '18 at 12:35

Priyanka Maurya

385
1
10

answered May 28 '13 at 06:14

Dr. Dan

2,288
16
19

score 1 · Answer 5 · answered May 28 '13 at 06:19

1

this should help

$("img").click(function() {
    jQuery.post("some.php",{param:$(this).attr('src')},function(data){
      console.log(data);
    },'html');
});

in some.php

do a print_r($_POST); to understand how to pull the needed information/data

answered May 28 '13 at 06:19

Lewis E

327
1
7

this displays array() – sun May 28 '13 at 06:49
you possibly used print rather then print_r you should have receive something around these lines. Array ( [param] => http://api.jqueryui.com/jquery-wp-content/themes/jquery/images/logo-jquery-ui.png ) – Lewis E May 28 '13 at 07:01

score 1 · Answer 6 · answered May 28 '13 at 06:24

try like this -

$('document').ready(function(){
    $("img").click(function() {
        var ipath = $(this).attr('src');

        var dataString = 'imagePath='+ipath;
        var sendRquest = $.ajax({
            type: 'POST',
            url: 'action.php',
            data: dataString
        });

        sendRquest.done(function(responseData) {
            // your code here
            alert(responseData);
        });

        sendRquest.fail(function(xmlhttprequest,textstatus,responseData) {
            // your code here
            alert('failed');
        });

        sendRquest.always(function(){
            // your code here
            alert('done');  
        });

    });

    $("img").click(function() {
        var ipath = $(this).attr('src');
        $('#divid').load('action.php?imagePath='+ipath);

        //if trigger required
        $('#divid').load('action.php?imagePath='+ipath, function() {
          alert('Load was performed.');
        });
    });
});

in action.php

<?php
   echo $_POST['imagePath'];
   // if you are using load function then
   echo $_GET['imagePath'];
?>

first see what you are sending. try alert(ipath); before sending to ajax — HADI, May 28 '13 at 06:49

webGautam · Answer 7 · 2013-05-28T10:26:12.157

1

Ajax Function

<script type="text/javascript">
$(function (){
    $("#img").click(function() {
    var src = $(this).attr('src');
    //OR// var src = $("#img").attr('src');
          $.ajax({
            type: "GET",
            url: "myfile.php",
            data: {imgsrc: src}
          }).done(function(data) {
                 alert(data);
         });
      });
});
</script>

myfile.php

<?php
echo $_GET['imgsrc']; exit;
?>

edited May 28 '13 at 10:26

answered May 28 '13 at 07:32

webGautam

555
1
3
14

Getting error in sample.php **Notice: Undefined index: imgsrc** – sun May 28 '13 at 08:11
seems like you have not changed ajax function properly! i recommend you to copy and paste and plsease notice that page name is myfile.php not sample.php! try this and if still it doesnot work let me know i will try my best to fix it! @raj – webGautam May 28 '13 at 08:17
In the url i gave sample.php only, even though it showing error in sample.php – sun May 28 '13 at 08:21
@raj I have just copy past my working script and this is absolutly functioning! at first i also get same error message later on i found my mistake i was get imgsrc in POST instead of GET in php file! Please check your method type(GET/POST) and url. :) – webGautam May 28 '13 at 10:28
am getting imgsrc when i click the image but not in sample.php file – sun May 28 '13 at 10:54

How to send or assign Jquery Variable value to php variable?

7 Answers7

Linked