Quantcast
Channel: Ionic Forum - Latest topics
Viewing all 70435 articles
Browse latest View live

Ionic 4 animation

$
0
0

@ymongo wrote:

Hi there, I’m new to Ionic and Angular. I’m playing with the sidemenu basic templarte app.

If I add a in the toolbar on top of “List” page, I’d like the animated transition to be a slide to the side back to “Home” instead of the current kind of fade out to “Home”.

How can I change this animation? Thanks for the great work!

Posts: 1

Participants: 1

Read full topic


Toast.present is not a function

$
0
0

@fahd123 wrote:

I have Problem in toast.present();

My code Html

type or paste code here
```<ion-content padding>
  <form (ngSubmit)="FormReg()" padding>
    <ion-item>
      <ion-label>Email</ion-label>
      <ion-input type="email" [(ngModel)]="todo.email" name="email"></ion-input>
    </ion-item>
    <ion-item>
      <ion-label>Password</ion-label>
      <ion-input [(ngModel)]="todo.pw" name="pw"></ion-input>
    </ion-item>
    <ion-item>
      <ion-label>Confirm password</ion-label>
      <ion-input [(ngModel)]="todo.confirm_pw" name="confirm_pw"></ion-input>
    </ion-item>
    <ion-button ion-button type="submit" color="primary" expand="full">Sign In</ion-button>
  </form>
</ion-content>

My code ts

```import { Component, OnInit } from '@angular/core';

import { HttpClient } from '@angular/common/http'

import {  ToastController } from '@ionic/angular';

@Component({
  selector: 'app-register',
  templateUrl: './register.page.html',
  styleUrls: ['./register.page.scss'],
})
export class RegisterPage implements OnInit {

  constructor(
    private http:HttpClient,
    public toastController: ToastController,
    ) 
    { }


  ngOnInit() {
  }

  
  FormReg(){
  
    let toast = this.toastController.create({
      message: 'Toast Message',
      duration: 3000
    });
    toast.present();

  }

}

Posts: 2

Participants: 2

Read full topic

Importing custom web component into Ionic

$
0
0

@ollie-w wrote:

Is there any documention about how to import and use a custom web component into Ionic 4?

I made a web component with Stencil and put it on NPM. I have done an NPM install in my Ionic app but can’t figure out how to use it.

Posts: 1

Participants: 1

Read full topic

Cannot use ion-nav.getByIndex() in ionic-angular

$
0
0

@bandito wrote:

Cannot use ion-nav.getByIndex() in ionic-angular v4.

constructor(public navCtrl: NavController){}

getByIndex(){
    console.log( this.navCtrl.getByIndex() );
}

I get this message in the Console:


**ERROR in src/app/editevent/editevent.page.ts(316,42): error TS2339: Property 'getByIndex' does not exist on type 'NavController'.**

Can you actually use this in Angular? The docs are not clear at all.

Posts: 1

Participants: 1

Read full topic

POS Thermal Printer (Customize the Content)

$
0
0

@fordyfy wrote:

Good Day! I need your help for my Ionic project. How can I customize the content of the receipt in pos thermal printer via bluetooth? I want to adjust the font size, the font format and make it center and other stuff. I can print text but I don’t know how to format it.

here’s the plugin that is used https://github.com/razmans/ionicBluetoothPrint

testPrint(bluetooth_address)
  {
    let header = "PCG Cellphone Shop \n Plaza Burgos, Guagua, Pampanga \n (Beside Generika) \n \n Smart Padala No. \n 5577-5194-0426-6109 \n 5577-5194-0426-7109 \n 0999-3209009"
    let cashierCustomerInformation = "Cashier: PCG Sakes POS \n POS: SP POS 1 \n \n  Customer: Nora B. Beiza \n 09430359637"
    let topTransactionInformation = "Receive - Smart Padala \t 2,000.00 \n 1 x 2,000.00 \n" 
    let midTransactionInformation = "1 x 2,000.00 \n 20Jan 10:19: Received P2,000.00 with P23.00 commission from 09393965558 to PCG LA.LIBRE ang pag-claim! Ref:174813715fdf Bal:P16,297.84"
    let bottomTransactionInformation = "03. 1,5000.01 to 2,000 \t 0.00 \n Recieve Charge \n 1x0.00"
    let totalInformation = "Total \t 2,000.00 \n Cash 2,000.00"
    let footer = "\tThank you for choosing \t \n \t Smart Padala! \n 1/20/19 5:03 PM \t #1-1620"
    let printData= header +cashierCustomerInformation + topTransactionInformation + midTransactionInformation 
    + bottomTransactionInformation + totalInformation + footer

    let xyz=this.connectBT(bluetooth_address).subscribe(data=>{
      this.btSerial.write(printData).then(dataz=>{
        console.log("WRITE SUCCESS",dataz);

        let mno=this.alertCtrl.create({
          title:"Print SUCCESS!",
          buttons:['Dismiss']
        });
        mno.present();

        xyz.unsubscribe();
      },errx=>{
        console.log("WRITE FAILED",errx);
        let mno=this.alertCtrl.create({
          title:"ERROR "+errx,
          buttons:['Dismiss']
        });
        mno.present();
      });
      },err=>{
        console.log("CONNECTION ERROR",err);
        let mno=this.alertCtrl.create({
          title:"ERROR "+err,
          buttons:['Dismiss']
        });
        mno.present();
      });
  }

