im trying to pass on the id attribute to the file.php, but its giving me 0 every time, when i try to insert it into the database, the javascript and the html is provided!
$(function() {
$(".follow").click(function(){
var element = $(this);
var I = element.attr("id");
var info = 'id=' + I;
$.ajax({
type: "POST",
url: "file.php",
data: info,
success: function(){}
});
$("#follow"+I).hide();
$("#remove"+I).show();
return false;
});
});
html file:
<div id="follow1"><span class="follow_b"> Follow </span></div>
p.s. it deos insert the value in the database
file.php:
<?php
$id =$_POST['id'];
msql_insert.........
?>
It may not matter in this case, but the ID of an element is not supposed to start with a number.
Related
Simply i want to pass Numeric id to Php page and Using $_POST['id'] i want use it, But Getting Undefined error. check screen shot https://imgur.com/a/M1v4mEX and check code below
===>edit.php
$('#update').click(function(){
var serialData = new FormData($("#regForm")[0]),
s = location.search.split('='),
searchId = s[s.length-1];
console.log(serialData);
console.log(searchId);
serialData.append('id',9);
$.ajax({
method:'POST',
url:'update.php',
dataType:'json',
data: {id:9},
success:function(jsonObj){
console.log(jsonObj);
}
});
});
==>update.php
<?php
if(isset($_POST['submit'])){
var_dump($_POST['id']);
exit();
}
?>
You forgot to change the id value to send in parameter to the dynamic value from the location.search
Also think about adding e.preventDefault(); because you work on form submission.
I think that serialData can be removed cause it doesn't have affect the current code logic
Here is the working script
<script>
$('#update').click(function(e) {
e.preventDefault();
var s = location.search.split('=');
var searchId = s[s.length-1];
// Verify the current ID passed on search parameter
console.log(searchId);
$.ajax({
method:'POST',
url:'update.php',
dataType:'json',
data: { 'id': searchId },
success:function(jsonObj){
console.log(jsonObj);
}
});
});
</script>
I have a x number of links on my website like this:
www.link1.com
www.link2.com
www.link3.com
On the bottom I have a little Javascript that is supposed to do something with the value of the clicked link.
$('#UseLink').click(function(e){
var url = "www.domain.com/uselink";
$.ajax({
type: "POST",
url: url,
data: {'linkid' : this.getAttribute('value')},
success: function(data)
{
console.log("Use link result: " + data);
if (data === 'success') {
}
if (data === 'error') {
}
}
});
e.preventDefault();
});
No matter what link I click, it always uses the id of link1. Anyone knows why this is not working?
Id's have to be unique. So do following changes:
www.link1.com
www.link2.com
www.link3.com
JS:
$('.UseLink').click(function(){
var id = $(this).attr('id');
// id contains the id of clicked anchor
});
ID must be unique, you have assigned same IDs to all the a tags.
That is why jquery script is hitting the first element.
var value = $( this ).val();
use this above the ajax call and pass the value data
There probably are plenty of methods to do this with pure javascript but since it has the PHP tag I will give you an answer involving php.
<?php
$id = isset($_GET['id']) ? $_GET['id'] : false;
?>
<script type="text/javascript">
var id = '<?= false !== $id ? $id : ""; ?>';
$('#UseLink').click(function(e){
var url = "www.domain.com/uselink";
$.ajax({
type: "POST",
url: url,
data: {'linkid' : id},
success: function(data)
{
console.log("Use link result: " + data);
if (data === 'success') {
}
if (data === 'error') {
}
}
});
e.preventDefault();
});
</script>
The links to trigger this code:
Link 1
Link 1
Link 1
First you need to know the difference between id and class. Id must be unique throughout the page. You can visit this link https://css-tricks.com/the-difference-between-id-and-class/ to learn the id and class.
And according to your problem, if you change id to class, I think it will go good.
Thanks.
Problem
After a successful AJAX call, I want to update an element on page. However, it is not being updated.
Code [Javascript]
$(function()
{
$(".upvote").click(function()
{
var id = $(this).parent().find("input").val();
$.ajax(
{
type: "GET",
url: "process.php",
data: "id=" + id +"&f=u",
success: function(results)
{
$(this).parent().parent().find("span.ups").empty().append("Upvotes: " + results);
console.log(results);
}
});
return false;
});
});
Code [HTML]
This code is being generated by PHP.
<div class="post">
<h2>$title</h2>
<p>$body</p>
<span class="ups">Upvotes: $upvotes</span>
<span class="downs">Downvotes: $downvotes</span>
<span class="total">Total votes: $t_votes</span>
<div id="links">
<input type="hidden" id="id" name="id" value="$id">
<button>Upvote!</button>
<button>Downvote!</button>
</div>
</div>
Returned by PHP
The updated number of upvotes.
this is not what you think it is. Its value is determined by how the function it appears in is called (and will change when inside a different function).
I've no idea what it will be in a jQuery success callback, but it won't be an HTML element.
If you want it to be the clicked upon element, then you need to store it while this is that element.
$(".upvote").click(function() {
var clicked_element = this;
Then you can use that variable later on:
$(clicked_element).parent().etc
You cannot use this keyword like that.
var that = null;
$(function()
{
$(".upvote").click(function()
{
var id = $(this).parent().find("input").val();
that = $(this);
$.ajax(
{
type: "GET",
url: "process.php",
data: "id=" + id +"&f=u",
success: function(results)
{
that.parent().parent().find("span.ups").empty().append("Upvotes: " + results);
console.log(results);
}
});
return false;
});
});
I didn't test this, but it should work.
Cheers.
$(this) inside the success callback is not the element you might think it is. It would probably be better to cache the parent object instead and traverse from there:
var $post = $('.post');
//... $.ajax etc
success: function() {
$post.find('.ups').etc //...
I have this script here that outputs a result from a sql db query but I can not figure out how to get it to put the result in the table cell specified.
Here is query:
<script type="text/javascript">
$(document).ready(function(){
$('.typeval').change(function(){
var movement = $(this).val();
var client_id = $(this).parent().siblings().find('.clientval').val();
var class_id = <? echo $class_id; ?>;
$.ajax({
type: "POST",
url: "movement_count.php",
data: {movement:movement, client_id:client_id, class_id:class_id},
dataType: "json",
success:(function(output) {
$.each(output, function(index, value){
alert(value);
$(".count").append(output[value]);
}) // each
}) // success
}); // ajax
}); // .typeval
}); // document
</script>
I want to put the result of this (value):
alert(value);
into here:
<td><label class="count"></label></td>
The <td> I am targeting on the same row as the <select> menu that is triggering the result. There will also be multiple table rows with this exact same cell <td>. So I need to target the <td> on this row only somehow. Can someone help me with this? Im not sure if I need the $.each but my php query is a mysql_fetch_row array even though the value returned will always be just one number.
Here is the HTML markup for the table cell I need the value in:
<td><label class="count"></label></td>
JS source code for class=count:
$(".count").append(output[index]);
ITS WORKING!!!! here is the code below
$(document).ready(function(){
$('.typeval').change(function(){
var movement = $(this).val();
var client_id = $(this).parent().siblings().find('.clientval').val();
var class_id = <? echo $class_id; ?>;
$count = $(this).parents('tr').find('label.count');
$.ajax({
type: "POST",
url: "movement_count.php",
data: {movement:movement, client_id:client_id, class_id:class_id},
dataType: "json",
success:(function(output) {
$.each(output, function(index, value){
//alert(value);
$count.append(output[index]);
}) // each
}) // success
}); // ajax
}); // .typeval
}); // document
Replace this
$("label.count<?php echo $client_id; ?>").append(output[value]);
With
$("label.count<?php echo $client_id; ?>").append(value);
Or alternately with this
$("label.count<?php echo $client_id; ?>").append(output[index]);
Hope this will help !!
Working code:
$(document).ready(function(){
$('.typeval').change(function(){
var movement = $(this).val();
var client_id = $(this).parent().siblings().find('.clientval').val();
var class_id = <? echo $class_id; ?>;
$count = $(this).parents('tr').find('label.count');
$.ajax({
type: "POST",
url: "movement_count.php",
data: {movement:movement, client_id:client_id, class_id:class_id},
dataType: "json",
success:(function(output) {
$.each(output, function(index, value){
//alert(value);
$count.append(output[index]);
}) // each
}) // success
}); // ajax
}); // .typeval
}); // document
I would like to select streamitem_id from my insert.php and add it to my existing post div. I'm needing the id of the post made so I can add it into my div so later when I add my delete button it will delete the post and the div that holds it. Hope I've made sense and I can do this with what I have as I'm trying to learn but it is a difficult language like any when first starting out.
AJAX
<script>
$(document).ready(function(){
$("form#myform").submit(function(event) {
event.preventDefault();
var content = $("#toid").val();
var newmsg = $("#newmsg").val();
$.ajax({
type: "POST",
url: "insert.php",
data: "toid=" + content + "&newmsg=" + newmsg,
success: function(){
$("#homestatusid").prepend("<div id='divider-"+WHERE MY STREAMITEM_ID NEEDS TO BE+"'><div class='userinfo'>"+newmsg+"</div></div>");
}
});
});
});
</script>
INSERT.PHP
$check = "SELECT streamitem_id FROM streamdata WHERE streamitem_id=$user1_id";
$check1 = mysql_query($check);
$check2 = mysql_num_rows($check1);
echo $check2;
In your javascript should be
$.ajax({
type: "POST",
url: "insert.php",
data: {toid:content, newmsg: newmsg}, # pay attention to this line
success: function(data){
$("#homestatusid").prepend("<div id='divider-"+data+"'><div class='userinfo'>"+newmsg+"</div></div>");
}
});
PHP
$toid = isset($_POST['toid']) ? $_POST['toid'] : null;
$newmsg = isset($_POST['newmsg']) ? $_POST['newmsg'] : null;
And do not use mysql_* since it deprecated
The first argument passed to the success callback is the responseText from the AJAX call. Modify your jQuery code to this:
success: function(responseText){
$("#homestatusid").prepend("<div id='divider-"+responseText+"'><div class='userinfo'>"+newmsg+"</div></div>");
// I'm assuming that insert.php returns just the ID you're interested in
}
success: function(response){
$("#homestatusid").prepend("<div id='divider-"+response+"'><div class='userinfo'>"+newmsg+"</div></div>");
}