Needs tips on AJAX - ajax

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
});

Related

Understanding ajax POST method, finding url

I don't fully understand one thing, how the next code gets the url
parameter. I would be glad if someone could help.
$('.nav-item.home').addClass('active');
$('#searchForm').submit(function(event){
$(this).find('input[name=csrf]').val($('meta[name=csrf]').attr('content'));
$.ajax({
beforeSend: function(){
$('.spinner').show();
$('.innerText').html('');
},
type: 'POST',
data: $('#searchForm').serialize(),
url: $('#searchForm').data('action'),
The URL parameter for the AJAX call is brought in from the <form> tag:
url: $('#searchForm').data('action')
On the page there is:
<form id="searchform" action="urltosomewhere">
Is that what you are looking for?

How to use ajax with Laravel?

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/

Calling controller method (ASP MVC3) method from ajax doesn't work

I am using the following syntax to make a call to controller method from ASP page.
$.ajax({
url: 'ControllerName/MethodName',
type: 'POST',
contentType: 'application/json;',
data: JSON.stringify({ param: param1}),
success: function () {
alert("Success!!!");
},
error: function () {
alert("Failed!!!");
}
});
I have two ASP pages (views), both having same controller. If I call above method from first page, controller method gets called successfully. But if call same method from second page I get alert message "Failed". Also I tried using GET type, tried with other controller methods and all. Nothing will be called from second view. can anyone help me what can be problem? I am new to MVC.
Since your ajax is expecting result of JSON data from your Controller method do you have return Json(data, JsonRequestBehavior.AllowGet)?
Try change content type to:
contentType: 'application/json; charset=utf-8'
or/and specify url using mvc helper like:
url: #Url.Action("action"),
Works in my example. Hope it will help.

Grails: Passing a javascript variable to a template

I am new to ajax so maybe this is obvious. I've tried many different not-working approaches. I have javascript that when you click on a button:
an ajax call that grabs some data from a controller - returns an object
display that data in a template that I will show on the page
Here is the javascript/ajax:
<script type="text/javascript">
$("#show").click(function () {
$.ajax({ url: '/Myproject/result/index',
type: "POST",
data: { id: id},
success: function(result) {
alert("Success:" + result); // Can see getting object back.
}});
$(".resulttable").show();
});
Here is the key line in grails view template:
<g:each in="${allResults}" status="i" var="result">
How do I get the data from the javascript to the gsp code (ie allResults)?
Do I have to "refresh" this template to display new data?
thanks.
You just can't make your javascript/jquery code populate things in the gsp, since the gsp is processed server-side and javascript is processed client-side, after the gsp rendered all html documents and populated them with your model. You need to be aware that your page was already processed, so things like ${variables} won't be reloaded anymore. So when you do this:
$(".resulttable").show();
It's not gonna show the result you're waiting for. You have to use javascript code to reload your result table.
So if you're using ajax here, you should use the function success to alter your html table via javascript/jquery since you already have the response you wanted. Maybe this read can help you. Oh, and I think it would be better if in your ajax call, you would define a dataType (json works great in your case), like this:
$("#show").click(function () {
$.ajax({ url: '/Myproject/result/index',
type: "POST",
data: { id: id},
dataType: 'json',
success: function(result) {
alert("Success:" + result); // Can see getting object back.
}});
$(".resulttable").show();
});
Just to make clear what kind of response you're getting from the controller.
You do not need to write your ajax calls the hard way. There are some Grails intern tags you can use inside your html:
http://grails.org/doc/latest/ref/Tags/remoteFunction.html
http://grails.org/doc/latest/ref/Tags/submitToRemote.html
http://grails.org/doc/latest/ref/Tags/remoteLink.html
Following the links you will find some nice examples...

WORDPRESS : Ajax and template

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_

Resources