Posts: 1

Participants: 1

Read full topic

Navigate to combobox selected item

$
0
0

@aseelali23 wrote:

I have a combobox containing 3 options. Each option contains names of each page. So when I select one of the option and click the next button I need to move to the respective page. How can I do that?
pls help
here is my code:
html:

<ion-header>

    <ion-navbar>
        <ion-title>REGISTRATION</ion-title>
    </ion-navbar>
</ion-header>

<ion-content>
    <h1>Step 1 : Choose the category</h1>
    <ion-item>
        <ion-label>Category</ion-label>
        <ion-select [(ngModel)]="category">
            <ion-option value="i">Individual</ion-option>
            <ion-option value="t">3rd party</ion-option>
            <ion-option value="d">Dedicated</ion-option>
        </ion-select>
    </ion-item>

 
</ion-content>
<ion-footer no-shadow class="foot">
    <ion-toolbar position="bottom">
        <button (click)="rg()" ion-button full color="primary" block>Next</button>
    </ion-toolbar>
</ion-footer>

ts file:

import { Component } from '@angular/core';
import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular';
import { ObsAuthService } from '../../services/obs_auth.services';
import { ConnectrgPage} from '../connectrg/connectrg';
import { IndividualregPage } from '../individualreg/individualreg';
import { NgModel } from '@angular/forms';
import { NgIf } from '@angular/common';

@Component({
    selector: 'page-connectreg',
    templateUrl: 'connectreg.html',
    providers: [ObsAuthService]
})
export class ConnectregPage {
    

    
    constructor(private nav: NavController, private auth: ObsAuthService,
        private alertCtrl: AlertController, private loadingCtrl: LoadingController) {}

        selectChange(e) {
            console.log(e);
        }
        
        public rg(){
            
            this.nav.push(IndividualregPage);
        }
    }

Posts: 1

Participants: 1

Read full topic

Error: EPERM: operation not permitted, open 'F:\projects\www\build\15.js'

$
0
0

@rajputsachin wrote:

{ Error: Failed to clean directory F:\projectname\www\build - EPERM: operation not permitted, lstat ‘F:\projectname\www\build\15.js’
at new BuildError (F:\IndiansInCA\node_modules@ionic\app-scripts\dist\util\errors.js:16:28)
at F:\IndiansInCA\node_modules@ionic\app-scripts\dist\clean.js:15:32
at new Promise ()
at Object.clean (F:\IndiansInCA\node_modules@ionic\app-scripts\dist\clean.js:7:12)
at buildProject (F:\IndiansInCA\node_modules@ionic\app-scripts\dist\build.js:99:13)
at F:\IndiansInCA\node_modules@ionic\app-scripts\dist\build.js:89:42
at step (F:\IndiansInCA\node_modules@ionic\app-scripts\dist\build.js:32:23)
at Object.next (F:\IndiansInCA\node_modules@ionic\app-scripts\dist\build.js:13:53)
at fulfilled (F:\IndiansInCA\node_modules@ionic\app-scripts\dist\build.js:4:58)
at hasBeenLogged: false, isFatal: false }

please provide me solution for this thanks.

Posts: 1

Participants: 1

Read full topic

How to stop going back

$
0
0

@MaBbKhawaja wrote:

hi I am using ionic 4 and navigating to next pages using angular routing i have a sign in page when i run it in mobile and sign in it displays next page but when i press back button on my mobile it takes me back to log in page I want to disable going back to sign in page and only go back to sign in page when i press logout button which i already have set in my app … can anyone help ?

Posts: 2

Participants: 2

Read full topic


Auto fill the above input details

$
0
0

@aseelali23 wrote:

I have certain input fields like address zip code etc… And below I have same fields but as heading communication address and above that i have a check box as same as above. So when I tick that checkbox i need to autofill the above content beow here. I need also the combobox items too. Pls help.
here is my code:
html:

<ion-header>

    <ion-navbar>
        <ion-title>INDIVIDUAL REGISTRATION</ion-title>
    </ion-navbar>
