How to add innerHTML or Multi line text to NgbPopover

I was trying to show multi line text on Popover and want to format my display contain as I want using HTML tag. text construction has to be done in .ts file.

I achieved this in following way.

Label where, on mouseover I want to show popover with employee detail data.

I want when use mouseover then popover display and if user click outside or click “esc” then popover disappears. You can also use moverover and mouse leave using triggers="mouseenter:mouseleave"

npm install --save @ng-bootstrap/ng-bootstrap

app.module.ts

//Popover- menu item

import { NgbPopoverModule, NgbModalModule, NgbAlertModule } from '@ng-bootstrap/ng-bootstrap';

@NgModule({imports: [NgbPopoverModule]})

Employee.html file 

 <label id="EmployeeProfile" class="readmore-p"           

            name="EmployeeProfile "

(mouseover)="getEmployeeProfileData()"

            [ngbPopover]="ShowEmployeeProfile" 

popoverTitle="Employee Detail Profile"

            triggers="mouseenter" [autoClose]="'outside'">
</label>

 <ng-template #ShowEmployeeProfile >

 <div[innerHtml]="employeeDetailDataForToolTip"</div>
</ng-template>

Employee.ts file

employeeDetailDataForToolTip: string ="";

getEmployeeProfileData(): string

{
this.employeeDetailDataForToolTip="";
this.employeeDetailDataForToolTip+='<ul><u>Ritesh Kesharwani</u>';
this.employeeDetailDataForToolTip+='<li>Address: Mile City, USA</lt;li>';
this.employeeDetailDataForToolTip+='<li> Department: Education</li>';
this.employeeDetailDataForToolTip+='<li> Salary: $300000</li>';
this.employeeDetailDataForToolTip+='<li> Base Location: MN</li></ul>'
}

If you want scroll bar on Popover then you need to override style sheet
.popover {

  max-width: 500px !important;

  background: #F9F9F9 !important;

  max-height: 400px !important;

  overflow: scroll !important;

}

sample pop over on label mouse over 

During Test Debug control not hits to the break points + Not able to debug test case

Go to the project property > Build and Uncheck following

• Allow unsafe code
• Optimize Code

 And Select Platform target: Any CPU

Error: testhost.x86.exe' has exited with code 0 (0x0).

Error: testhost.x86.exe' has exited with code 0 (0x0).

After my research I found, below nuget package was missing from my project.

I have installed below and it resolved the issue.

MSTest.TestFramework

Make sure following package are installed in your test project

MSTest.TestFramework And MSTest.TestAdapter

Render Date field in specific Date Format into ag-Grid Angular 6

In you ag-Grid if you want to display date field in specific format do the following steps

1. npm Install moment --save
2. in your .ts file use below

 import * as moment from 'moment';

columnDefs =

[{

headerName: 'Effective Start Date', field: 'EffectiveStartDate',

cellRenderer: (data) => {

return  data.value ? (moment(data.value).format('MM/DD/YYYY')) : '';}

}];

For more info on moment please use https://momentjs.com/

Add hyperlink click event into ag-Grid Angular 6

I had spent lots of time to figure how to add hyperlink into ag-grid column and how to call function executed at on click event. This was looking very difficult but later it came with very simple solution.

My requirement was to add hyperlink on Grid column with the rendered data, so no button where we have static word like “Add” etc.

Simple solution I could figure out is to add cellClicked event

.html page

<ag-grid-angular

    (cellClicked)='onCellClicked($event)'>

</ag-grid-angular>

And when cellClicked   by user execute Type Script function

.ts page

onViewCellClicked(event: any)

  {

    if (event.column.colId =="FirstName" ) // only first column clicked

    {

      // execute the action as you want here in on click of hyperlink

    }

// here you can add multiple if statement based on colId to do the action      //on cell clicked

  }

Your column definition as below

