I have 2 pages called testing.php
and submission.php
. What I am looking to achieve is sending data from testing.php
to display that data in submission.php
. For example, if a user clicks on test1
they will get directed to submission.php
and I would like to display test1
on that page. Here is my code:
testing.php:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<div class="col-xs-3">
<ul id="choose">
<li class="nav"><a href="submission.php">test1</a></li>
<li class="nav"><a href="submission.php">test2</a></li>
<li class="nav"><a href="submission.php">test3</a></li>
<li class="nav"><a href="submission.php">test4</a></li>
<li class="nav"><a href="submission.php">test5</a></li>
<li class="nav"><a href="submission.php">test6</a></li>
</ul>
</div>
<script>
$(document).ready(function() {
$("#choose").on('click', '.nav', function() {
$.post("submission.php", { data: $(this).text() }, alert($(this).text()));
});
});
</script>
</body>
submission.php:
<?php
$subcat = $_POST['data'];
echo $subcat;
?>
At the moment submission.php is showing below error;
Notice: Undefined index: data in C:\\xampp\\htdocs\\series\\dynamics\\admin\\CleanURL\\submission.php on line 2
Thanks in advance for looking into it, please suggest how could I get around this problem!
This is what is happening:
$_POST
is empty because you are making a regular GET request by following a link.
First, be unobtrusive .
Replace the link with a form (alternatively design the system to use GET
requests, it depends on what the system is doing ). Put a hidden input in it to set the value of data
.
Then, to make it Ajaxy:
You also need to pass a function as the third argument to $.post
.
Such:
$("#choose").on('submit','form', function(event){
event.preventDefault();
$.post(
"submission.php",
{data: this.form.data.value},
function (response) { alert(response); }
);
});
Easiest to achieve this is using GET and requires no javascript.
<ul id="choose">
<li class="nav"><a href="submission.php?data=test1">test1</a></li>
<li class="nav"><a href="submission.php?data=test2">test2</a></li>
<li class="nav"><a href="submission.php?data=test3">test3</a></li>
<li class="nav"><a href="submission.php?data=test4">test4</a></li>
<li class="nav"><a href="submission.php?data=test5">test5</a></li>
<li class="nav"><a href="submission.php?data=test6">test6</a></li>
</ul>
Your submission.php.
<?php
$subcat = $_GET['data'];
echo $subcat;
?>
However if you really want/need to use POST then it's a bit more code and requires javascript. First wrap your ul in form and add radio inputs to each item and hide them:
<form action="submission.php" method="post">
<ul id="choose">
<li class="nav"><input type="radio" name="data" value="test1" style="display: none" /><a href="#">test1</a></li>
<li class="nav"><input type="radio" name="data" value="test2" style="display: none" /><a href="#">test2</a></li>
<li class="nav"><input type="radio" name="data" value="test3" style="display: none" /><a href="#">test3</a></li>
<li class="nav"><input type="radio" name="data" value="test4" style="display: none" /><a href="#">test4</a></li>
<li class="nav"><input type="radio" name="data" value="test5" style="display: none" /><a href="#">test5</a></li>
<li class="nav"><input type="radio" name="data" value="test6" style="display: none" /><a href="#">test6</a></li>
</ul>
</form>
When you click on a link, use javascript to make the proper radio input checked and submit the form.
$("#choose").on('click', '.nav', function() {
$(this).find('input').prop('checked', true);
$('form').submit();
});
Then you can use your submission.php code.
<?php
$subcat = $_POST['data'];
echo $subcat;
?>
With Form
<form action="submission.php" method="post">
Name: <input type="text" name="name"><br>
<input type="submit">
</form>
With AJAX
var data = (this).text();
$.ajax({
method: "POST",
url: "submission.php",
data: { li_selected: data}
})
.done(function( msg ) {
alert( "Response: " + msg );
});
I think that you want to use ajax ones.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.