</ion-header>
<ion-content>
    <form [formGroup]="formind">


        <ion-item>
            <ion-label>Select Center <span class="required">*</span></ion-label>
            <ion-select interface="popover">
                <ion-option value="nes">NES</ion-option>
                <ion-option value="n64">Nintendo64</ion-option>
                <ion-option value="ps">PlayStation</ion-option>
                <ion-option value="genesis">Sega Genesis</ion-option>
                <ion-option value="saturn">Sega Saturn</ion-option>
                <ion-option value="snes">SNES</ion-option>
            </ion-select>
        </ion-item>
        <ion-item>
            <ion-label>DOB <span class="required">*</span></ion-label>
            <ion-datetime displayFormat="MMM DD YYYY"></ion-datetime>
        </ion-item>

        <ion-list radio-group name="gender" id="gender">
            <ion-list-header>Gender</ion-list-header>
            <ion-row>
                <ion-col>
                    <ion-item>
                        <ion-label>Male</ion-label>
                        <ion-radio value="male"></ion-radio>
                    </ion-item>
                </ion-col>
                <ion-col>
                    <ion-item>
                        <ion-label>Female</ion-label>
                        <ion-radio value="female"></ion-radio>
                    </ion-item>
                </ion-col>
            </ion-row>
        </ion-list>

        <ion-label class="add">Permanent Address : <span class="required">*</span></ion-label>

        <ion-item>
            <ion-label stacked>Address 1</ion-label>
            <ion-input formControlName="add1" type="text"></ion-input>
        </ion-item>
        <ion-item>
            <ion-label stacked>Address 2</ion-label>
            <ion-input formControlName="add2" type="text"></ion-input>
        </ion-item>
        <ion-row>
            <ion-col>
                <ion-item>
                    <ion-label floating>Zipcode</ion-label>
                    <ion-input formControlName="zip" type="text"></ion-input>
                </ion-item>
            </ion-col>
            <ion-col>
                <ion-item>
                    <ion-label floating>District</ion-label>
                    <ion-select interface="popover">
                        <ion-option value="nes">Trivandrum</ion-option>
                        <ion-option value="n64">Ernakulam</ion-option>
                        <ion-option value="ps">Thrissur</ion-option>
                    </ion-select>
                </ion-item>
            </ion-col>
        </ion-row>
        <ion-row>
            <ion-col>
                <ion-item>
                    <ion-label floating>State</ion-label>
                    <ion-select interface="popover">
                        <ion-option value="nes">Kerala</ion-option>
                        <ion-option value="n64">Tamil Nadu</ion-option>
                        <ion-option value="ps">Karnataka</ion-option>
                    </ion-select>
                </ion-item>
            </ion-col>
            <ion-col>
                <ion-item>
                    <ion-label floating>Country</ion-label>
                    <ion-select interface="popover">
                        <ion-option value="nes">India</ion-option>
                        <ion-option value="n64">China</ion-option>
                        <ion-option value="ps">USA</ion-option>
                    </ion-select>
                </ion-item>
            </ion-col>
        </ion-row>
        <ion-item>
            <ion-label class="add">Address Proof: <span class="required">*</span></ion-label>
            <ion-icon name="document" item-end></ion-icon>
        </ion-item>

        <ion-label class="add">Communication Address : <span class="required">*</span></ion-label>
        <ion-item>
            <ion-label>Same as permanent address</ion-label>
            <ion-checkbox color="dark" checked="false"></ion-checkbox>
        </ion-item>
        <ion-item>
            <ion-label stacked>Address 1</ion-label>
            <ion-input formControlName="addcomm1" type="text"></ion-input>
        </ion-item>
        <ion-item>
            <ion-label stacked>Address 2</ion-label>
            <ion-input formControlName="addcomm2" type="text"></ion-input>
        </ion-item>
        <ion-row>
            <ion-col>
                <ion-item>
                    <ion-label floating>Zipcode</ion-label>
                    <ion-input formControlName="zip2" type="text"></ion-input>
                </ion-item>
            </ion-col>
            <ion-col>
                <ion-item>
                    <ion-label floating>District</ion-label>
                    <ion-select interface="popover">
                        <ion-option value="nes">Trivandrum</ion-option>
                        <ion-option value="n64">Ernakulam</ion-option>
                        <ion-option value="ps">Thrissur</ion-option>
                    </ion-select>
                </ion-item>
            </ion-col>
        </ion-row>
        <ion-row>
            <ion-col>
                <ion-item>
                    <ion-label floating>State</ion-label>
                    <ion-select interface="popover">
                        <ion-option value="nes">Kerala</ion-option>
                        <ion-option value="n64">Tamil Nadu</ion-option>
                        <ion-option value="ps">Karnataka</ion-option>
                    </ion-select>
                </ion-item>
            </ion-col>
            <ion-col>
                <ion-item>
                    <ion-label floating>Country</ion-label>
                    <ion-select interface="popover">
                        <ion-option value="nes">India</ion-option>
                        <ion-option value="n64">China</ion-option>
                        <ion-option value="ps">USA</ion-option>
                    </ion-select>
                </ion-item>
            </ion-col>
        </ion-row>
        <ion-item>
            <ion-label class="add">Address Proof: <span class="required">*</span></ion-label>
            <ion-icon name="document" item-end></ion-icon>
        </ion-item>
        <ion-item>
            <ion-label floating>Mobile <span class="required">*</span></ion-label>
            <ion-input formControlName="mob" type="text"></ion-input>
        </ion-item>
        <ion-row>
            <ion-col>
                <button class="otp" color="light" block>Sent OTP</button>
            </ion-col>
            <ion-col>
                <ion-item>
                    <ion-label fixed>OTP <span class="required">*</span></ion-label>
                    <ion-input formControlName="otp" type="text"></ion-input>
                </ion-item>
            </ion-col>
        </ion-row>
    </form>
</ion-content>

