Need help in Ajax - php

I have this code to POST value to main.php, with onclick function UserID will be called and value which is user_id should be changed based on selected value and load selected user_id in user_profile.php?ID=user_id
var USER_ID = 0;
function UserID(user_id)
{
USER_ID = user_id;
$.ajax({
type: "POST",
url: "main.php",
data: {ID: USER_ID},
success: function(msg)
{
alert(USER_ID);
$('#user_profile_content').load('user_profile.php?ID=USER_ID #user_profile_content');
},
error: function()
{
alert("error");
}
});
}
After success post, alert is showing with selected value, it means POST was successful but I don't know how to make user_profile.php?ID=USER_ID to be changed based on received value. It's not replace global variable USER_ID.

From what I understand you want to change the url route, try:
...
success: function(msg){
window.location.href = `user_profile.php?${msg.id}`
$('#user_profile_content').load(`user_profile.php?ID=${msg.id}
#user_profile_content`);
...
ES6 template literals allow you to insert the returned value in a string.
Window.location.href allows you to change the route on the browser (Frontend), I recommend you do it from the Backend if possible though.
This answer assumes msg.id is the desired value that you want to pass since the contents of the response are not specified.

Related

Jquery autocomplete not showing the list of values that should appear below the input element

I have been trying to implement the functionality to allow the user to select from a list which is created as the user types text in the input element using the autocompelte jquery api. However, my implementation is not working as it should, currently, I am able to log the text to the console as the user types but the same text is not binding to the input element that as it should. That is, the option to allow the user to select their option from a list.
I was able to accomplish the desired result using the $getJSON method, however, this method only works when the data source is not changing. This method does not work when I try to get the text that the user has entered in the text box.
$(document).ready(function(){
$("#autocomplete1").keyup(function(){
$.ajax({
type: "POST",
url: "search1.php",
data:'keyword='+$(this).val(),
success: function(data){
console.log(data);
$("#autocomplete1").autocomplete({
source: data
});
}
})
});
});
The contents of search1.php are as follows:
header("Content-Type", "application/json");
$items = get_merchant_name_by_user_input($_POST['keyword']);
echo json_encode($items);
The format of the JSON data returned is:
[
{"value":"amazob","label":"amazob"},
{"value":"Amazon","label":"Amazon"},
{"value":"amazon","label":"amazon"}
]
Just use dataType: "JSON"
$(document).ready(function(){
$("#autocomplete1").keyup(function(){
$.ajax({
type: "POST",
dataType: "JSON",
url: "search1.php",
data:'keyword='+$(this).val(),
success: function(data){
console.log(data);
$("#autocomplete1").autocomplete({
source: data
});
}
})
});
});

passing jquery var from view to controller in codeigniter

This is in script .ready() function which fetch existing files from database and putting in jquery var splitfiles. which is in array formate.
var splitfiles = '<?php echo #$projectDetails->upload_file; ?>';
this line gives array of attached file from view in controller
$arrayoffiles = json_encode($joinfiles);
I want to get this splitfiles var in controller and then merge with $arrayoffiles after that store in database with other form data.
I tried with this solution to pass 'splitfiles' to controller by this bellow code but i am not getting in the controller
$(document).ready(function() {
$.ajax({
url: '<?php echo site_url("trusts/fundsRaisingModule"); ?>',
type: 'GET',
dataType: 'json',
data: {
splitfiles:splitfiles,
// key : value pair. You can send as many pair as you want like this
}
});
});
In controller i am not getting the 'splitfiles'
$files=$_REQUEST['splitfiles'];
giving error :undefined index 'splitfiles'
so help me to pass jquery variable from view to controller in codeigniter
after that i will try to merge the two arrays
Thanks in advance.
To achieve this use jquery ajax() and send the js variable to controller method and use it as you want.
Its syntax is:
$(document).ready(function(){
$.ajax({
url: 'controller_method',
type: 'POST',
data: {
splitfiles :splitfiles,
// key : value pair. You can send as many pair as you want like this
},
success: function(response){ // response from process
// do your stuff here
}
});
});
controller_method
$splitfiles = $_REQUEST['splitfiles'];
// do your stuff here
Note: Don't forget to add the jquery library in your code.
First send that jQuery variable into any hidden input of the view, and then get that input value into controller through GET or POST method.

Get the class name from returned value of POST in Ajax

I have two dropdown lists and on selecting the data I used ajax to send it to a php file where I retrieved a table and send the whole table contents as per my query fields and I display it via
jQuery("div#tablecontent").html(returnval);
But now i want to edit, delete the table view I displayed and I tried to get the class of the row I returned. But couldn't please guide me in how to get the class of the field I returned as whole table.
EDIT : Adding the code i ve done
jQuery(document).ready(function(){
jQuery("#select1").change(function(){
jQuery.ajax({
type: "POST",
url: "<?php echo $base_url;?>?q=search/won",
error: function(returnval) {
alert("Failure");
},
success: function (returnval) {
// alert(returnval);
jQuery("select#fileds_content").html(returnval)
//alert("Sucess");
}
})
//
jQuery("#fileds_content").change(function(){
if(jQuery(this).val()){
var datawon = jQuery(this).val();
jQuery.ajax({
type: "POST",
url: "<?php echo $base_url;?>?q=getbases/won",
data:{ datawon : datawon},
error: function(returnval) {
// alert(returnval);
// alert("Failure");
},
success: function (returnval) {
// alert(returnval);
jQuery("div#tablecontent").html(returnval);
//alert("Sucess");
}
})
I am not entirely sure what you actually want to do, but from what I understood is that you cannot select a newly created element by its class. In that case, you cannot select a newly created elements because js does not know about it yet, thus, you can use something like .ajaxComplete(), this will make sure to run a function After an ajax call got completed.

how to perform multiple ajax queries within an ajax block

am working on a project in which i use ajax, jquery, php and sql to manipulate data.
function fetchComments(commentOnId, commentOn){
if(!isNaN(commentOnId) && commentOnId >=0){
$.ajax({
type: 'POST',
dataType: "json",
url: 'get_comments.php',
data: 'commentOnId='+commentOnId+'&commentOn=blogArticle',
success: function(data){},
error: function(){
}
});
}
}
the above function uses the 'commentOnId & commentOn' passed to it to fetch all comment on that that particular blog id in json format.
the result/rows in my comment table are as follows.
id
commentOnId
commentOn
commentText
authorId
created
what i want to do is get the values of these rows and in this same function run another ajax query which i will pass the authorId to a php file that returns an authors's full name from a table called authorDetails,
and also use the id value to run another ajax query to return all replies on this comment id or null if there is no reply. and finally update a html div '' with the result.
please, i will appreciate your quick comprehensive assistance. thank you.
You can use SQL joins to get all your needed data in one request if you don't want other details on user iterative basis.
If I were you, I would fetch everything in a single Ajax call rather than perform another Ajax call.
If you want multiple Ajax calls, you can do the following.
function fetchComments(commentOnId, commentOn){
if(!isNaN(commentOnId) && commentOnId >=0){
$.ajax({
type: 'POST',
dataType: "json",
url: 'get_comments.php',
data: 'commentOnId='+commentOnId+'&commentOn=blogArticle',
success: function(data){
$.ajax({
type :'post',
url : 'get_auth_details.php',
data : 'authorId=' + data.authorId,
success : function(data) {
Update div logic goes here
}
}
},
error: function(){
}
});
}
}

jQuery, need help with 'sortreceive' ajax call and POST vars

I have a dilemma that just seems beyond my abilities at the moment!
I have a group of connected sortables using the class 'biglist'.
What I want to do is bind #biglist 's sortreceive callback (which is made whenever a list receives an element from another) to take the 'boxnum' value of the element (which signifies which list its coming from) and perform an UPDATE query changing the id's boxnum value from say 5(list it came from) to 7 (list its been dragged to) so that the state persists.
So the exchange would happen like so (roughly)
$( "#biglist" ).bind( "sortreceive", function(event, ui) {
ajax call to boxchange.php
create vars to represent elements 'boxnum' value and 'box moved to' value
});
Then inside boxchange.php ->
$id = $_POST['id']
$box = $_POST['boxnum']
->update query SET boxid to new boxid WHERE id = posted ID of element
I hope this makes sense. It seems like a pretty slick way to make my program work!
Any help is greatly appreciated.
EDIT:
Just cleaned up the function to see if there are any changes that need to be made to it (which I know there are, because it looks sloppy) This function would need to be copied/altered for each sortable separately but it'd totally make the program work at least!
function ReceiveTwo()
{
$('#sortable2').bind('sortreceive', function(event, ui)
{
boxnum = $(this).attr('boxnum');
id = $(this).attr('id');
$.ajax
({
url: "boxchange.php",
type: "POST",
data: boxnum, id,
success : function(feedback)
{
$('#data').html(feedback)
}
})
});
$('#sortable2').sortable("refresh");
});
$('#sortable2').bind('sortreceive', function(event, ui) {
$.ajax({
url: "boxchange.php",
type: "POST",
beforesend: function(){
boxnum = $(this).attr('boxnum');
id = $(this).attr('id');
},
data: {'boxnum': boxnum, 'id': id},
success : function(feedback) {
$('#data').html(feedback),
}
});
});
beforesend is the event that fires before the ajax call. I believe here you could set your properties to accomplish what you want.
I think the way you want to send your Javascript data to your server-side PHP script is using a Javascript associative array, like so:
$.ajax({
url: "boxchange.php",
type: "POST",
data: {'boxnum': boxnum, 'id': id},
success: function(data,status) { ... }
Your "boxchange.php" script would then be able to access those variables via $_POST['boxnum'] and $_POST['id'].
I think that was your goal, but I'm not entirely sure...

Categories