Does anyone have a problem with push side menu?

jQuery UI Widgets
Post Reply
dadumvu
Posts: 17
Joined: 08 Nov 2016, 03:13

01 Dec 2016, 07:07

If I use a dialog module with push side menu, a modal layer of dialog module option comes to the very top of layers, and it makes me unable to close the dialog

nav.html

Code: Select all

 
<div class="top-nav">
  <i class="fa fa-bars toggle" aria-hidden="true" (click)="onAnimate()"></i>
  <div class="signout-box">
    <span class="btn-signout cursor-default">{{userId}}</span>
    <i class="fa fa-sign-out btn-signout" aria-hidden="true" (click)="signout()"><span class="cursor-pointer">Sign out</span></i>
  </div>
  <button pButton type="button" label="localstorage check" (click)="checkItem()"></button>
</div>

<div class="wrapper" (click)="state='close'">
    <router-outlet></router-outlet>
</div>
<!-- To close left side menu bar -->
<div [@divState]='state' class="side-nav">
  <p-panelMenu class="inside-menu" [@divState]="state" [model]="items" [style]="{'width':'230px'}"></p-panelMenu>
</div>
Table, Dialog, Dropdown are in the router-outlet.
Did I do something wrong?

Also, I have a problem with dropdown button.
Where the button located looks little weird. (see my code below)
The button position is a little bit weird like below.

Click me to see the img

Code: Select all

    <label style="align-items:center; display: flex; margin: 0 10px 0 40px; ">* Delivery Mode: </label>
    <p-dropdown required
                name="deliveryMode"
                [options]="deliveryMode"
                [style]="{'width':'195px'}"
                [(ngModel)]="mode"
    ></p-dropdown>

      <p-dataTable align="center"
                   [value]="dmInfo"
                   selectionMode="single"
                   rows="10"
                   [responsive]="true"
                   [globalFilter]="gb"
                   [responsive]="true"
                   [pageLinks]="3"
                   [rowsPerPageOptions]="[5,10,20]"
      >
        <p-column field="userId" header="ID" [filter]="true"></p-column>
      </p-dataTable>
If anyone little helps, thank you so much!

Post Reply

Return to “PrimeUI”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 12 guests