How to Include link+id in javascript - php

what iam trying to do basically and i didnt succeed is getting id from link
<input type="hidden" value="<?PHP echo $_GET['id']; ?>">
retrieve the id using javascript variable add it to api.php
var id = $("#id").val();
var firstname = $("#firstname").val();
var name = $("#name").val();
var state = $("#state").val();
var dataString = 'firstname='+ firstname + '&name=' + name + '&state=' + state;
if(firstname=='' || name=='' || state=='')
{
$('.success0').fadeOut(200).hide();
$('.error').fadeOut(200).show();
}else{
$.ajax({
type: "POST",
url: "api.php+id",
data: dataString,
After the api.php would pickup the id, but unfortunately it dosent work
exec('curl -b cookies -c cookies -X POST -d #file.json http://sand.api.xxx.com/item?id='. $_GET['id']);

<input type="hidden" value="<?PHP echo $_GET['id']; ?>">
your code is vulnerable to xss attack
use this
<input type="hidden" id="myid" value="<?PHP echo htmlentities($_GET['id']); ?>">
var id=$("#myid").attr("value");
or
var id=$("#myid").val();

few bugs I noticed in your code:
your html should look like:
<input id="el_id" type="hidden" value="<?PHP echo $_GET['id']; ?>">
your JS fixed below:
var id = $("#el_id").val();
var firstname = $("#firstname").val();
var name = $("#name").val();
var state = $("#state").val();
var dataString = 'firstname='+ firstname + '&name=' + name + '&state=' + state;
if(firstname=='' || name=='' || state=='')
{
$('.success0').fadeOut(200).hide();
$('.error').fadeOut(200).show();
}else{
$.ajax({
type: "POST",
url: "api.php?id="+id,
data: dataString,

Related

JQuery: Cannot Access php file using Relative Path

Really struggling to get a relative path to work for an Ajax request.
From like.js I'm trying to get to likeunlike.php
Error message:
jquery-3.3.1.js:9600 POST http://localhost:8000/serverside/likeunlike.php 404 (Not Found)
File structure:
JQuery:
$(document).ready(function(){
// like and unlike click
$(".content").on("click",".like",function(){
var id = $(this).attr("id"); // Getting Button id
var split_id = id.split("_");
var postid = split_id[1];
var userid = split_id[2];
// AJAX Request
$.ajax({
url: '../serverside/likeunlike.php',
type: 'post',
data: {postid:postid,userid:userid},
dataType: 'json',
success: function(data){
var likes = data['likes'];
var type = data['type'];
$("#likes_" + postid + "_" + userid).text(likes);
if(type == 1){
$("#like_" + postid + "_" + userid).css("color","lightseagreen");
}
if(type == 0){
$("#like_" + postid + "_" + userid).css("color","#ffa449");
}
}
});
});
});
Have provided the index file as requested by one of the answers. Hope it helps.
Index.php:
<?php
include "detail/config.php";
?>
<html>
<head>
<title>Talk</title>
<link href="style/style.css" type="text/css" rel="stylesheet" />
<script src="jquery/jquery-3.3.1.js" type="text/javascript"></script>
<script src="search/script/like.js" type="text/javascript"></script>
<script src="search/check/check.js" type="text/javascript"></script>
</head>
<script>
$(function() {
$('form').on("submit", function(e) {
e.preventDefault();
$('#error').text(""); // reset
var name = $.trim($("#search").val());
if (name.match(/[^a-zA-Z0-9 ]/g)) {
$('#error').text('Please enter letters and spaces only');
return false;
}
if (name === '') {
$('#error').text('Please enter some text');
return false;
}
if (name.length > 0 && name.length < 3) {
$('#error').text('Please enter more letters');
return false;
}
$.ajax({
url: 'search/search.php',
method: 'POST',
data: {
msg: name
},
dataType: 'json',
success: function(response) {
$(".content").html("")
$(".total").html("")
if(response){
var total = response.length;
$('.total') .append(total + " Results");
}
$.each(response, function() {
$.each($(this), function(i, item) {
var mycss = (item.Type == 1) ? ' style="color: #ffa449;"' : '';
$('.content').append('<div class="post"><div class="post-text"> ' + item.MessageText + ' </div><div class="post-action"><input type="button" value="Like" id="like_' + item.ID + '_' + item.UserID + '" class="like" ' + mycss + ' /><span id="likes_' + item.ID + '_' + item.UserID + '">' + item.cntLikes + '</span></div></div>');
});
});
}
});
});
});
</script>
<body>
<form action="index.php" method="post" id="myForm" autocomplete="on"><pre>
<input name="msg" id="search" type="text" autofocus value= "<?php if(isset($_POST['msg'])) {
echo htmlentities ($_POST['msg']); }?>"></input> <span id="error"></span>
<input type="submit" style="border:0; padding:0; font-size:0">
</pre></form>
<div class="total">
</div>
<div class="content">
</div>
</body>
</html>
jquery / js has no information about his location.
this should be work.
var base_url = window.location.origin;
// like and unlike click
$(".content").on("click",".like",function(){
var id = $(this).attr("id"); // Getting Button id
var split_id = id.split("_");
var postid = split_id[1];
var userid = split_id[2];
// AJAX Request
$.ajax({
url: base_url + '/search/serverside/likeunlike.php',
type: 'post',
data: {postid:postid,userid:userid},
dataType: 'json',
success: function(data){
var likes = data['likes'];
var type = data['type'];
$("#likes_" + postid + "_" + userid).text(likes);
if(type == 1){
$("#like_" + postid + "_" + userid).css("color","lightseagreen");
}
if(type == 0){
$("#like_" + postid + "_" + userid).css("color","#ffa449");
}
}
});
});
});
I have resolved the situation by:
Making my directory structure simpler as well as the file names. It was over-engineered. I have my root folder now and then just one level below that for folders.
The Ajax url path, which I was struggling with was amended to 'serverside/like.php', which picked up the php file but nothing happened.
Reviewing the like.php code I had an include("../con/config.php") without a ';'. I added this and it's now working fine.
Thank you for everyone's help. Much appreciated as always.
New folder structure:

multiple forms on page onclick ajax function not working

I have an ajax search function that produces a list of names from database. Each name is echoed back as a form button so when user clicks on the name another ajax call will bring up all info related to that name. However, it is not working. I have tried several variations of the ajax function below but either nothing happens at all or the page just gets refreshed with no results.
Any ideas on how to get this to work?
This is the latest ajax (which does nothing)
$(function GetInfo() {
$('form').on('click', function (e) {
var tourName = $('#tourName').val();
var FirstName = $('#FirstName').val();
var LastName = $('#LastName').val();
alert("PLEASE ENTER A NAME" + FirstName + LastName);
$.ajax({
type: "POST",
url: 'process.php',
data: "tourName=" + tourName + "&firstname=" + firstname + "&lastname=" + lastname,
success: function(data){
$("#search_results").html(data);
}
});
e.preventDefault();
});
});
And this is the php loop that produces the forms (names):
$string = '';
if (mysql_num_rows($query)){
while($row = mysql_fetch_assoc($query)){
$FirstName = $row['FirstName'];
$LastName = $row['LastName'];
$Name = $row['FirstName']." ".$row['LastName'];
$string .= "<form method='post' action=''>
<input type='hidden' name='FirstName' value='$FirstName'>
<input type='hidden' name='LastName' value='$LastName'>
<input type='button' class='button' name='person_name' value='$Name' onClick='GetInfo()'></form><br /><br />\n";
}
}else{
$string = "No matches found!";
}
mysql_close($con);
echo $string;
Just incase anyone has the same issue, I got the following code to work:
function GetInfo(form) {
var person_name = form.person_name.value;
var tourName = form.tourName.value;
var firstname = form.FName.value;
var lastname = form.LName.value;
$.ajax({
type: "POST",
url: "process.php",
data: "person_name=" + person_name + "&tourName=" + tourName + "&firstname=" + firstname + "&lastname=" + lastname,
success: function(data){
$("#search_results").html(data);
}
});
return false;
}
And in the form
$string .= "<form method='post' id='$form'>
<input type='hidden' name='tourName' value='$tourneyName'>
<input type='hidden' name='FName' value='$FirstName'>
<input type='hidden' name='LName' value='$LastName'>
<input type='button' class='button' name='person_name' value='$Name' onClick='GetInfo (this.form)'></form><br /><br />\n";
}
}else{
$string = "No matches found!";
}
You should add an ID to you form and target instead of using $('form') use $('#yourformid')
Use this:
$(function GetInfo(el) {
var tourName = $('#tourName').val();
var FirstName = $(el).siblings('[name=FirstName]').val();
var LastName = $(el).siblings('[name=LasstName]').val();
alert("PLEASE ENTER A NAME" + FirstName + LastName);
$.ajax({
type: "POST",
url: 'process.php',
data: { tourName: tourName, firstname: FirstName, lastname: LastName },
success: function(data){
$("#search_results").html(data);
}
});
e.preventDefault();
});
And you need to change the HTML to use:
onclick='GetInfo(this)'
The solution is posted above. It seems rather simple now that it's done.
$('#send_email').click(function() {
$.ajax({
type : 'POST',
url : '<?php echo base_url()?>contact',
data : $( '#contact_form' ).serialize(),
success : function(msg){
$('#results').html(msg);
if(msg == "Successfully Subscribed"){
$( "#email_news" ).val('');
}
}
});
return false;
});

ajax request hidden fields

I'm developing a site (only for fun and learn programming with jquery)
and i'd like to know what's wrong with this :
$(window).unload(function(){
var myid = $('input#v1').attr('value'); // hidden
var playauth = $('input#v2').attr('value'); // hidden
var srvid = $('input#v3').attr('value'); // hidden
var result = 'myid='+ myid +'&auth='+ playauth +'&srvid='+ srvid;
$.ajax({
type: "GET",
data: result,
url: "closing.php",
complete: function(data) {
alert(data.responseText);
}
});
});
I'm trying to update a database table. When i close the window nothing happens.
With a previous version of this function :
window.onunload = function () {
var xhReq = new XMLHttpRequest();
var n = document.getElementById("v1").InnerHTML;
var o = document.getElementById("v2").InnerHTML;
var p = document.getElementById("v3").InnerHTML;
xhReq.open("GET", ("closing.php?myid=" + n + "&auth=" + o + "&srvid=" + p) , false);
xhReq.send(null);
var serverResponse = xhReq.responseText;
alert(serverResponse);
};
.. i saw the response alert but GET values were 'undefined'.
.... probably because the type of inputs is hidden..?
This is my form... maybe i miss something ?? I'm really new to jquery/ajax .. please help!!
<form method="get">
<input id="v1" type="hidden" name="val1" class="aget" value="<?php echo $_GET['myid']; ?>" />
<input id="v2" type="hidden" name="val2" class="bget" value="<?php echo $_GET['playauth']; ?>" />
<input id="v3" type="hidden" name="val3" class="cget" value="<?php echo $_SESSION['srvid']; ?>" />
</form>
change
var myid = $('input#v1').attr('value'); // hidden
var playauth = $('input#v2').attr('value'); // hidden
var srvid = $('input#v3').attr('value'); // hidden
to
var myid = $('input#v1').val(); // hidden
var playauth = $('input#v2').val(); // hidden
var srvid = $('input#v3').val(); // hidden
You must use
.val(); instead of .attr('value');

Page refresh instead of Ajax Load without

On form submit i want to load a div with an updated list of a mysql table. I'am sending the form variables across to a php and posting them into a mysql table. the same page displays the full table data. I want to load the data into the same div tag as the form. So it appears that the information is being loaded above the form.
My Javascript
$("#formSubmit").submit(function(){
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
My form -
<div id="2">
<p>Add a Comment</p>
<form id="formSubmit" method="POST">
<div>
<input type="hidden" name="hidden" id="hidden" value="2">
<label for="name">Your Name</label>
<input type="text" name="name" id="name" />
<label for="body">Comment Body</label>
<textarea name="comment" id="comment" cols="20" rows="5"></textarea>
<input type="submit" id="comment" class="button" value="Submit" />
</form>
</div>
All it is doing is refreshing the page and not loading the information in to div 2 :S
thanks for your help
You need to prevent the form from redirecting the page using the preventDefault method on the event object:
$("#formSubmit").submit(function(e){ // add the event object as an argument to your function
e.preventDefault(); // right here
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
});
add a return false to the end to stop the form from submitting. or if you want to be more elegant use the preventDefault(); method. personally for something as simple as this though i just stick with return false;
$("#formSubmit").submit(function(e){ // add the event object as an argument to your function
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
return false;//right here
});

passing input value using jquery on mysql query

I have following html form:
<form method="post" action="">
<input type="hidden" name="userid" id="user" value="<?php echo $user ?>"/>
<textarea name="comment" class="subcomment_form" id="ctextarea<?php echo $suggestid ?>"></textarea>
<input type="submit" value="Post" id="<?php echo $suggestid ?>" class="form_btn" style="margin-top: 5px"/>
</form>
following JS code:
$('.form_btn').live("click",function()
{
var ID = $(this).attr("id");
var user= $("input[name=userid]").val();
var comment= $("#ctextarea"+ID).val();
var dataString = 'comment='+ comment + '&suggestid=' + ID + 'user' + user;
if(comment=='')
{
alert("Please Enter Comment Text");
}
else
{
$.ajax({
type: "POST",
url: "action/subcomment.php",
data: dataString,
cache: false,
success: function(html){
$("#commentload"+ID).append("html");
$("#ctextarea"+ID).val('');
$("#ctextarea"+ID).focus();
}
});
}
return false;
});
and following php code for subcomment.php file:
if($_POST['comment'])
{
$comment=$_POST['comment'];
$suggestid=$_POST['suggestid'];
$user=$_POST['user'];
$sql = "INSERT INTO user_suggestions_comments (uvd_id, user_id, usc_comment) VALUES ('".$_POST['suggestid']."', '".$_POST['user']."','".$_POST['comment']."')";
mysql_query( $sql);
}
the problem I have is that value from <input type="hidden" name="userid" id="user" value="<?php echo $user ?>"/> is not passed on php file and textarea content is passed. What I need to change inside that JS code to make it work?
It looks like your dataString is not being built to what your PHP code is expecting.
Try this change.
var dataString = 'comment='+ comment + '&suggestid=' + ID + 'user' + user;
becomes
var dataString = 'comment='+ comment + '&suggestid=' + ID + '&user=' + user;
You are looking for three values from your $_POST and only passing 2
$comment=$_POST['comment'];
$suggestid=$_POST['suggestid'];
$user=$_POST['user'];

Categories