columnDefs = [{

headerName: 'First Name', field: 'FirstName', suppressMenu: false, unSortIcon: true, width:150,

      cellRenderer: function(params) {

        // below line is just to create empty without any action hyperlink

// to trick the user, but actual action happen onViewCellCliced() // function

        return '<a href="#">' + params.value + '</a>';

            },

            tooltipField: "FirstName", headerTooltip: "First Name"     

      }];

Error: 'IApplicationBuilder' does not contain a definition for 'UseIdentityServerAuthentication' and...

When I was trying to implement security to one of my .net core Web API, I encountered below error

'IApplicationBuilder' does not contain a definition for 'UseIdentityServerAuthentication' and no extension method 'UseIdentityServerAuthentication' accepting a first argument of type 'IApplicationBuilder' could be found (are you missing a using directive or an assembly reference?)

After long struggle, I found that .Net Core 2.0 does not support the security the way .NET Core 1.0 used to support, Code need to rewritten in different way, actually need to follow the steps to migrate your Web API to .NET Core 2.0 using Microsoft.AspNetCore.Authentication.JwtBearer; 

Please follow migration steps to resolve this issues
https://elanderson.net/2017/09/identity-server-api-migration-to-asp-net-core-2/

$window.open('url') directs to currenthost + url instead of just url in AngularJS

Issues:When I am trying following code in AngularJS, it works but opening new window with url like below 

http://localhost/pages/www.facebook.com

JS File

  $scope.OpenWindow = function (url, _blank) {

         window.open(url, '_blank', 'heigth=600,width=600');

     }

HTML File

 img class="FacebookIcon" ng-click="OpenWindow('www.facebook.com')"

Solution: Add 'http://' in the url

JS File

  $scope.OpenWindow = function (url, _blank) {

         window.open( "http://" + url, '_blank', 'heigth=600,width=600');

     }

It will work and open  https://www.facebook.com

.NET Core 1.0.1 Entity Framework – Scaffolding

If you are using .NET Core version 1.0.1, you might have faced some issues to auto-generate database context and Model. There is one more option available to generate database context using command prompt.  

But you have to take care of adding supported/matched DLL reference from Nuget/Nexus.

Go to “project.json” file and make sure you have added following references

"dependencies": {     "Microsoft.NETCore.App": {       "version": "1.0.1",       "type": "platform"     },     "Microsoft.AspNetCore.Diagnostics": "1.0.0",     "Microsoft.AspNetCore.Server.IISIntegration": "1.0.0",     "Microsoft.AspNetCore.Server.Kestrel": "1.0.1",     "Microsoft.Extensions.Logging.Console": "1.0.0",     "Microsoft.Entityframeworkcore.Sqlserver": "1.0.0",     "Microsoft.EntityFrameworkCore.SqlServer.Design": "1.0.0",     "Microsoft.EntityFrameworkCore.Design": "1.0.0-preview2-final"   },   "tools": {     "Microsoft.EntityFrameworkCore.Tools": "1.0.0-preview2-final",     "Microsoft.AspNetCore.Server.IISIntegration.Tools": "1.0.0-preview2-final"   },

Now go to the folder where “project.json” file exist and open command prompt.

1. Generate database Model for selected table only

                C:/Ritesh/EFScafoldingDemo:> dotnet ef dbcontext scaffold “Server={db server name},{port number};Database={db name};Trusted_Connection=True;” Microsoft.Entityframeworkcore.Sqlserver –t “Product”,”Order”

1. Generate entire database Model    

C:/Ritesh/EFScafoldingDemo:> dotnet ef dbcontext scaffold “Server={db server name},{port number};Database= db name};Trusted_Connection=True;” Microsoft.Entityframeworkcore.Sqlserver

There are multiple option available to generate database model for .NET Core entity framework, you can see from Microsoft site for more detail

After above command executed successfully you can see, dbProductContext.db , Product.cs, Order.cs files.

.NET Core or .NET Framework, What is right for your application?

.NET Framework and .NET Core are two choices for building .NET server-side applications. Both share a lot of the same .NET platform components and you can share code across the two. However, there are fundamental differences between the two and based on what you want to accomplish, your requirement your choice will depend. 

You should use .NET Core for your server application when:

• You have cross-platform needs.
• You are targeting microservices.
• You are using Docker containers.
• You need high performance and scalable systems.
• You need side by side of .NET versions by application.

You should use .NET Framework for your server application when:

• Your application currently uses .NET Framework (recommendation is to extend instead of migrating)
• You need to use third-party .NET libraries or NuGet packages not available for .NET Core.
• You need to use .NET technologies that are not available for .NET Core.
• You need to use a platform that doesn’t support .NET Core.

Ref: https://docs.microsoft.com/en-us/dotnet/standard/choosing-core-framework-server

Steps require to host your application into the Pivotal Cloud Foundry

Host your application into the Pivotal Cloud Foundry PCF

Register in Pivotal and go to “Pivotal Web Services”, you will get free trial upto 2 GB

https://account.run.pivotal.io/z/uaa/sign-up

 If you already have an account in PCF then Login using 

https://login.run.pivotal.io/login With User Id: Email Id and Pwd: Password

You will need a workspace where app can be hosted, for that you need to create Organization and then Workspace

Go to Given/Created Org >> Click Add Space >> create new space for you

For CF push to work, you will need manifest.yml file to be a part of your app’s output folder.

Sample manifest.yml file content

.NET Framework aAps, yml file 

--- applications: - name: RiteshWebAPI   memory: 512m   disk_quota: 512m     buildpack: binary_buildpack   stack: windows2012R2  env:     ConnectionString: @SQLConnectionString@     App_Log: @AppLogConnection@  services:    - syslog-drain routes:    - route: @route@ instances: @instances@

.NET Core Apps,  buildpack and stack will be changed , run > cf buildpacks or > cf stacks to see available buildpack and stack in PCF environment.

        buildpack: dotnet_core_buildpack
        stack: cflinuxfs2

Build your App, WebAPI, WebApp etc. Following things needs to be taken care while code, Code need to follow 12 factor app https://12factor.net/
Best Practices for ASP.Net application Application Types: MVC, WebForm, WebAPI, WCF

• Avoid Integrated Windows Authentication
• Avoid the Global Access Cache (GAC)
• Avoid custom IIS handlers
• Avoid anything that uses the Windows registry
• Avoid using local disk for storing application state. Any data that needs to persist needs to be stored in backing service. Ex.  Database (SQL Server,Mongo DB)
• Avoid in process session state.
• For ASP.NET override MachineKey in web.config and on ASP.NET Core
• Avoid persisting keyring to filesystem
• On ASP.NET avoid environment specific configuration in web.config      
• Avoid using any Windows specific or disk based logging
• Avoid any 32-bit specific libraries or libraries that cannot be bin deployable.

Once your App is ready you can publish it in some folder let’s say “C:\Ritesh\WebAPIPublish\”

  

First steps to start your deployment into the PCF, you need Common Language Interface (CLI) Download CLI from below

https://docs.cloudfoundry.org/cf-cli/install-go-cli.html

Now, Open Command Prompt (cmd), type following commands to login

Login By Browser URL: https://login.run.pivotal.io/login

Login By CLI URL: https://api.run.pivotal.io/