<ion-footer no-shadow class="foot">
    <ion-toolbar position="bottom">
        <ion-row>
            <ion-col>
                <button ion-button full color="primary" block>Save</button>
            </ion-col>
            <ion-col>
                <button (click)="next()" ion-button full color="primary" block>Next</button>
            </ion-col>
        </ion-row>
    </ion-toolbar>
</ion-footer>

ts file:

import { Component } from '@angular/core';
import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular';
import { ObsAuthService } from '../../services/obs_auth.services';
import { ConnectrgPage } from '../connectrg/connectrg';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { IndkycPage } from '../indkyc/indkyc';
import { ToastController } from 'ionic-angular';
import { ConnecthomePage } from '../connecthome/connecthome';
// import { FileChooser } from '@ionic-native/file-chooser';

@Component({
    
    selector: 'page-individualreg',
    templateUrl: 'individualreg.html',
    providers: [ObsAuthService]


})
export class IndividualregPage {
    formind: FormGroup;

    constructor(private nav: NavController, private auth: ObsAuthService,
        private alertCtrl: AlertController, private loadingCtrl: LoadingController,
        private builder: FormBuilder,public toastCtrl:ToastController) { 
            this.formind = builder.group({    
                add1: ['',Validators.compose([Validators.required])],
                add2: ['', Validators.compose([Validators.required])],
                zip:['',Validators.compose([Validators.pattern('^[+0-9]{6}$'),Validators.required])],
                addcomm1: ['',Validators.compose([Validators.required])],
                addcomm2: ['', Validators.compose([Validators.required])],
                zip2:['',Validators.compose([Validators.pattern('^[+0-9]{6}$'),Validators.required])],
                mob:['',Validators.compose([Validators.pattern('^((\\+91-?)|0)?[0-9]{10}$'),Validators.required])],
                otp:['',Validators.compose([Validators.pattern('^[0-9]{4}$'),Validators.required])]
            });
        }
// uploadresume(){
//         this.fileChooser.open()
//         .then(uri => console.log(uri))
//         .catch(e => console.log(e));
// }
    selectChange(e) {
        console.log(e);
    }
    goback() {
        

        this.nav.pop();  // remember to put this to add the back button behavior
    }
    // public rg(){
    //     this.nav.push(ConnectrgPage);
    // }

    public event = {
        month: ' - - '
    }
   
    public next() {

        if(!this.formind.valid){
            const toast = this.toastCtrl.create({
                message: 'Fill the inputs in valida format',
                duration: 2000
              });
              toast.present();
        }
        else{

            const toast = this.toastCtrl.create({
                message: 'Registered',
                duration: 1000
              });
              toast.present();
              this.nav.push(IndkycPage);
        
        }
    }

}

Posts: 1

Participants: 1

Read full topic

How to fetch details from previous page to payment page?

$
0
0

@neenu123 wrote:

I have 3 pages each consisting of a button to redirect to a payment page. I have commonly created a payment page for each page. In that payement page there is a label which shows the selected category that means the page that is redirected to payment page. that label should show the category which i have redirected. How can i do that?
here is my code
I am only posting one page here instead of three and the payment page too.
category page- category name: Third Party
html

<ion-header>
    <ion-navbar>
        <ion-title>KYC Details</ion-title>
    </ion-navbar>
</ion-header>
<ion-content>
    <ion-label class="h">Company Details : </ion-label>
    <ion-item>
        <ion-label class="d">License : <span class="required">*</span></ion-label>
        <ion-icon name="document" item-end></ion-icon>
    </ion-item>
    <ion-item>
        <ion-label class="d">Other Ministry Registrations : <span class="required">*</span></ion-label>
        <ion-icon name="document" item-end></ion-icon>
        <!-- <ion-select interface="popover">
            <ion-option value="nes">MSME</ion-option>
            <ion-option value="n64">Nintendo64</ion-option>
            <ion-option value="ps">PlayStation</ion-option>
        </ion-select> -->
    </ion-item>
    <ion-item>
        <ion-label inline>PAN Number : <span class="required">*</span></ion-label>
        <ion-input type="text"></ion-input>
    </ion-item>
    <ion-item>
        <ion-label inline>Aadhar Number : <span class="required">*</span></ion-label>
        <ion-input type="text"></ion-input>
    </ion-item>
    <ion-label class="h">Owner Details : </ion-label>
    <ion-item>
        <ion-label inline>Other Documents : <span class="required">*</span></ion-label>
        <ion-select interface="popover">
            <ion-option value="nes">Driving License</ion-option>
            <ion-option value="n64">Voter's Id</ion-option>
        </ion-select>
    </ion-item>
    <ion-item>
        <ion-label class="add">Documents : <span class="required">*</span></ion-label>
        <ion-icon name="document" item-end></ion-icon>
    </ion-item>
    <ion-item>
        <ion-label class="add">PAN : <span class="required">*</span></ion-label>
        <ion-icon name="document" item-end></ion-icon>
    </ion-item>
    <ion-item>
        <ion-label class="add">Aadhar : <span class="required">*</span></ion-label>
        <ion-icon name="document" item-end></ion-icon>
    </ion-item>
    <ion-label class="doc">
        <span class="required">documents must be uploaded in pdf format
            <p>size must be 5 mb</p>
        </span>
    </ion-label>
