Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all 49110 articles
Browse latest View live

Can we upload to server both picture and text?

$
0
0

@khalilben wrote:

Hi,

I would like to send both data text and picture like this picture :

My TS Code

 declarerSinistre(){
    //http://michael.laffargue.fr/blog/2016/04/17/angularjs2-send-http-post-request-with-parameters-to-php/
    var headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded');

    var params = 'entry_by='+this.userDetails.id+'&NomConducteur='+this.userData.NomConducteur+'&TelConducteur='+this.userData.TelConducteur+'&CinConducteur='+this.userData.CinConducteur+'&latitude='+this.la+'&longitude='+this.lo;
    this.http.post(this.apiSinistre, params , {headers: headers})
      .subscribe(
        data => this.afficherAlert('Réussite','Sinistre Déclaré'),
        err => this.afficherAlert('Erreur','Sinistre Non Déclaré')
      );
  }

And how to have the same input with photo ?
HTML CODE

<div [formGroup]="sinistreForm">
      <ion-item>
        <ion-input formControlName="iNom" type="text" placeholder="Nom conducteur" [(ngModel)]="userData.NomConducteur"></ion-input>
      </ion-item>
      <ion-item>
        <ion-input formControlName="iTel" type="text"  placeholder="Tel conducteur"  [(ngModel)]="userData.TelConducteur"></ion-input>
      </ion-item>
      <ion-item>
        <ion-input formControlName="iCin" type="text" placeholder="CIN conducteur"  [(ngModel)]="userData.CinConducteur"></ion-input>
      </ion-item>
      <ion-item (click)="getUserPosition()">
        <ion-input formControlName="iLongitude" type="text" disabled  value="Longitude : {{lo}}"></ion-input>
      </ion-item>
      <ion-item (click)="getUserPosition()">
        <ion-input formControlName="iLatitude" type="text" disabled value="Latitude : {{la}}"></ion-input>
      </ion-item>
        <br>
      <button ion-button color="positive" full [disabled]="!sinistreForm.valid" (click)="declarerSinistre()"  block>Déclarer</button>
    </div>

Posts: 1

Participants: 1

Read full topic


Modify HttpHeaders in post

$
0
0

@Oldstadt wrote:

I am trying to send a post Http request to my server, but need to add additional headers to it. If I just post like this:

let headers = new HttpHeaders();
this.http.post(url, req, { headers: headers });

I see the following request options in my post request (ionic serve in chrome):

:authority:my server
:method:POST
:path:path on my server
:scheme:https
accept:application/json, text/plain, */*
accept-encoding:gzip, deflate, br
accept-language:en-GB,en-US;q=0.9,en;q=0.8
content-length:90
content-type:text/plain
origin:http://localhost:8100
referer:http://localhost:8100/
user-agent:Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36

However, if I try add custom http headers in any way (set, append, json object in constructor), e.g.:

let headers = new HttpHeaders().set('Content-Type', 'application/json');
this.http.post(url, req, { headers: headers })

The post request seems to be changed to an OPTIONS request, and the name of the header I am trying to set appears as the value for access-control-request-headers (as well as some other weird changes):

:authority:my server
:method:OPTIONS
:path:path on my server
:scheme:https
accept:*/*
accept-encoding:gzip, deflate, br
accept-language:en-GB,en-US;q=0.9,en;q=0.8
access-control-request-headers:content-type
access-control-request-method:POST
origin:http://localhost:8100
user-agent:Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36

The same happens if I use Firefox.

Am I doing something wrong?

Posts: 1

Participants: 1

Read full topic

Error ionic super starter template

$
0
0

@lolaswift1 wrote:

I received the following error when click on “login”:
Failed to load https://example.com/api/v1/login: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8100’ is therefore not allowed access.
After login, the sidemenu also not showing.
Can anyone help me? thx.

Posts: 1

Participants: 1

Read full topic

Invalid character

$
0
0

@unvired wrote:

After upgrading to ionic 3.9.2 I am getting Invalid character error ` in IE11. Though the app is working fine on Chrome/Safari/Edge.

Here is the ionic setup details :

 @ionic/cli-utils  : 1.18.0
  ionic (Ionic CLI) : 3.18.0

global packages:   cordova (Cordova CLI) : 7.0.1

local packages:
    @ionic/app-scripts : 3.1.0
    Cordova Platforms  : ios 4.4.0 windows 5.0.0
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node : v8.9.1
    npm  : 5.5.1
    OS   : Windows 10

Any help what might be the issue?

Thanks in advance,
Tarak

Posts: 1

Participants: 1

Read full topic

How to open FCM notification to a specific page when app is not running

$
0
0

@rpragesh1 wrote:

Hi, I am working on notification and sending it via fcm notification test server ,
here is my code for that.

FCMPlugin.onNotification(
      (data) => {
        if(!data.wasTapped){
          console.log("tapped when killed"+JSON.stringify(data));
        }else if (this.platform.is('android')){
          this.nav.push(NotificationPage,{data});
          console.log("RecivedFromFCM :"+data);
        }

      },
      (e) => {
        console.log(e);
      }
    );

The issue is that it ONLY runs when you tap on the notification from the notification drawer while the app is in the background. So if the app is open and a notification arrives, the function doesn’t run. Basically, “Received in foreground” never fires, even when the app is in the foreground. I want “Received in foreground” to log as soon as a notification arrives, even before tapping it and also when the app is not running I am able to receive notification but on click, it goes directly to homePage but it should have to go notification page.

Any idea how I can accomplish this, please? Or am I missing something? :worried:

Posts: 1

Participants: 1

Read full topic

Integrating php for data insertion in a database in ionic v3

$
0
0

@sam1408 wrote:

Hi guys. I know this question is asked by most people but I have not found a definite solution or reference to the question. In many tutorials I checked, they are implementing an app.js file and controller . But when I look in my project I dont see a pre build app.js or controller of any sort.
When i looked in the community for suggestion I found out that js and controller are pre build by the ionic v1 framework and it is not practiced now.
I am creating an android app, where there is a page containing a form and i want to insert the data in the form to the database I have created.
So for people like me who are using latest ionic framework, what advice or suggestion can be given to insert the data into database. I have remote server set up by using WAMP server and I desperately need a solution. Any advice or refernce is welcome.

Posts: 1

Participants: 1

Read full topic

setRoot Component destroy

$
0
0

@ohrrkan wrote:

Hi,

Seems that navCtrl.setRoot() destroy the view but not the controller when the page change?

I probably can use the ionViewDidLeave() to destroy manually variable and unsubscribe observable => but is there a automatic method to destroy all the Class variable and unsubscribe observable on a SetRoot()?

Posts: 1

Participants: 1

Read full topic

Bug of build between ionic and android

$
0
0

@Aeronex wrote:

Hello Everyone !
I am working on a projet on Ionic In this project, i’m extracting datas from an xml with a home.ts file. And then I display those datas on the home.html. But i have a major problem : when i build my app using “ionic cordova build android” and then i install it on my Android phone the datas from the XML file are missing while they are on the page on ionic (“ionic serve -l”). Does everyone have a solution ? please :’(

Posts: 1

Participants: 1

Read full topic


How to run ionic sass only

$
0
0

@sebush123 wrote:

hi,

how is it possible to run the sass->css task without compleate build?

./node_modules/.bin/ionic-app-scripts sass

works a little bit. hint: “Bundling must have at least ran once before Sass compilation.” but how?

Posts: 1

Participants: 1

Read full topic

Problem with ionic project creation

$
0
0

@Nadioca wrote:

After install ionic, i tried to create a proyect, but it fails.

error:

<— JS stacktrace —>

==== JS stack trace =========================================

Security context: 0x3dad06625ec1
1: /* anonymous */ [/usr/local/lib/node_modules/ionic/node_modules/@ionic/cli-utils/lib/utils/shell.js:~44] [pc=0x29d97a6373fc](this=0x3dad3eada2f9 ,chunk=0x3dada8bac189 )
2: emit [events.js:~156] [pc=0x29d97a626d8f](this=0x3dad3eada2f9 ,type=0x3dad06636619 <String[4]: data>)
3: arguments adapt…

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
1: node::Abort() [/usr/local/bin/node]
2: node::FatalException(v8::Isolate*, v8::Localv8::Value, v8::Localv8::Message) [/usr/local/bin/node]
3: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [/usr/local/bin/node]
4: v8::internal::factory::NewUninitializedFixedArray(int) [/usr/local/bin/node]
5: v8::internal::(anonymous namespace)::ElementsAccessorBase<v8::internal::(anonymous namespace)::FastPackedObjectElementsAccessor, v8::internal::(anonymous namespace)::ElementsKindTraits<(v8::internal::ElementsKind)2> >::GrowCapacity(v8::internal::Handlev8::internal::JSObject, unsigned int) [/usr/local/bin/node]
6: v8::internal::Runtime_GrowArrayElements(int, v8::internal::Object**, v8::internal::Isolate*) [/usr/local/bin/node]
7: 0x29d97a48463d
Abort trap: 6

and I have this version of ionic

ionic info
[WARN] You are not in an Ionic project directory. Project context may be
missing.

cli packages: (/usr/local/lib/node_modules)

@ionic/cli-utils  : 1.19.0
ionic (Ionic CLI) : 3.19.0

System:

Node : v8.9.1
npm  : 5.5.1
OS   : OS X El Capitan

Misc:

backend : pro

How can I solve it?

Posts: 2

Participants: 2

Read full topic

How add shadow to ion-avatar?

setRoot navigation

$
0
0

@MarinoRaul wrote:

Hi all Guys!!!

Which is the correct way to use setRoot method with the page with the last ionic version???

Because I got unresolved params when I use: this.app.getRootNavById().setRoot(Event, objExtraParams)

Thanks a lot

Posts: 1

Participants: 1

Read full topic

iOS creating local server to run application

$
0
0

@andreven wrote:

Hello there!

I’m running my application in an iOS device and the device is just creating a local server to run the application. This is screwing up my connection with the server.

Does anyone know how to solve this?

Posts: 1

Participants: 1

Read full topic

The server responded with a status of 401 (Unauthorized)

$
0
0

@nbelghiti wrote:

page user.ts

getUsers() {
  this.rest.getUsers()
  .then(data => {
    this.users = data;
    console.log(data)
  }, err =>{
  	this.erreur =  err;
  	   console.log(err);
  });
}

provider rest

getUsers() {
return new Promise(( resolve, reject ) => {
this.http.get( this.apiUrl + ‘/accueil’ ).subscribe( data => {
resolve( data );
console.log( data );
}, err => {
reject( err );
console.log( err );
});
});
}

i have htaccess on my server and we use HTTPS

erreur
Failed to load https://www.aef.info/api/Testapi/accueil: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8100’ is therefore not allowed access. The response had HTTP status code 401.

server.js
.header(“Access-Control-Allow-Origin”, “*”)
.header(“Access-Control-Allow-Methods”, “GET, POST, DELETE, PUT, OPTIONS, HEAD”)

Posts: 11

Participants: 2

Read full topic

Build does not work with prod mode


App working on my side but stuck on splash screen in App Review

$
0
0

@MowKette wrote:

Hello,

I am submitting an Ionic iOS app for my enterprise but App Review send me this message after their test :

"We discovered one or more bugs in your app when reviewed on iPhone and iPad running iOS 11.1.2 on Wi-Fi connected to an IPv6 network.

Specifically, the activity indicator spins indefinitely on launch. Please see the attached screenshot for details.

Next Steps

To resolve this issue, please run your app on a device to identify any issues, then revise and resubmit your app for review.

If we misunderstood the intended behavior of your app, please reply to this message in Resolution Center to provide information on how these features were intended to work."

I can’t reproduce their problem in any way, everything is working for me. It is an update of an application which was in Ionic 1 so we redevelopped it in Ionic 3. It is basically the same as another one which was successfully published 2 weeks ago. I asked them to tell me which iPad or iPhone they used and to retry a test but they responded with the same message not giving me any new information.

What could I try to do now ? Uploading the app again without any change is the only idea I’ve got so far and it isn’t the best one.

Posts: 1

Participants: 1

Read full topic

CustomMenu doesn't show in prod

$
0
0

@agarciaiglesias wrote:

I have a custom menu and custom header created and published in npm. In other project I import those elements and header is shown but when I clicked in the menu button it doesn’t show the menu.
The error in console is this:

ERROR Error: Uncaught (in promise): TypeError: menuTypes[type] is not a constructor
TypeError: menuTypes[type] is not a constructor
    at Function.MenuController.create (main.js:47449)
    at Menu._getType (main.js:73100)
    at main.js:73122
    at new t (polyfills.js:3)
    at Menu.setOpen (main.js:73120)
    at Menu.toggle (main.js:73290)
    at MenuToggle.toggle (main.js:93544)
    at Object.handleEvent (main.js:78096)
    at Object.handleEvent (main.js:12290)
    at Object.handleEvent (main.js:13014)
    at Function.MenuController.create (main.js:47449)
    at Menu._getType (main.js:73100)
    at main.js:73122
    at new t (polyfills.js:3)
    at Menu.setOpen (main.js:73120)
    at Menu.toggle (main.js:73290)
    at MenuToggle.toggle (main.js:93544)
    at Object.handleEvent (main.js:78096)
    at Object.handleEvent (main.js:12290)
    at Object.handleEvent (main.js:13014)
    at c (polyfills.js:3)
    at new t (polyfills.js:3)
    at Menu.setOpen (main.js:73120)
    at Menu.toggle (main.js:73290)
    at MenuToggle.toggle (main.js:93544)
    at Object.handleEvent (main.js:78096)
    at Object.handleEvent (main.js:12290)
    at Object.handleEvent (main.js:13014)
    at dispatchEvent (main.js:8883)
    at main.js:9494

It only happens in production. I am running ionic cordova run android --aot to see errors without minification.

The module of the npm project is this:

import { NgModule, ModuleWithProviders } from '@angular/core';
import { IonicModule } from 'ionic-angular';

import { CustomHeader } from "./components/extended/header/header";
import { CustomMenu } from "./components/extended/menu/menu";
import { MenuService } from "./components/extended/menu/menu.service";

@NgModule({
  imports: [
    IonicModule.forRoot(CustomHeader),
    IonicModule.forRoot(CustomMenu)
  ],
  exports: [
    CustomHeader,
    CustomMenu
  ],
  declarations: [
    CustomHeader,
    CustomMenu
  ],
  entryComponents: [
    CustomHeader,
    CustomMenu
  ],
  providers: [
    MenuService
  ],
})
export class ComponentsModule {

}

And the module where I imported the project:

import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';

import { HomePage } from '../pages/home/home';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { ComponentsModule } from 'components';



@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    ComponentsModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

Someone know what is happening?
Thank you.

Posts: 1

Participants: 1

Read full topic

View and components on Mobile Devices are not updated

$
0
0

@mburger81 wrote:

We have a page where we have a list of about sensors which is a custom component, this custom component has several subcomponents which shows data and other information.

      <ion-row>
            <sensor
                *ngFor="let sensor of sensors;"
                ion-col
                col-12
                col-sm-6
                col-md-4
                [sensor]="sensor"
                [configure]="true">
            </sensor>
        </ion-row>

As you can se we have a sensors array which we loop and create our list of sensor components. Sensor component and sensor object has several sub objects and sub components. A sub component is mapped to a sub object of sensor object.

So if we update this list, or only a part of this list by our business logic, the component should be re rendered.
But sometimes the component is not updated and re rendered, this happening only on mobile devices there is absolutely no problem on desktop web browser.

So the question is, how should we update objects and how can we guarantee the components are updated and rendered again with new values?

Posts: 1

Participants: 1

Read full topic

Local DevApp: Mix `ionic cordova run --livereload` with ideas from the Ionic DevApp

$
0
0

@Sujan12 wrote:

In the Ionic DevApp Feedback Mega-thread @Tommertom had an idea:

I would love some sort of command like

ionic devapp cordova run android

that would build me an app that uses the plugins in my project and uses an url to to another ionic serve for the content in order to do wifi livereload.

So a bit of customisation possible, and a bit of Ionic magic. And only need to rebuild once I meddle with the plugins.

I love that idea:

Interesting, so more or less a ionic cordova run --livereload that uses an app from ionic serve instead of what was built into it… That would mean it would have to include code to “receive” the running ionic serve instances instead of the real www.

Hmm, that should be doable with a little local scripting. Only thing missing is the code of the DevApp that displays the instances (and all workarounds so it can “just” display these then - but I am not sure if there are any).

Want to create a new topic for this “Local DevApp: Mix ionic cordova run --livereload with ideas from the Ionic DevApp” thing you just invented? I think we should talk about it some more @Tommertom.

Edit: I remembered that someone created a project on Github with a “build your own DevApp with your own plugins”. I am pretty sure one could reuse that code…

So much, that I created this topic myself. Let’s see if this goes somewhere.

Posts: 4

Participants: 1

Read full topic

Ion-item issue with shadow

$
0
0

@nuruddinba691 wrote:

I was trying to add shadow element inside ion-item, but still, ion-item overflow hidden child’s shadow,

the code:

“the shadow applying in round-button class”

  <ion-item class="is-active">
        <div item-start>
            <h2>Notification</h2>
        </div>
        <span class="round-button">
            3
        </span>
  </ion-item>

And the element appear like this

Screen_Shot_2017-11-23_at_8_38_11_PM

And it’s supposed to be like this:

31 PM

Posts: 1

Participants: 1

Read full topic

Viewing all 49110 articles
Browse latest View live


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