Start Login by command prompt, Go to the directory where you have published your source code (make sure this folder has all required files to run the app, including “.yml” file

C:\Ritesh\ WebAPIPublish> cf login -a https://api.run.pivotal.io/

Email> UserId

Password> Password

Space> 1        // if multiple space available, you need to choose desire space

Now you are ready to start the deployment

C:\Ritesh\WebAPIPublish> cf push

If error pops up go and see the log

C:\Ritesh\WebAPIPublish> cf log   - recent

If log shows that health check fail than turn off health check up

C:\Ritesh\WebAPIPublish> cf push --health-check-type=none

Let’s wait till you see application started message

1 of 1 instance running

OK

After successfully deployed you can login online and get the URL and you can use it to access your app like: https://riteshwebapi.cfapps.io

References:
https://pivotal.io/platform/pcf-tutorials/getting-started-with-pivotal-cloud-foundry/deploy-the-sample-app
https://pivotal.io/platform

Best way to understand Bubble sort and Insertion Sort Algorithm

Bubble Sort 

Below image will describe how bubble sort code work when code execute in loop, below pictures are self explanatory for algorithm steps. 

C# Code
public int[] BubbleSort(int[] val)
{
           bool flag = true;
           int temp;

           for (int i =0;(i<=val.Count()-1) && flag; i++)
           {
               flag = false;
               for (int j = 0; j < val.Count()-1; j++)
               {
                   if (val[j + 1] < val[j])
                   {
                       temp = val[j + 1];
                       val[j + 1] = val[j];
                       val[j] = temp;
                       flag = true;
                   }
               }
           }
           return val;
}

Insertion Sort

Faster than bubble sort

C# Code
public int[] InsertionSort(int[] val)
{
           for (int i = 0; i <= val.Count(); i++)
           {
               int temp = val[i];
               int j = i - 1;

               while (j >= 0 && val[j] < temp)
               {
                   val[j + 1] = val[j];
                   j--;
               }
               val[j + 1] = temp;
        }
           return val;
}

.NET Core Error: /Core and /WepApp.deps.json could not be found

When I tried to run my first .NET Core web application, I found wired issues and it took me longer time to figure out, what is actual issues was, error message was not helping at all to find out the solution

.NET Core Error: <<Project Dir Path>>/Core and <<Project Dir Path>>/WepApp.deps.json could not be found

To find out the solution, I started couple of times from scratch and finally I tried with different directory and file name to save my .NET Core project.

Issues:
Previous Project Path was:  C:\Ritesh\NET Core\Core WebAPP

Solution:
Later Project Path (works): C:\Ritesh\NETCore\CoreWebApp  (NO SPACE in dir name and file name)

It's works for me, I don't know this is the really solution or Microsoft need to release some patch to fix this.

Parameters needs to be considered before choosing REST or SOAP

There are many parameter needs to be considered before choosing REST or SOAP like

Performance & Scalability

• REST has better Performance and Scalability features. Read operation in REST can be cached whereas SOAP based read cannot be cached.
• REST service is good when we have limited bandwidth and have requirement to accomplish by simple CRUD based operation.

Security

• Provide more choice for implementing security beyond the standard SSL support by implementing WS-Security standard

Transaction Support

• SOAP can support distributed two-phase commit transactions by implementing WS-Atomic standards.
• REST does not support transaction

Extended Client Support

• REST allow better support for browser and mobile clients due to its support for JSON.

Extended Data Format Support

• REST allows many data format like JSON, XML, Text, SOAP only support XML which require more bandwidth to pass data through wire

Multiple Protocol Support

• SOAP service can use any transport protocol such as HTTP, HTTPS, TCP, SMTP, and MSMQ. REST only support standard HTTP and it is much easier to implement, simple methods to call GET, PUT, POST and DELETE.

Error Handling

• REST support standard HTTP error handling but SOAP provide more robust error handling including user define error handling.

Summary

REST	SOAP
Expose the data	Expose the logic
Support multiple Data format, JSON, XML, HTML, Text etc.	Support only XML
Support only Http, Https protocol	Support multiple protocol; Http, Https, TCP, UDP SMTP, Messaging etc.
Support for Transaction Management but not ACID compliance or two-phase commit transaction.	Better support for transaction management Support, ACID and two-phase commit transaction by implementing WS-Atomic Standard
Need less band width	Need more band width because of XML
Suited for stateless CRUD operations	Suited for Stateful operation, Easy to configure session support
Less support for Security Supports only point-to-point SSL security. The SSL encrypts the whole message, whether all of it is sensitive or not.	SOAP WS has Better support for Security Both SSL security and WS-security
Better Support for browsers and mobile client, Because of Lightweight	Limited browser support
Read operation can be cached	Read Operation cannot be cached
Support for better performance and scalability	Performance is less as compare to REST
Support only HTTP error Handling	Support robust error handling including user define error handling
Only support Synchronous message	Can support Synchronous and Asynchronous both messages