</ion-content>
<ion-footer no-shadow class="foot">
    <ion-toolbar position="bottom">
        <ion-row>
            <ion-col>
                <button ion-button full color="primary" block>Save</button>
            </ion-col>
            <ion-col>
                <button (click)="pay()" ion-button full color="primary" block>Proceed to payment</button>
            </ion-col>
        </ion-row>
    </ion-toolbar>
</ion-footer>

third party ts file

import { Component } from '@angular/core';
import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular';
import { ObsAuthService } from '../../services/obs_auth.services';
import { ConnectpayPage } from '../connectpay/connectpay';


@Component({
    selector: 'page-thirdkyc',
    templateUrl: 'thirdkyc.html',
    providers: [ObsAuthService]
})
export class ThirdkycPage {
    

    constructor(private nav: NavController, private auth: ObsAuthService,
        private alertCtrl: AlertController, private loadingCtrl: LoadingController) { }

        selectChange(e) {
            console.log(e);
        }
        public pay()
        {
            this.nav.push(ConnectpayPage); 
        }
        
    }

Payment page:
html:

<ion-header>
    <ion-navbar>
        <ion-title>PAYMENT OPTIONS</ion-title>
    </ion-navbar>
</ion-header>
<ion-content>
    <ion-row>
        <!-- <ion-item> -->
        <ion-col>
            <ion-label class="cat">Selected Category: </ion-label>
        </ion-col>
        <ion-col>
            <ion-label class="cat">Amount to be paid: </ion-label>
        </ion-col>
        <!-- </ion-item> -->
    </ion-row>
    <ion-label class="p">Payment method : </ion-label>
    <ion-label class="cat">Payment done through : <ion-img class="img" src="../../assets/images/paytm-512.png"></ion-img>
    </ion-label>
    <div padding text-center>
    <a button class="btn" href="https://developer.paytm.com/docs/" ion-button color="primary" block> Proceed to paytm</a>
</div>
</ion-content>

ts file

import { Component } from '@angular/core';
import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular';
import { ObsAuthService } from '../../services/obs_auth.services';


@Component({
    selector: 'page-connectpay',
    templateUrl: 'connectpay.html',
    providers: [ObsAuthService]
})
export class ConnectpayPage {


    constructor(private nav: NavController, private auth: ObsAuthService,
        private alertCtrl: AlertController, private loadingCtrl: LoadingController) { }

    selectChange(e) {
        console.log(e);
    }
    // goback() {
    //     this.nav.pop();  
    
}

Posts: 1

Participants: 1

Read full topic

Migration scss IONIC4

$
0
0

@ravo93 wrote:

I’migrating my project from ionic 3 to ionic 4 and all my scss is not read.

Version ionic v3


Version ionic v4

login.page.scss

:host {
	ion-content{
		background-image: url('../../assets/img/background-login.jpg');
		background-size: cover;
	}
	.remember{
		font-size: 11pt;
		background-color: transparent!important;
	}
	.label{
		margin-left: 3px
	}
    video {
        position: fixed;
        top: 50%;
        left: 50%;
        min-width: 100%;
        min-height: 100%;
        width: auto;
        height: auto;
        z-index: -100;
        transform: translateX(-50%) translateY(-50%);
    }
	
	.scroll-content {
		// align-content: center;
		display: flex;
		 flex-direction: column;
		 justify-content: center;
		text-align: center;
		overflow-y: hidden;
		position: fixed;
	}

	ion-card.card {
		box-shadow: none;
		background:#D9D9D9;
		border-radius: 5px;
	}

	a, p,
	ion-card-header.card-header {
		color: #E36524!important;
	}

	.list > .item-block:first-child {
		border: medium none;
	}
	.item-md {
		 padding-left: 0; 
	  }
	
	.logo{
		background-color: transparent!important;
		padding-top: 10px;
	}

	.footer{
		font-size: 9.5pt;
	}

	.item {
		margin-bottom: 10px;
		background: rgba(255, 255, 255, 0.5);
		border: medium none;

		.text-input {
			color: #E36524;
		}

		input::-moz-placeholder  {
			color:#E36524!important;
		}

		input:-moz-placeholder {
			color:#E36524!important;
		}

		*::-webkit-input-placeholder  {
			color:#E36524!important;
		}

		*:-ms-input-placeholder  {
			color: #E36524!important;
		}

		*:-moz-placeholder  {
			color: #E36524!important;
		}
	}

	.icon {
		padding-right: 10px;
	}


	
}

login.page.html

<!--
  Generated template for the LoginPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<!--<ion-header>

  <ion-navbar>
    <ion-title>login</ion-title>
  </ion-navbar>

</ion-header> -->


