Can anyone show the correct syntax for adding multiple data to the database. The code i`m using below only adds 1 data.. I already know what to do on the PHP side. I'am making this for a drag and drop shopping cart system.
function addlist(param)
{
$.ajax({ type:"POST",
url: "ajax/addtocart.php",
data: 'img='+encodeURIComponent(param),
dataType: 'json',
beforeSend:function(x){$('#ajax-loader').css('visibility','visible');},
success: function(msg){
$('#ajax-loader').css('visibility','hidden')
}
});
}
Replace
data: 'img='+encodeURIComponent(param),
with
data: {img:param, otherParam:otherValue},
and let jQuery do the encodings.
Pass the data as an object to jQuery. Let it do the serialization for you:
data: { key: 'value', key2: 'value2' }
Related
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
});
}
})
});
});
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.
I want download big data from database
so using ajax call single function who pass limit to download database,
ex-66000 records
can I pass to ajax function values 20000,20000,26000
this way and download database.
thank you
Well I think, you can use nested AJAX type structure.
Call the second function when the first function accomplish its AJAX call.
Something Like this:
$.ajax({
type: 'GET',
url: "/dosomething",
cache: false,
dataType: "html",
data: { lowerbound:"0"; uperbound: "2000"} ,
success: function(html_input)
{
$.ajax({
type: 'GET',
url: "/dosomething",
cache: false,
dataType: "html",
data: { lowerbound:"2001"; uperbound: "4000"} ,
success: function(html_input){
alert(html_input);
}
});
}
});
I used for 2 iterations.
Another way is that you can pass the variables recursively to the function and perform the desired task. This will help you to scale the functions with n numbers of time.
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(){
}
});
}
}
I have the following codes which sends an array to the function /chat in codeigniter
$(document).ready(function () {
$('#submit').live('click', function (eve) {
eve.preventDefault();
$.ajax({
url: "http://localhost/fq/index.php/splash/chat/",
type: 'JSON',
data: a,
success: function (html) {
alert(html);
}
});
});
Let us assume that array a contains names of people only. ( John, James, Smith)
I want to be able to retrieve the all the values from the array in the function chat.
How can it be done?
Edit:
I need to retrieve the values from the JSON encoded array in this function (codeigniter)
public function chat()
{
//code to retrieve values
$this->load->view('chat');
}
data: a,
should
data: $('form').serialize(), // 'form' may need to replace by your form selector
But if you want to send only an array like ['John', 'James', 'Smith']... then yours is just fine.
And use dataType: 'json' as configuration if you're expecting Object as response or dataType: 'html' for Html response.
Setting dataType will release you from extra parsing effort.
You should do it via JSON, by changing
type: POST
into
type: JSON
Take a look at: http://api.jquery.com/jQuery.getJSON/
Also I agree with thecodeparadox above, it's simply better practice