CODEWITHSUNDEEP
phpjquery
ticktock
ticktock

Reputation: 151

How do I pass value from Jquery to PHP ? HTML is a hidden input form field

I have a form:

<form action="post.php" method="POST">
 <p class="select1">Northern Cape</p>
 <p class="select1">Eastern Cape</p>

 <p class="select2" >New Goods</p>
 <p class="select2" >Used Goods</p>

<input id="submt" type="submit" name="submit" value="Submit">
</form>

JQUERY .... appends input/value to the selected items:

$(document).ready(function() {
    $('.select1').click(function() {    
      if ($(this).text() == "Northern Cape"){
          $(this).append("<input id='firstloc' type='hidden' name='province' 
          value='Northern Cape' />");
          $("#firstloc").val('Northern Cape');
     }; // end of if statement

      if ($(this).text() == "Eastern Cape"){
          $(this).append("<input id='firstloc' type='hidden' name='province' 
          value='Eastern Cape' />");
          $("#firstloc").val('Eastern Cape');
     }; // end of if statement
}); // end of click function
}); // end of document ready

 $(document).ready(function() {
    $('.select2').click(function() {
        if ($(this).text() == "New Goods"){
            $(this).append("<input id='category' type='hidden' name='cat' 
            value='New Goods' />");
            $(this).val('New Goods');
         };

        if ($(this).text() == "Used Goods"){
            $(this).append("<input id='category' type='hidden' name='cat' 
            value='Used Goods' />");
            $("#category").val('Used Goods');
         };

});
});

How do I pass the values to PHP ie. first value Province second value Category?

<?php

$province = $_POST['province'];
$category = $_POST['cat'];
echo $province;
echo $category;
?>

I get a message Undefined index:cat when passing to PHP. User must select 2 items and values must be passed to PHP,I do not want to use a drop down menu with "options"

Upvotes: 2

Views: 69

Answers (2)

Nirav Joshi
Nirav Joshi

Reputation: 2950

Here is the solution.

You made a several mistakes in your code.

  • You are using ; after if statement
  • You didnot close $document.ready tag properly
  • You have to check in your post.php if data posted or not
  • And you only appends input type hidden you weren't remove it.

post.php

<?php
$province = '';
$category = '';
if(isset($_POST['province'])):
    $province = $_POST['province'];
endif;
if(isset($_POST['cat'])):
    $category = $_POST['cat'];
endif;
echo $province;
echo $category;
?>


$(document).ready(function() {
    $('.select1').click(function() {    
    if ($(this).text() == "Northern Cape"){
      $("#firstloc").remove();	
      $(this).append("<input id='firstloc' type='hidden' name='province' value='Northern Cape' />");
    } // end of if statement

    if ($(this).text() == "Eastern Cape"){
      $("#firstloc").remove();	
      $(this).append("<input id='firstloc' type='hidden' name='province' value='Eastern Cape' />");
    } // end of if statement
  });
  $('.select2').click(function() {
    if ($(this).text() == "New Goods"){
      $("#category").remove();
      $(this).append("<input id='category' type='hidden' name='cat' value='New Goods' />");
    }
    if ($(this).text() == "Used Goods"){
      $("#category").remove();
      $(this).append("<input id='category' type='hidden' name='cat' value='Used Goods' />");
    }
  }); // end of click function
}); // end of document ready
        
    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<form action="post.php" method="POST">
   <p class="select1">Northern Cape</p>
   <p class="select1">Eastern Cape</p>
   <p class="select2" >New Goods</p>
   <p class="select2" >Used Goods</p>
   <input id="submt" type="submit" name="submit" value="Submit">
</form>
</html>

Try this code hope it will helps you.

Upvotes: 2

Alexander Higgins
Alexander Higgins

Reputation: 6923

PHP does not set $_POST for all post operations, for example for text/xml:

Try adding adding application/x-www-form-urlencoded or multipart/form-data to your form just to make sure.

<form action="post.php" method="POST" enctype="multipart/form-data">

Also make sure you don't have broken HTML that is causing your form tag to be close prematurely. Verify what is getting posted and the content type using web developer tools.

You should also be using isset to check the existence of a variable:

if (isset($_POST["cat"])) {
    $cat = $_POST["cat"];
    echo $cat;
    echo " is the category";
} 
else 
{
    $cat = null;
    echo "no category supplied";
}

Upvotes: 1

Related Questions