Wednesday, April 7, 2021

Find all IDs in a class : JQuery

 

var idArray = [];

$('.red').each(function () {
    idArray.push(this.id);
});

jQuery: sending JSON data to PHP with AJAX

 Passing JSON data with jQuery and AJAX to Node.js is relatively simple, passing JSON data with jQuery and AJAX to PHP requires a few extra steps.

Instead of trying to send JSON as is, you should only send a well-formed JSON string and let PHP to transform it into an object or an associative array (depending on how you use the json_decode() function).

Bear in mind that PHP not only requires the string to be valid JSON: your string must also be UTF-8 compliant. So with jQuery we can write:

var data = {

  test: $( "#test" ).val()

};

var options = {

  url: "test.php",

  dataType: "text",

  type: "POST",

  data: { test: JSON.stringify( data ) }, // Our valid JSON string

  success: function( data, status, xhr ) {

     //...

  },

  error: function( xhr, status, error ) {

      //...

  }

};

$.ajax( options );

And with PHP we have to take care of the string encoding before using it:

<?php

  header('Content-Type: text/plain');

  $test = utf8_encode($_POST['test']); // Don't forget the encoding

  $data = json_decode($test);

  echo $data->test;

  exit();

 ?>

Reff : https://gabrieleromanato.name/jquery-sending-json-data-to-php-with-ajax

Saturday, February 27, 2021

Tooltip For Angular

1.  Installation

    npm i ng2-tooltip-directive

2. Import Ng2Module

import { TooltipModule } from 'ng2-tooltip-directive';

  @NgModule({

imports: [ TooltipModule ]

})

3. Usage

Options can be set in the directive tag, so they have the highest priority.

<span tooltip="Tooltip" placement="top" show-delay="500">Tooltip on top</span>

may pass as an object:

<span tooltip="Tooltip" [options]="myOptions">Tooltip on left</span>

myOptions = {

'placement': 'left',

'show-delay': 500

}

Pass HTML as content:

<span tooltip="<p>Hello i'm a <strong>bold</strong> text!</p>">

  Tooltip with HTML content

</span>

<ng-template #HtmlContent>

  <p>Hello i'm a <strong>bold</strong> text!</p>

</ng-template>

 <span [tooltip]="HtmlContent" content-type="template">

  Tooltip with template content

</span> 

Full Stack Developer

 1. Front End Developer

     a. HTML

     b. CSS

     c. JS

     d. Any one Library

          i. React JS

  ii. Angular

  iii. Vue.js

2. BackEnd Developer (Any One)

a. PHP

b. JAVA

c. Node JS

d. GO

e. C#

f. Phython

4.  Database Server (Any One)

a. Mysql

b. Oracle

c. Mongo DB

5.  DEVOPS ( Any One )

a. DOCKER

b. JENKINS

c. GITLAB CL

Saturday, January 30, 2021

Top 20 Algorithms Every Programmer Should Know

 Searching

1. Linear Search

2. Binary Search

3. Breadth First Search (BFS)

4. Depth First Search (DFS)

Sorting

5. Merge Sort

6. Quick Sort

7. Insertion Sort 

8. Selection Sort 

9. Counting Sort 

10. Heap Sort

11. Topological Sort

12. Kahn’s Topological Sort

Arrays

13. KMP

14. Kadane’s 

15. Quickselect

16. Floyd’s Cycle Detection

17. Boyer–Moore Majority Vote

Basic Algo

18. Euclid’s

19. Union Find

20. Huffman Coding Compression

Monday, January 25, 2021

How to build an Angular 8 app from scratch in 11 easy steps


Step 1 — Installing Angular CLI 8


Step 2 — Creating your Angular 8 Project


Step 3 — Adding Angular HttpClient


Step 4 — Creating Components


Step 5 — Adding Routing


Step 6 — Building the UI with Angular Material Components


Step 7 — Mocking a REST API


Step 8 — Consuming the REST API with Angular HttpClient


Step 9 — Handling HTTP Errors


Step 10 — Adding Pagination


Step 11 — Building and Deploying your Angular Application to Firebase



Reff : https://www.freecodecamp.org/news/angular-8-tutorial-in-easy-steps/