<ion-content padding style="float:right;background-image: url('')">

  <ion-card style="width: 40%; max-width: 430px; min-width:350px; min-height:270px; align-self: center; ">
    <ion-card-header>
      <ion-img class="logo" width="80" height="80" src="">
      </ion-img>
    </ion-card-header>
    <ion-card-content>
      <ion-list>
        <ion-item>
          <ion-input [(ngModel)]="Shopkeeper" type="text" placeholder="Esercente"></ion-input>
        </ion-item>
        <ion-item>
          <ion-input [(ngModel)]="Username" type="text" placeholder="Username"></ion-input>
        </ion-item>
        <ion-item>
          <ion-input [(ngModel)]="Password" type="password" placeholder="Password"></ion-input>
        </ion-item>
        <ion-grid>
          <ion-row>
            <ion-col>
              <ion-row>
                <ion-item class="remember">
                  <ion-label>
                    <span>Ricorda</span>
                  </ion-label>
                  <ion-checkbox color="default" [(ngModel)]="Remember" style="align-self:auto; "></ion-checkbox>

                </ion-item>

              </ion-row>
            </ion-col>
            <ion-col>
              <button ion-button block outline color="default" (click)="login()">Log in</button>
            </ion-col>
          </ion-row>
        </ion-grid>
      </ion-list>
      <h6 class="footer"> <br> <br>
        <br> </h6>
    </ion-card-content>
  </ion-card>





