Angular JS 1.6 – server side pagination with sorting using Angular UI Bootstrap

Angular 1.6 SPA server side pagination of data with sort. To create a SPA which lists user data with pagination  and sorting we need the following CDN links – Angular JS 1.6.9 js CDN. – Angular JS UI bootstrap -Bootstrap components written in pure AngularJS . – Bootstrap CSS file. STEP 1 – Create file index.html and add the relevant CDN links using the following codes.

STEP 2 – CREATING ANGULAR MODULE and DEFINE THE APP create, register and retrieve Angular JS module using the following code.The name of the module is ‘userLog’.

and in the HTML.

STEP 3 – DEFINE THE CONTROLLER AngularJS applications are controlled by controllers. The ng-controller directive defines the application controller.The name of the controller here is ‘listController’.In HTML , add the following code

STEP -4 CREATING SERVICES AND INJECTING THEM In this example we will create two services one for getting the total number of users and other for getting the data each page.The name of the first service is ‘count’ and name of the second service is ‘getloglist’

Services in both cases send HTTP requests to the APIs.For this we inject $http service.The $http service get takes a single argument which…

Creating a Cron job in Laravel 5.2 :Task Scheduling
Beginner , PHP , Snippets / July 23, 2018

To create a cron job in Laravel 5.2 ,move to the app/console/ folder.The console folder contains all the relevant configuration files and folders for you to create a custom artisan command in Laravel 5.6 .  After creating the custom artisan command ,we can schedule the command to be run in specific intervals Step 1 Run

  to create new custom artisan command,This will generate a class called app/Console/Commands/CronJob.php.The newly generated file will have the following structure.You have to fill in name and description variables in the file.You can use the DB and MODEL files from CronJob.php. The file extends the Command Class   app/Console/Commands/CronJob.php

Here we select a set of users based on some custom criteria from the users table and do something to them periodically with the cron job.The action for the should be written in the CronJob.php – handle() function.The class defines our command.To run this need to use the following php artisan cronjob Step 2 Scheduling the job To schedule the when to run the command we have created open the kernel.php file in the app/console/ folder app/console/kernel.php

The kernel class extends ConsoleKernel .To add the commands

and to schedule the command

  This runs…

Understanding Callbacks and Callback hell in JavaScript : asynchronous behaviour of Javascript Part -1

In  most programming languages , functions can accept other function(s) as arguments or return a function .Such functions are called Higher order functions. In JavaScript most APIs and Modules can accept function as an argument to a function .The functions are called  callbacks. Structure of callbacks

Note that JavaScript functions behave as objects.We can set a function as an object property or store a function into a variable. JavaScript is a non-blocking programming language.It doesn’t wait or block  an operation to finish but keeps on  executing.For example consider the case when data is fetched asynchronously,then javascript doesn’t wait for the asynchronous call to get data but  keeps executing the next line of code.So in order to do something with the data we can use callbacks.See the below example in which we use a setimeout to wait for the data just like an XHR request which may take some time to complete

Asynchronous callback with  Jquery and a callback function

  CALLBACK HELL Consider the above example in which we use a callback function which is passed as an argument to the $.get function in Jquery. Now what happens when we want to send subsequent requests is that the code becomes unreadable…

How to display user – display name,avatar and logout button in WordPress : Example
Beginner , PHP , Snippets , Wordpress / July 8, 2018

To display user displayname , avatar and provide a logout button for a user in your wordpress site,we can use the following  five worpress functions. is_user_logged_in () –  Check whether used in. wp_get_current_user(id/email,null)  –  Get current logged in user get_avatar_url(userid) – Get avatar url for current user using userid wp_logout_url(url) – Logout and redirect URL home_url() – Get your home URL  

  Check below links to see documentation in full https://developer.wordpress.org/reference/functions/is_user_logged_in/ https://developer.wordpress.org/reference/functions/wp_get_current_user/ https://developer.wordpress.org/reference/functions/get_user_by/ https://developer.wordpress.org/reference/functions/wp_logout_url/        

first-child and nth-child selectors : Styling multiple Elements with same class – CSS
Beginner , css , Uncategorized / July 7, 2018

first-child  – This selector selects first child of its parent. To color first one of elements with the same class,we use first-child selector.Consider below example with multiple divs(.box)  inside parent div(.container).To change the style of first div

  nth-child – This selector selects nth child of its parent. We can achieve the above result using nth-child selector .The number in the bracket indicates the order of the child

 

Event propagation in javascript – Capturing and Bubbling

Event propagation is the propagation of an event through the elements in the HTML DOM. When an event happens phase1 – Event Capturing is done until the target is reached phase2 –  Bubbling is done executing handlers on the way Event bubbling and capturing are the two ways of event propagation in processing an event by the HTML DOM API.Event bubbling means that when an event happens, it propagates all the way up the parent to the ancestor elements. Bubbling When an event happens on an element,say click, it first runs the handlers on it, then on its parent, then all the way up.See the below example -The button inside the wh4 div was clicked. Onclick handler is on the ancestor wh4 is run.   Not every event get bubbled.Here is a list of  the most common event handlers. onAbort onBlur onChange onClick onDblClick onDragDrop onError onFocus onKeyDown onKeyPress onKeyUp onLoad onMouseDown onMouseMove onMouseOut onMouseOver onMouseUp onMove onReset onResize onSelect onSubmit onUnload Not every event bubbles.

If x is true then the event bubbles.You can check this creating the event By default all the Browsers support event bubbling. Event Capturing When an event happens capturing occurs in a way …

Closures in JavaScript

A closure is the combination of a function and the lexical environment within which that function was declared. We will take a detailed look in to closures using the following examples.

In this example,you can see that variable a is in Global scope.The variable a is available inside the example() function so that , we don’t have to pass it as an argument to the example() function. Now if you do a console.dir on the function example() (console.dir is the way to see all the properties of a specified javascipt) ,you can see that there is a scope property which has global value a. CLOSURE Now,we define a function inside a function and do the same addition operation given in the previous example.Here the scope of variable a and variable passed ,is the function example().The variable a and variable passed is available inside the inner function exampleinner().

If you do a console.dir on the inner function exampleinner(), we can see that there is a property called closure which has the values of variable passed and variable a.   So what closure means is that the inner function will have access to the scope of the outer function(FUNCTION INSIDE FUNCTION)…

What are cookies and how to set and get them with Javascript

Cookies are data stored as text files in the computer.They are used store data that are needed to be remembered , like user information.Cookies can be set in client side and server side. For example,consider a user sign in to your website.The server sends back some response.The response have a token/id that can be stored as a cookie.This cookie value can keep the users details status in the client side. Cookie has a name and value pair,expiry time,path and secure . The security flags that are used to provide more security HttpOnly – HttpOnly flag sets the cookie unavailable to client side scripts.This prevent cross site scripting attacks(XSS) secure – Sets cookie to be send via a secure encrypted channel.Browser will send cookie only via an HTTPS request and prevent sending cookie via HTTP request. setcookievalue This function has three arguments name – cookie name. value – value of the cookie. hours- hours determine the expiry hours. document.cookie lets us store the cookie associated with the current document. getCookie This function has one argument ,cookie name document.cookie gets all the cookies associated with the current document.A cookie with a specific name can be obtained using the getCookie function.   getCookievalue This function has…

Share this page in social media platforms