how to pass a jquery variable to php and then display it

Question

Problem in passing Jquery variable to php .

When i pass variable id to B.php i am getting this error

"Notice: Undefined index: id1 in C:\xampp  \htdocs\PhpProject1\OtherUsableItems\B.php on line 2

How to solve this problem ???? This A.php

<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
  var id = 23; 
$("#submit").click(function(){
 $.post("B.php",
 {
     id1: id,

  } );      
   });
  });
 </script>
 </head>
 <body>
 <form action="B.php" method="post" >
 <input type="submit" id="submit" name="submit"/> 
 </form>
 </body>
 </html>

This B.php

  <?php
   $a =$_POST['id1'];
   echo $a ;
   ?>

I want id variable to pass on to B.php

you already go to B.php after submit,so why not making hidden input field with value you want to send and then read it on B.php? — Bojan Kovacevic, Apr 05 '13 at 11:43
You are getting error `C:\xampp \htdocs\PhpProject1`. try using `http://localhost` — Jai, Apr 05 '13 at 11:52

score 6 · Accepted Answer · answered Apr 05 '13 at 11:48

Try this one:

<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
  var id = 23; 
$("#submit").click(function(){
 $.ajax(
    {
    url: "B.php",
    type: "POST",

    data: { id1: id},
    success: function (result) {
            alert('success');

    }
});     
   });
  });
 </script>
 </head>
 <body>
 <form  >
 <input type="button" id="submit" name="submit"/> 
 </form>
 </body>
 </html>

Then B.php

<?php
   $a =isset($_POST['id1'])?$_POST['id1']:'not yet';
   echo $a ;
   ?>

score 1 · Answer 2 · answered Apr 05 '13 at 11:44

1

Try changing the input type to button instead of submit <input type="button" id="submit" name="submit"/>

answered Apr 05 '13 at 11:44

Nisanth Sojan

1,099
8
21

score 1 · Answer 3 · edited Nov 15 '13 at 17:05

1

The problem is that your form is submited ,$.post is for ajax sumit. For that you need to prevent form submit.

<script>
     $(document).ready(function(){
        var id = 23; 
        $("#submit").click(function(){
           $.post("B.php",
           {
              id1: id,

           });  
           event.preventDefault() ;
        });    
    });
</script>

Add event.preventDefault(); in your button click function

edited Nov 15 '13 at 17:05

Lodder

19,758
10
59
100

answered Apr 05 '13 at 11:48

Shijin TR

7,516
10
55
122

By adding e.preventDefault(); Error has been resolved but after submitting it should go to B.php and echo value of variable a – Abhishek Apr 05 '13 at 11:58
Then,You need to remove ajax,$.post is used for ajax submit.that will not redirect to B.php.That create xmlhttp request – Shijin TR Apr 05 '13 at 12:11

Viktor S. · Answer 4 · 2013-04-05T12:01:15.423

$(document).ready(function(){
  var id = 23; 
  $("#submit").click(function(e){
     $.post("B.php", {id1: id} );     
     e.preventDefault();
   });
 });

Try code above. First: JS does not allow to do something like this: {id1: id,} (see comma at the end). That is a feature of PHP. Actually, your JS code should not be executed at all because that is a syntax error (suppose you will find it in console of your browser)

Another problem: you must prevent default submit of a form. e.preventDefault() is needed for that. Without it, ajax post will be started and than usual form submit will happen. And your form has no element with name id1, suppose that second request produce that error message.

EDIT: This is to post a value with regular submit, so browser is redirected to B.php

$(document).ready(function(){
      var id = 23; 
      $("#submit").click(function(){
              $(this).closest("form")
                     .append($("<input>", {"type":"hidden", "name":"id1", "value":id}));
       });
     });

By adding e.preventDefault(); Error has been resolved but after submitting it should go to B.php and echo value of variable a — Abhishek, Apr 05 '13 at 11:57
See updated answer. There I simply find a form, put a new hidden field into it with a value. — Viktor S., Apr 05 '13 at 12:02

score 0 · Answer 5 · edited Jun 20 '20 at 09:12

0

Try this:

<script>
$(document).ready(function(){
   var id = 23; 
   $("#submit").click(function(e){
     e.preventDefault();
     $.post("B.php", {id1: id}, function(data){ //<---get the data from B.php
        console.log(data);   //<--------show it here
        alert(data);
     });      
   });
  });
 </script>

Since you are using ajax feature so you have to stop the form submit feature. You have a trailing comma here {id1 : id,} this is an issue in IE browsers but latest other browsers will just work fine.

Note:

You posted this error:

"Notice: Undefined index: id1 in C:\xampp \htdocs......

Don't run the page in filesystem $.post() won't work this way.

Instead try using http://localhost/yourapplication/page.php

edited Jun 20 '20 at 09:12

Community

1
1

answered Apr 05 '13 at 11:44

Jai

74,255
12
74
103

By adding e.preventDefault(); Error has been resolved but after submitting it should go to B.php and echo value of variable a – Abhishek Apr 05 '13 at 11:56
Are you checking this on localhost – Jai Apr 05 '13 at 11:57
Error shows a path to file on disc in any case. If OP were trying to run his script from `file://..../page.php`, there would be no error at all as PHP would not be executed at all. – Viktor S. Apr 05 '13 at 12:08
@Abhishek I think you have to use callback function now. see the answer. – Jai Apr 05 '13 at 12:13

score 0 · Answer 6 · answered Apr 05 '13 at 11:49

0

Use a hidden field to set the value you want to send across. Since you are using submit, your entire form is submitted. The hidden field is also sent and this can be accessed directly using the name of the hidden field.

answered Apr 05 '13 at 11:49

Aashray

2,753
16
22

Then what is the use of jquery in this question? – Shijin TR Apr 05 '13 at 11:50
1

He doesn't need the jquery then. He can just send it across with out worrying about how to send it. – Aashray Apr 05 '13 at 11:51

score 0 · Answer 7 · answered Apr 05 '13 at 11:50

An E_NOTICE is thrown by php because the index of the POST-Array doesnt exist. You can switch error_reporting of for notices, see http://www.php.net/manual/de/errorfunc.configuration.php#ini.error-reporting or check if the index exists:

if( isset($_POST['id1']) )  {
// do something
}

score 0 · Answer 8 · answered Apr 05 '13 at 12:08

Try this code,

 <html>
 <head>
 <script src="jquery.js"></script>
 <script>
 $(document).ready(function(){
 var id = 23; 
 $("#submit").click(function(){
 $('#id1').val(id);
 });
 });
</script>
 </head>
 <body>
 <form action="B.php" method="post" >
 <input type="submit" id="submit" name="submit"/> 
 <input type="hidden" name="id1" id="id1" value=""/>
</form>
</body>
</html>

Here you can pass value of 'id' to B.php,And will be access as $_POST['id1']

Zhama · Answer 9 · 2013-04-05T13:15:14.787

Or you could use submit() this way

$(function(){
    var id = 23;
    $("#myform").submit(function() {
        $.post("B.php", { id1: id }).done(function(data) {
            alert( data );
        });
        return false; //true(post form data)
    });
});

And form

<form id="myform" method="post">
<input type="submit" id="submit" name="submit" />
</form>

EDIT: Oh and yeah for B.php isset check or error_reporting(0);

if(isset($_POST['id1'])){
    print_r( $_POST );
}

how to pass a jquery variable to php and then display it

9 Answers9

Note:

Linked