jQuery

jQuery

Explore jquery code snippets and tutorials

jQuery

Handlebars compare helper

Handlebars compare helper

javascript
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
Handlebars.registerHelper('compare', function (a, operator, b, options) {
  let result;

  switch (operator) {
    case '==':
      result = a == b;
      break;
    case '===':
      result = a === b;
      break;
    case '!=':
      result = a != b;
      break;
    case '!==':
      result = a !== b;
      break;
    case '>':
      result = a > b;
      break;
    case '<':
      result = a < b;
      break;
    case '>=':
      result = a >= b;
      break;
    case '<=':
      result = a <= b;
      break;
    default:
      throw new Error('Unknown operator ' + operator);
  }

  if (result) {
    return options.fn(this);    // block runs if true
  } else {
    return options.inverse(this); // block runs if false
  }
});
jQuery

jQuery ajax with authorization token bearer with jwt

<p>Example of jquery ajax call with authorization bearer token&nbsp;</p>

javascript
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
$.when($.ajax({
        url: 'url',
        method:  'get',
        datatype: 'json',
        headers: {"Authorization": "Bearer " + localStorage.getItem('token')}

      })).then(function( response, textStatus, jqXHR ) {
      console.info(response);
      var obj = response;
      console.info(obj)
      
    }).catch(function(err){
      $.each(err.responseJSON, function(index, value){
        console.info(index, value);
    })
})
jQuery

submit form with jquery ajax

javascript
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
$('body').on('submit', 'form', function(e){
            e.preventDefault();
            let $form = $(this);
            let url = $(this).attr('action');
            let data = $(this).serialize();
            let method = $(this).attr('method');
            $.when($.ajax({
                url: url,
                data:data,
                method:  method,
                datatype: 'json',
              })).then(function( response, textStatus, jqXHR ) {
              console.info(response);
              $($form)[0].reset();
              var obj = response;
              console.info(obj)
              
            }).catch(function(err){
              $.each(err.responseJSON, function(index, value){
                console.info(index, value);
                $('#id_'+ index).addClass('is-invalid');
                $('#id_'+ index).after("<div class='invalid-feedback'>" + value + "</div>");
            });
            return false
        })
jQuery

Get url params as json object in jquery

<p>This code defines a JavaScript function called <code>getUrlParametersAsJson()</code> that extracts URL parameters from the current page&#39;s URL and returns them as a JavaScript object (JSON format).</p> <p>Here&#39;s a step-by-step explanation …

javascript
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
function getUrlParametersAsJson() {
  var urlParams = window.location.search.substring(1);
  var paramArray = urlParams.split('&');
  var params = {};

  $.each(paramArray, function(index, param) {
    var keyValue = param.split('=');
    var key = decodeURIComponent(keyValue[0]);
    var value = decodeURIComponent(keyValue[1]);
    params[key] = value;
  });

  return params;
}

// Usage
var jsonParams = getUrlParametersAsJson();
console.log(jsonParams);
jQuery

Pass search string on datatables on load

Pass search string on datatables on load

javascript
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
<table id="myTable">
  <!-- Table contents go here -->
</table>

<!-- JavaScript code -->
<script>
$(document).ready(function() {
  // Initialize DataTables
  var table = $('#myTable').DataTable();

  // Get the search query from a search input field, for example
  var searchQuery = $('#searchInput').val();

  // Apply the search query to the DataTables search
  table.search(searchQuery).draw();
});
</script>