Guys i have made a blog using Laravel framework, today I just heard about ajax, What I heard is in short: it loads data quickly. My issue is that I have many routes , controllers with views.
What steps do i need to use so called ajax javascript?
<script>
$.ajaxSetup({
headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content')
}
});
jQuery.ajax({
url:'/blog',
type: 'GET',
success: getIndex( ){
console.log( );
},
});
</script>
It is basically the same, when you make a HTTP request using ajax, you need to define the route you are requesting, for example this ajax request:
$.ajax({
type: 'post',
url: 'your/url',
dataType: 'json',
success: function (data) {
}
});
You define your route like a normal route would be, since this ajax request is type "post", you define your route as "post":
Route::post('your/url', 'yourController#yourFunctionInsideController')->name('your.route.alias');
Ajax can be used normally in Laravel, I particularly usually host my codes in '/ public / js' and then extend through the <script> so that the code is not mixed. I advise you to study Laravel's structure, read the documentation, see some videos. Your question is very broad, so I will leave some materials that are of interest to you.
Book by Novatec about Ajax:
https://www.novatec.com.br/livros/ajaxjquery/
Laravel Docs:
https://laravel.com/docs/5.4/
Related
Im going to start AJAX can someone help, guide me to how should i do it ,where should i learn it from.
(I have membership in Lynda they have a course on AJAX [only 2 hours long] i don't think that would be enough. right?).
jQuery AJAX documentation: http://api.jquery.com/jquery.ajax/
I recommend this method:
$.ajax({
type: "POST",
url: 'ajax_controller.php', //url to u controller in PHP
data: { //Data transmitted to the controller
id: id,
action: 'delete'
}
}).done(function(result){
console.log(result);//show controller result in console
});
How to use jQuery to make Ajax request in Grails pages?
How to setup a URL hitting a method on Grails Controller? Let's say controller:'airport', action:'getJson' and input to the action is 'iata'.
I am able to set static url as http://localhost:8080/trip/airport/getJson but not able to figure out how to pass input for iata specifically.
I am fairly new to Grails and following IBM's 'Mastering the Grails' tutorial series. Do suggest me some good tutorial on using jQuery with Grails.
use the $.ajax method in jquery
$.ajax({
url:"${g.createLink(controller:'airport',action:'getJson')}",
dataType: 'json',
data: {
iata: '.............',
},
success: function(data) {
alert(data)
},
error: function(request, status, error) {
alert(error)
},
complete: function() {
}
});
It's:
$.ajax({
url: '/trip/airport/getJson',
data: {paramName: 'iata'}
});
use your parameter name, that you're expecting in action, intead of paramName, that i've used.
Supposing I have the following code which returns a Javascript object which I can read in Firebug's console:
FB.api('/me',function(apiresponse){
console.log(apiresponse);
});
How can I then use the data from apiresponse in an Ajax request on the same page?
Currently my Ajax request looks as follows:
$.ajax({
// CodeIgniter URL
url: "<?=site_url?>('login/add_fb_users'); ?>",
type: 'POST',
data: apiresponse,
success: function(data) {
alert(data);
}
});
I know very little about Javascript, but reading around the subject leads me to think I have to convert the Javascript object to a JSON string. Is that correct? Am I on the right track?
You could put your AJAX call inside the handler for the API call like below..
FB.api('/me', function(apiresponse){
console.log(apiresponse);
$.ajax({
// CodeIgniter URL
url: "<?=site_url?>('login/add_fb_users'); ?>",
type: 'POST',
data: apiresponse,
success: function(data) {
alert(data);
}
});
});
one possible way:
define a global variable in your javascript, e.g. var myVar1;
set apireponse to the global variable in your FB.api callback (i.e. where u call console.log)
reference the var myVar1 in your ajax fcn.
I have two Ajax requests that I am wanting to combine together into one. I'm having trouble figuring how to do this as one is using $.ajax() and another is using $.get().
As I'm fairly new to Ajax, this is causing me much pain. If you could help, it would me much appreciated.
Ajax Request #1
$.ajax
({
type: "GET",
url: "new_arrivals_data.php",
data: "page="+page,
success: function(msg)
{
$("#gallery_container").ajaxComplete(function(event, request, settings)
{
gallery_show();
loading_hide();
$("#gallery_container").html(msg);
});
}
});
Ajax Request #2
$.get("new_arrivals_data.php",{imgs: value}, function(data){
$("#gallery_container").html(data);
});
Thanks for any help you can offer.
They are actually both GETs $.get is short hand for $.ajax({ type:'GET'.
So combining them might work depending on your server's response:
$.ajax
({
type: "GET",
url: "new_arrivals_data.php",
data: {page:page, imgs: value},
success: function(msg)
{
gallery_show();
loading_hide();
$("#gallery_container").html(msg);
}
});
Not sure what you're looking for, but Ajax Request #2 is equivalent to:
$.ajax({
type: 'GET',
url: "get_images.php",
data: {imgs: value},
success: function(data){
$("#imgTray").html(data);
}
});
Hope this helps.
You can't just 'combine' requests - you'll still need to make two separate requests to each of these URLs. Since by default, ajax requests are asynchronous, you can fire them both almost simultaneously (if one doesn't depend on the other. As marko points out in the comments, if they are dependent, you could force the requests to be synchronous. $.ajax has an async property.).
if(condition){
makeRequest1();
makeRequest2();
}
Also $.get() is simply a convenience method for $.ajax() with certain options preset (such as using GET as the request type).
I have a question.
How can I use Ajax on my templates...
in single.php I have :
$.ajax({
type: "POST",
url: "http://www._____wp-content/themes/MS-MangoBerry___/myajax.php",
data: "yo",
cache: false,
success: function(data)
{
alert("yes");
}
});
And in myajax.php, I have
$(document).ready(function() {
alert("ok"); });
Then I have an error : Fatal error: Call to undefined function get_header() in myajax.php
Why ?
Thanks in advance.
Please also have a look at this article http://www.garyc40.com/2010/03/5-tips-for-using-ajax-in-wordpress/#js-global
It suggests that all AJAX requests should be submitted to /wp-admin/admin-ajax.php
And the you could hook the request by using this code in functions.php
add_action('wp_ajax_your_ajax_action_name', 'method_name');
add_action('wp_ajax_nopriv_your_ajax_action_name', 'method_name');
Then you could implement a method in functions.php
function method_name()
{
// do something or echo XML to return stuff
}
On the request you also need to send a parameter name 'action' with value of the action name.
in this case it would be action=your_ajax_action_name.
Hope this help :)
wordpress has a built ajax url that you need to use. this post will help you out.
http://geekpreneur.blogspot.com/2009/06/how-to-use-wpajax-in-wordpress.html
the tricky thing is how wordpress knows which function will accept your call back. it happens by adding an action. the hook of the action is your ajax action prepended with wp_ajax_