</ion-content>```

Posts: 1

Participants: 1

Read full topic

Export failed - for ios device, requires a provisioning profile

$
0
0

@priyankaghosh123 wrote:

error: exportArchive: “*.app” requires a provisioning profile with the Push Notifications feature.

Error Domain=IDEProvisioningErrorDomain Code=9 “”.app" requires a provisioning profile with the Push Notifications feature." UserInfo={NSLocalizedDescription=".app" requires a provisioning profile with the Push Notifications feature., NSLocalizedRecoverySuggestion=Add a profile to the “provisioningProfiles” dictionary in your Export Options property list.}

** EXPORT FAILED **

CordovaError: Promise rejected with non-error: ‘Error code 70 for command: xcodebuild with args: -exportArchive,-archivePath,.xcarchive,-exportOptionsPlist,exportOptions.plist,-exportPath,device’
at cli.catch.err (/usr/local/lib/node_modules/cordova/bin/cordova:30:15)
at process.internalTickCallback (internal/process/next_tick.js:77:7)

This error is showing when running in vscode. If I manually add provisioningProfiles dictionary, when I build the app this dictionary automatically removed.

Posts: 1

Participants: 1

Read full topic

Ionic 1 push notification

$
0
0

@neethupgeorge wrote:

As per the ionic 1 push notification tutorials, needs an app id and public key from the ionic app dashboard. Although we have the app id, we don’t have a public key in the dashboard settings for the corresponding app.
can anyone help?

Posts: 1

Participants: 1

Read full topic

Push color instead of icon when app is opened

$
0
0

@Nicolus wrote:

Hello @Ionic community !

I’m facing a problems with notification icons with firebase : when the app is in background, notifications are displayed with custom icon as desired ; but when the app is opened, a color is displayed instead of the icon, as you can see below (the first notification was send when app was closed) :

My config.xml file :

    <platform name="android">
[...]
        <resource-file src="resources/android/notification/drawable-hdpi/ic_stat_app.png" target="app/src/main/res/drawable-hdpi/notification_icon.png" />
        <resource-file src="resources/android/notification/drawable-mdpi/ic_stat_app.png" target="app/src/main/res/drawable-mdpi/notification_icon.png" />
        <resource-file src="resources/android/notification/drawable-xhdpi/ic_stat_app.png" target="app/src/main/res/drawable-xhdpi/notification_icon.png" />
        <resource-file src="resources/android/notification/drawable-xxhdpi/ic_stat_app.png" target="app/src/main/res/drawable-xxhdpi/notification_icon.png" />
        <resource-file src="resources/android/notification/drawable-xxxhdpi/ic_stat_app.png" target="app/src/main/res/drawable-xxxhdpi/notification_icon.png" />
        <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
    </platform>

Icons were generated with : https://romannurik.github.io/AndroidAssetStudio/icons-notification.html

The icon name is mentioned in notification data as below :

  var message = {
    notification: {
      body: event.messageBody,
      title: event.messageTitle
    },
    android: {
      notification: {
        body: event.messageBody,
        title: event.messageTitle,
        sound: 'default',
        icon: 'notification_icon',
        color: event.notificationColor
      }
    },
    token: registrationToken
  };

I thought about custom CSS, Android manifest configuration… but did’nt find anything. Does someone have an idea ?

Thanks ! :wink:

Posts: 1

Participants: 1

Read full topic

Need to access current location of the company

$
0
0

@aseelali23 wrote:

I have a page that contains company details. In which there is a field which fetches current location.
When clicking the icon i need to access the location and set it in the input box.
I had tried geo location but some error pulled up.
here is my page design and ts file.
html: there is a field called location with an icon.

<ion-header>
    <ion-navbar>
        <ion-title>DEDICATED ENTITY REGISTRATION</ion-title>
    </ion-navbar>
</ion-header>
<ion-content>
    <!-- <ion-row no padding>
            <ion-col> -->
    <ion-item class="sel">
        <ion-label>Select Center <span class="required">*</span></ion-label>
        <ion-select interface="popover">
            <ion-option value="nes">NES</ion-option>
            <ion-option value="n64">Nintendo64</ion-option>
            <ion-option value="ps">PlayStation</ion-option>
        </ion-select>
    </ion-item>
    <!-- </ion-col>
        <ion-col> -->
    <ion-item class="sel">
        <ion-label>Location <span class="required">*</span></ion-label>
        <ion-input type="text"></ion-input>
        <ion-icon class="cursor" name="pin" item-end (click)="loc()"></ion-icon>
    </ion-item>
    <!-- </ion-col>
          </ion-row> -->

          <form [formGroup]="formded">

    <ion-item>
        <ion-label stacked>Name <span class="required">*</span></ion-label>
        <ion-input formControlName="name" type="text"></ion-input>
    </ion-item>
    <ion-item>
        <ion-label stacked>Address 1 <span class="required">*</span></ion-label>
        <ion-input formControlName="add1" type="text"></ion-input>
    </ion-item>
    <ion-item>
        <ion-label stacked>Address 2 <span class="required">*</span></ion-label>
        <ion-input formControlName="add2" type="text"></ion-input>
    </ion-item>
    <ion-row>
        <ion-col>
            <ion-item>
                <ion-label floating>Zipcode <span class="required">*</span></ion-label>
                <ion-input formControlName="zip" type="text"></ion-input>
            </ion-item>
        </ion-col>
        <ion-col>
            <ion-item>
                <ion-label floating>District <span class="required">*</span></ion-label>
                <ion-select interface="popover">
                    <ion-option value="nes">Trivandrum</ion-option>
                    <ion-option value="n64">Ernakulam</ion-option>
                    <ion-option value="ps">Thrissur</ion-option>
                </ion-select>
            </ion-item>
        </ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
            <ion-item>
                <ion-label floating>State <span class="required">*</span></ion-label>
                <ion-select interface="popover">
                    <ion-option value="nes">Kerala</ion-option>
                    <ion-option value="n64">Tamil Nadu</ion-option>
                    <ion-option value="ps">Karnataka</ion-option>
                </ion-select>
            </ion-item>
        </ion-col>
        <ion-col>
            <ion-item>
                <ion-label floating>Country <span class="required">*</span></ion-label>
                <ion-select interface="popover">
                    <ion-option value="nes">India</ion-option>
                    <ion-option value="n64">China</ion-option>
                    <ion-option value="ps">USA</ion-option>
                </ion-select>
            </ion-item>
        </ion-col>
    </ion-row>
    <ion-item>
        <ion-label class="add">Address Proof: <span class="required">*</span></ion-label>
        <ion-icon name="document" item-end></ion-icon>
    </ion-item>
    <ion-label class="h">Applicant Details :</ion-label>
    <ion-item>
        <ion-label stacked>Name <span class="required">*</span></ion-label>
        <ion-input formControlName="appName" type="text"></ion-input>
    </ion-item>
    <ion-item>
        <ion-label stacked>Address 1 <span class="required">*</span></ion-label>
        <ion-input formControlName="appAdd1" type="text"></ion-input>
    </ion-item>
    <ion-item>
        <ion-label stacked>Address 2 <span class="required">*</span></ion-label>
        <ion-input formControlName="appAdd2"type="text"></ion-input>
    </ion-item>
    <ion-row>
        <ion-col>
            <ion-item>
                <ion-label floating>Zipcode <span class="required">*</span></ion-label>
                <ion-input formControlName="appZip"type="text"></ion-input>
            </ion-item>
        </ion-col>
        <ion-col>
            <ion-item>
                <ion-label floating>District <span class="required">*</span></ion-label>
                <ion-select interface="popover">
                    <ion-option value="nes">Trivandrum</ion-option>
                    <ion-option value="n64">Ernakulam</ion-option>
                    <ion-option value="ps">Thrissur</ion-option>
                </ion-select>
            </ion-item>
        </ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
            <ion-item>
                <ion-label floating>State <span class="required">*</span></ion-label>
                <ion-select interface="popover">
                    <ion-option value="nes">Kerala</ion-option>
                    <ion-option value="n64">Tamil Nadu</ion-option>
                    <ion-option value="ps">Karnataka</ion-option>
                </ion-select>
            </ion-item>
        </ion-col>
        <ion-col>
            <ion-item>
                <ion-label floating>Country <span class="required">*</span></ion-label>
                <ion-select interface="popover">
                    <ion-option value="nes">India</ion-option>
                    <ion-option value="n64">China</ion-option>
                    <ion-option value="ps">USA</ion-option>
                </ion-select>
            </ion-item>
        </ion-col>
    </ion-row>
    <ion-item>
        <ion-label class="add">Address Proof: <span class="required">*</span></ion-label>
        <ion-icon name="document" item-end></ion-icon>
    </ion-item>
    <ion-item>
        <ion-label floating>Mobile <span class="required">*</span></ion-label>
        <ion-input formControlName="mob" type="text"></ion-input>
    </ion-item>
    <ion-row>
        <ion-col>
            <button color="light" block>Sent OTP</button>
        </ion-col>
        <ion-col>
            <ion-item>
                <ion-label fixed>OTP <span class="required">*</span></ion-label>
                <ion-input formControlName="otp" type="text"></ion-input>
            </ion-item>
        </ion-col>
    </ion-row>
    </form>
    <!-- <ion-item> -->
    <ion-row>
        <ion-col>
            <ion-label class="a">Felicitation Details :<span class="required">*</span></ion-label>
        </ion-col>
        <ion-col>
            <ion-label stacked class="txt">includes capacity, connectivity and accessibility details</ion-label>
        </ion-col>
    </ion-row>
    <ion-textarea name="comment" placeholder="Put any comment..."></ion-textarea>
    <!-- </ion-item> -->
</ion-content>
<ion-footer no-shadow class="foot">
    <ion-toolbar position="bottom">
        <ion-row>
            <ion-col>
                <button ion-button full color="primary" block>Save</button>
            </ion-col>
            <ion-col>
                <button (click)="next()" ion-button full color="primary" block>Next</button>
            </ion-col>
        </ion-row>
    </ion-toolbar>
</ion-footer>

ts file:

import { Component } from ‘@angular/core’;
import { NavController, AlertController, LoadingController, Loading, IonicPage } from ‘ionic-angular’;
import { ObsAuthService } from ‘…/…/services/obs_auth.services’;
import { DedkycPage } from ‘…/dedkyc/dedkyc’;
import { FormBuilder, FormGroup, Validators } from ‘@angular/forms’;
import { ToastController } from ‘ionic-angular’;

@Component({
selector: ‘page-dedreg’,
templateUrl: ‘dedreg.html’,
providers: [ObsAuthService]
})
export class DedregPage {

formded: FormGroup;

constructor(private nav: NavController, private auth: ObsAuthService,
    private alertCtrl: AlertController, private loadingCtrl: LoadingController,
    public formBuilder: FormBuilder, public toastCtrl: ToastController) {

    this.formded = formBuilder.group({
        name: ['', Validators.compose([Validators.pattern('[a-zA-Z ]*'), Validators.required])],
        add1: ['', Validators.compose([Validators.required])],
        add2: ['', Validators.compose([Validators.required])],
        zip: ['', Validators.compose([Validators.pattern('^[+0-9]{6}$'), Validators.required])],
        appName: ['', Validators.compose([Validators.pattern('[a-zA-Z ]*'), Validators.required])],
        appAdd1: ['', Validators.compose([Validators.required])],
        appAdd2: ['', Validators.compose([Validators.required])],
        appZip: ['', Validators.compose([Validators.pattern('^[+0-9]{6}$'), Validators.required])],
        mob: ['', Validators.compose([Validators.pattern('^((\\+91-?)|0)?[0-9]{10}$'), Validators.required])],
        otp: ['', Validators.compose([Validators.pattern('^[0-9]{4}$'), Validators.required])]
    });


}

selectChange(e) {
    console.log(e);
}
// goback() {
//     this.nav.pop();  // remember to put this to add the back button behavior
// }
public next() {
    if (!this.formded.valid) {
        const toast = this.toastCtrl.create({
            message: 'Fill the inputs in valida format',
            duration: 3000
        });
        toast.present();
    }
    else {
        const toast = this.toastCtrl.create({
            message: 'Registration Successfull',
            duration: 1000
        });
        toast.present();
        this.nav.push(DedkycPage);
    }

}
public loc() {

    const toast = this.toastCtrl.create({
        message: 'click',
        duration: 4000
    });
    toast.present();

}

}

Posts: 1

Participants: 1

Read full topic


Update my ionic app on google play

$
0
0

@Vartex05 wrote:

I have a question about updating my app on google play. Is it possible to load new version of app to google play, but disable automatic installation of update on devices, that have older version already installed?

Posts: 1

Participants: 1

Read full topic

Ion-tabs bar is not showing

Blocked Urls

$
0
0

@divyarane wrote:

While installing the plugins and compiling the project it gives a proxy error. As i am working in a corporate, I need to know the urls that gets blocked behind the proxy. So can you help me with the url list that i can whitelist for the use and get it unblocked too.

Posts: 1

Participants: 1

Read full topic

Odd problem that only cleaning the cache solves it

$
0
0

@Valdyr wrote:

I need some direction trying to find out what is happening in my production environment, maybe someone had a similar issue and can help. Every now and then my list of documents (from a firestore db) vanishes, usually after a document is edited, and the only way to make both the app and the browser version to resume working is to clean the cache. That being said, the actual problem is the lack of consistency in this, it happens from time to time, there is no step-by-step way to reproduce it nor have it ever happened in the dev environment. Any ideas?

Info:

Ionic:

ionic (Ionic CLI) : 4.10.2
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.0

Cordova:

cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : android 7.1.4
Cordova Plugins : no whitelisted plugins (18 plugins total)

System:

Android SDK Tools : 26.1.1
NodeJS : v11.6.0
npm : 6.4.0
OS : Linux 4.18

Thanks .

Posts: 1

Participants: 1

Read full topic

EmailComposer

$
0
0

@Raul88 wrote:

Hello everyone, at the time of sending the mail and open the Gmail application. Is there any way to choose the email account from which we send, without having it registered on the phone ?.
Thanks in advance.

Posts: 1

Participants: 1

Read full topic

Viewing all 70435 articles
Browse latest View live


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>