jquery code snippets

jquary_snip1.js

//run after juqary loaded
$(function(){

  // other codes

});

//ajax setup csrf token
   $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
   });

//ajax post example

 $.ajax({
            type: 'POST',
            url: basepath + "/" + "url",
            data: {data_attribute:"test"},

            success: function (result) {
                folderArray = [];

                result.data.forEach(element => {
                    folderArray.push(element);
                });

                bredcrumbArray = result.pathArray || [];

                renderFolders();
                renderBredcrumbs();

            },
            error: function (data) {

            },
            complete:function(){
                //after finish ajax
            }
        });
        
///ajax with jwt/Bearer toeken
$.ajax({
    type: "POST",
    url: "https://url.com/task",
    headers: {
        Authorization: 'Bearer ' + token
    },
    data: {data_attribute:"test"},
    dataType: 'json',
    success: function (result, status, xhr) {
        ShowData(result);
    },
    error: function (xhr, status, error) {
         alert(error);
    }
});



//clear element
 var holder = $('.folder_holder');

 holder.empty();

//dynamic click method to .folder class

 $(document).on("click", ".folder", function () {

        var parent_id = $(this).attr('data-id') || null;
 
    });


//this keyword use for current refered element (eg in button click event)
 var thisbtn = this;
 $(thisbtn).prop("disabled",true); //check attribute of disble
 $(thisbtn).text('creating..'); //text change inside

// hide element

$(document).ready(function(){
  $(".hide").click(function(){
    $(this).hide();
  });
});

//selectors
$("*")// 	Selects all elements 	
$(this) //	Selects the current HTML element 	
$("p.intro")// 	Selects all <p> elements with class="intro" 	
$("p:first") //	Selects the first <p> element 	
$("ul li:first") //	Selects the first <li> element of the first <ul> 	
$("ul li:first-child") //	Selects the first <li> element of every <ul> 	
$("[href]") 	//Selects all elements with an href attribute 	
$("a[target='_blank']") //	Selects all <a> elements with a target attribute value equal to "_blank" 	
$("a[target!='_blank']") //	Selects all <a> elements with a target attribute value NOT equal to "_blank" 	
$(":button") //	Selects all <button> elements and <input> elements of type="button" 	
$("tr:even") //	Selects all even <tr> elements 	
$("tr:odd") // Selects all odd <tr> elements

//form serialize
$( "form" ).on( "submit", function( event ) {
  event.preventDefault();
  console.log( $( this ).serialize() );
});

//toogle clases
$("span").click(function(){
  $(".circle:first-child").toggleClass("an1");
  $(".circle:last-child").toggleClass("an2");
});
//class chains
 $(".classname div").removeClass("class2").removeClass("class3").addClass("class4");

//for loop example
var $elements = $('.wrapper .element'),  //get elements
var elementLen = $cards.length;

$($elements).each(function(){
       
      $(this).css({'color': 'blue'});
      
});