Posts

AngularJS Forms

Image
           Using Forms in AngularJS   Forms are used to accept data from the user. In angular, you can create 2 types of forms      1. Template driven forms.      2. Reactive forms.   In this blog, you are going to learn How to create AngularJS Template driven forms. So First of all   1. Create an App         C:\> ng new forms-app         C:\> cd  forms-app 2. Create a component test         C:\> forms-app>  ng generate component test     3. Configure forms in app.module.ts file. import { Component, NgModule, OnInit } from '@angular/core' ; import { BrowserModule } from '@angular/platform-browser' ; import {FormsModule, NgForm} from '@angular/forms' ; import { AppRoutingModule } from './app-routing.module' ; import { AppComponent } from './app.component' ; import { TestComponent } from './test/te...

Component Parent Child communication

Image
    Sending data to a Child Component Configuring the child component import Input and then decorate the property with @Input(), as in the following example.   src/app/item-detail/item-detail.component.ts import { Component, Input } from '@angular/core' ; // First, import Input export class ItemDetailComponent { @ Input() item = '' ; // decorate the property with @Input() }      Next, in the child component template, add the following: src/app/item-detail/item-detail.component.html <p> Today's Product is : {{item}} </p>   Use property binding to bind the item property in the child to the currentItem property of the parent. src/app/app.component.html   <app -item-detail [ item ]=" currentItem " > < /app-item-detail> In the parent component class, designate a value for currentItem: src/app/app.component.ts   export class AppComponent { currentItem = 'Television' ; }         Result: it...

Searchable Select with Select2 Plugin

Image
  Searchable Dropdown Demo   Select2 plugin is a jQuery based plugin and replacement for select boxes. It supports searching in the list, finding remote data sets, and pagination (infinite scrolling) of results. Select2 supports the ability to add options dynamically as the user is typing into the search field. It also supports multi-value select boxes. In this tutorial, You are going to learn how to create a basic version of dropdown with a search box using the select2 plugin and read the selected option and print it in PHP.   Step-1 First, create a PHP page withe name index.php with a basic HTML code and add the following links in head section.: <!-- jQuery --> <script src= "https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js" ></script> <!-- Select2 plugin --> <link href= "https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel= "stylesheet" /> <script src= "https...