Monday, December 13, 2021

Get Query Params

window.location object has a bunch of utility methods and properties. We can get information about the protocol, host, port, domain, etc from the browser URLs using these properties and methods. 


var args = window.location.search
let data = new URLSearchParams(location.search).get('reqId');
console.log(data)

Few Javascript or JQuery Tricks for array and operators

 1) Empty an array

var arr = [10 , 20 , 30 ];
arr.length = 0; // arr will be equal to [].


2) Truncate an array using length

Like the previous example of emptying an array, we truncate it using the length property.

var arr = [10, 20, 30, 40, 50, 60, 70, 80, 90];
arr.length = 4; // arr will be equal to [10, 20, 30, 40].

As a bonus, if you set the array length to a higher value, the length will be changed and new items will be added with undefined as a value. The array length is not a read only property.

arr.length = 10; // the new array length is 10
arr[arr.length - 1] ; // arr [10, 20, 30, 40, 50, 60, 70, 80, 90, undefined];


3)Use logical AND/ OR for conditions

var foo = 10;
foo == 10 && doSomething(); // is the same thing as if (foo == 10) doSomething();
foo == 5 || doSomething(); // is the same thing as if (foo != 5) doSomething();


4) Comma operator

var a = 10;
var b = ( a++, 99 );
console.log(a);  // a will be equal to 10
console.log(b);  // b is equal to 99


5) Swap variables

let v1 = 'value 1';
let v2 = 'value 2';

[v1,v2] = [v2, v1];
console.log(v1, v2);


Tuesday, September 21, 2021

Calculate date difference using JQuery

Simple way to get days between 2 dates...

Tuesday, August 17, 2021

Cheat Sheet - CSS, JQuery Selectors and Filters


* All elements.
element Basic selector defined by the elements name. IE – the <p> tag.
.class Elements specified by a specific class attribute.
#id Elements specified by the specific ID number.
selector1, selector2 Elements that match more than one selector.
:first First element from the selection.
:last Last element from the selection.
:even Even index selection.
:odd Odd index selection.
:not(selector) Everything except the selector in parentheses.
:eq() Elements with an index number equal to the parameter.
:gt() Elements with an index number greater than the parameter.
:lt() Elements with an index number less than the parameter.
:header All h1 – h6 HTML tags.
:animated Any element being animated.
:focus The element which has focus (an input item such as a field, checkbox, button, or link).
:empty Elements with no children.
:parent Elements that have a child node.
:has(selector) Elements contain atleast one of the elements that match the selector in parentheses.
:contains(‘text’) Elements that contain the specified text in parentheses.
:hidden Elements that are hidden.
:visible Elements that exist and take up space in the layout of the page.
:nth-child(exp) Elements that match the mathematical pattern. IE –  div :nth-child(2+1)
:first-child First child from the current selection.
:last-child Last child from the current selection.
:only-child The only existing child of the matching element.
[attribute] Elements that have the specified attribute value – IE – [name^ = “value”]
:input Elements with input.
:text Elements with text.
:password Elements with password inputs.
:radio Elements with radio buttons.
:checkbox Elements with checkboxes.
:submit Elements with submit buttons.
:image Elements with images.
:reset Elements with reset buttons.
:button All buttons.
:file Elements with file inputs.
:selected All items from drop-down lists.
:enabled All enables elements, including defaults.
:disabled All disables elements.
:checked All checked checkboxes or radio buttons.

If there’s anything that I’ve missed or more explanation that you’d like to see, feel free to leave a comment.

Help other's to help yourself !!

Wednesday, May 5, 2021

Export HTML table to Excel file

<!-- https://github.com/linways/table-to-excel -->

<script src="https://cdn.jsdelivr.net/gh/linways/table-to-excel@v1.0.4/dist/tableToExcel.js"></script>


function exportReportToExcel(c) {

  let table = $("#feedbackExport2Excel"); // you can use document.getElementById('tableId') as well by providing id to the table tag

  let fileName = "Feedback";

  TableToExcel.convert(table[0], { // html code may contain multiple tables so here we are refering to 1st table tag

    name: `${fileName}.xlsx`, // fileName you could use any name

    sheet: {

      name: 'Sheet 1' // sheetName

    }

  });

}//exportReportToExcel


Wednesday, February 3, 2021

Simple way to find Index value from JSON Array

Simple way to find Index value from JSON Array 


var data = [{"name":"placeHolder","section":"right"},{"name":"Overview","section":"left"},{"name":"ByFunction","section":"left"},{"name":"Time","section":"left"},{"name":"allFit","section":"left"},{"name":"allbMatches","section":"left"},{"name":"allOffers","section":"left"},{"name":"allInterests","section":"left"},{"name":"allResponses","section":"left"},{"name":"divChanged","section":"right"}];

var index = data.findIndex(obj => obj.name=="allInterests");

console.log(index);

Tuesday, February 2, 2021

Add days to a Date using JavaScript

Many times I have face this issue, and hope you too.. this is simple 3 line of code will help and fix this problem.


let days =7 ; // we are going to add 7 days to a date

let cdt = new Date('2021-01-10'); // your date value

let tdt = cdt.setTime(cdt.getTime() + (days * 24 * 60 * 60 * 1000)); // calculation for adding 7 days and adding to time

let targetDT = new Date(tdt).format("yyyy-MM-dd"); // converting back from time to date 

// Output for targetDT will be "2021-01-17"


// With function...

function addDays(theDate, days) {
    return new Date(theDate.getTime() + days*24*60*60*1000);
}

var newDate = addDays(new Date(), 5);


Hope this will help you...