Tutorial by Examples: ajax

Handling HTTP Response Codes with $.ajax()

In addition to .done, .fail and .always promise callbacks, which are triggered based on whether the request was successful or not, there is the option to trigger a function when a specific HTTP Status Code is returned from the server. This can be done using the statusCode parameter. $.ajax({ t...

jQuery • Ajax

Using Ajax to Submit a Form

Sometimes you may have a form and want to submit it using ajax. Suppose you have this simple form - <form id="ajax_form" action="form_action.php"> <label for="name">Name :</label> <input name="name" id="name" type="t...

jQuery • Ajax

Ajax binding

These are form values that go in the HTTP request using the POST method. (including jQuery POST requests). Say you did an ajax post like $.ajax({ type: 'POST', url: window.updatePost, data: { id: 21, title: 'snappy title' }, //kept short for clarity }); Here the two values...

asp.net-mvc • Model binding

Session Control action filter - page&ajax request

Usually authentication&authorization processes are performed by built-in cookie and token supports in .net MVC. But if you decide to do it yourself with Session you can use below logic for both page requests and ajax requests. public class SessionControl : ActionFilterAttribute { public o...

asp.net-mvc • Action filters

AJAX request with a JSON response

functions.php: // We add the action twice, once for logged in users and once for non logged in users. add_action( 'wp_ajax_my_action', 'my_action_callback' ); add_action( 'wp_ajax_nopriv_my_action', 'my_action_callback' ); // Enqueue the script on the front end. add_action( 'wp_enqueue_script...

WordPress • AJAX

AJAX with .ajax() and WordPress Nonce

functions.php //Localize the AJAX URL and Nonce add_action('wp_enqueue_scripts', 'example_localize_ajax'); function example_localize_ajax(){ wp_localize_script('jquery', 'ajax', array( 'url' => admin_url('admin-ajax.php'), 'nonce' => wp_create_nonce('example_ajax_nonc...

WordPress • AJAX

Submitting Ajax form

View file: <?php use yii; use yii\bootstrap\ActiveForm; use yii\helpers\Html; ?> <?php $form = ActiveForm::begin([ 'action' => ['comments/ajax-comment'], 'options' => [ 'class' => 'comment-form' ] ]); ?> <?= $form->field($model, '...

yii2 • Ajax Request

Using redux-thunk with jQuery.ajax

const loadUser = userId => dispatch => { dispatch({ type: 'USER_LOADING' }); $.ajax('/users/' + userId, { type: 'GET', dataType : 'json' }).done(response => { dispatch({ type: 'USER_LOADED', user: response }); }).fail((xhr, status, error) =>...

redux • Asynchronous Data Flow

Load data using ajax with server-side processing.

var MY_AJAX_ACTION_URL = "path/to/controller.php"; var table = $('#user_list_table').DataTable({ "autoWidth": true, "paging": true, "searching": true, "ordering": true, "language": { ...

datatables • Server Side Data Processing

Set Ajax Request Layout

Generally in AJAX request no need of load CSS, JS. Also omitting other HTML code. Make ajax.ctp file in /src/Template/Layout, and code should be <?php $this->fetch('content'); Set AJAX based layout for entire application, in AppsController.php class AppsController extends Controlle...

cakephp • CakePHP3 Coding Tips

Ajax Abort a Call or Request

var xhr = $.ajax({ type: "POST", url: "some.php", data: "name=John&location=Boston", success: function(msg){ alert( "Data Saved: " + msg ); } }); //kill the request xhr.abort()

jQuery • Ajax

Waiting For Ajax Requests to Complete

C# using OpenQA.Selenium using OpenQA.Selenium.Chrome; using System.Threading; namespace WebDriver Tests { class WebDriverWaits { static void Main() { IWebDriver driver = new ChromeDriver(@"C:\WebDriver"); driver.Na...

selenium-webdriver • Wait

Creating a simple AJAX Form

SilverStripe has reasonably good support for submitting form data using AJAX requests. Below is example code of how to set up a basic Form that accepts submissions by both AJAX and traditional default browser behaviour (as is good practice). Adding the form to our controller First we need to defin...

silverstripe • Forms

Add an AJAX preloader

Here's a way to show a GIF preloader while an AJAX call is executing. We need to prepare our add and remove preloader functions: function addPreloader() { // if the preloader doesn't already exist, add one to the page if(!document.querySelector('#preloader')) { var preloaderHTML = '<...

JavaScript • AJAX

Ajax on javascript event

The date is updated whenever user types on the input field: Bean.java @ManagedBean @ViewScoped public class Bean { public Date getCurrentDate(){ return new Date(); } } sample.xhtml <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://x...

jsf • Ajax Integration

wp_ajax - core functionality + _wpnonce check

functions.php: function rm_init_js() { wp_enqueue_script( 'custom-ajax-script', get_template_directory_uri() . '/js/ajax.js', array( 'jquery', 'wp-util' ), '1.0', true ); // pass custom variables to JS wp_localize_script( 'custom-ajax-script', 'BEJS', array( 'action' => ...

WordPress • AJAX

Sync - Async ajax requests

Asynchronous ajax call With this type of ajax call, code does not wait for the call to complete. $('form.ajaxSubmit').on('submit',function(){ // initilization... var form = $(this); var formUrl = form.attr('action'); var formType = form.attr('method'); var formData ...

ajax • Getting started with ajax

Ajax File Uploads

1. A Simple Complete Example We could use this sample code to upload the files selected by the user every time a new file selection is made. <input type="file" id="file-input" multiple> var files; var fdata = new FormData(); $("#file-input").on("cha...

jQuery • Ajax

Listening to AJAX events at a global level

// Store a reference to the native method let open = XMLHttpRequest.prototype.open; // Overwrite the native method XMLHttpRequest.prototype.open = function() { // Assign an event listener this.addEventListener("load", event => console.log(XHR), false); // Call the s...

JavaScript • AJAX

How to extend ChoiceType, EntityType and DocumentType to load choices with AJAX.

In Symfony, the built-in ChoiceType (and EntityType or DocumentType extending it), basicaly work with a constant choice list. If you want to make it work with ajax calls, you have to change them to accept any sumitted extra choices. How to start with an empty choice list ? When you build your...

symfony3 • Dynamic Forms