Activities of "mmukkara"

Any luck on this issue. Thanks

Hi, I am using Angular v5.0.4 project and added below code to style.css to do some generic form level validations.

.ng-valid[required], .ng-valid.required {
    border-left: 2px solid #42A948; /* green */
}
.ng-invalid:not(form) {
    border-left: 2px solid rgba(255, 106, 0, 0.56); /* orange */
}

Input controls don't have any problem. But DatePicker, Select and primeNg inputMask controls doesn't work with Angular form validations.

DatePicker:

<input datePicker type="datetime" name="EffectiveDate" #effectiveDate required class="form-control" [(ngModel)]="effectiveDate" (ngModelChanage)="selectedDateChange()" [(selectedDate)]="effectiveDate" >

[attachment=2:1ru5l6p1]EffDt Pic1.PNG[/attachment:1ru5l6p1] It does perform form validations but once the date is selected, the date control is not formatted as specified (see above image). If I remove [(ngModel)] then it doesn't apply form validation but formats properly(below). [attachment=1:1ru5l6p1]EffDt Pic2.PNG[/attachment:1ru5l6p1]

Select: I think the problem is with jq-plugin. If I remove the jq-plugin="selectpicker", form validation works properly. Hope you guys suggest a solution.

<select #LookupTableCombo
        class="form-control bs-select"
        [(ngModel)]="selectedComboValue"
        (ngModelChange)="selectedComboValueChange.emit($event)"
        [attr.data-live-search]="true"
        jq-plugin="selectpicker">
            <option value="0">{{emptyText}}</option>
            <option *ngFor="let lookupvalue of lookupvalues" [value]="lookupvalue.listId">{{lookupvalue.descriptionEn}}</option>
</select>

PrimeNG: I have no luck with any of their components. Instead of having that orange line on input control, its placed beside label. Thats really weird. I think I may have to get ride of PrimeNG component.

<p-inputMask mask="(999) 999-9999? x99999" name="PhoneNumber" #phoneNumber="ngModel" [(ngModel)]="phoneNumber" required placeholder="(999) 999-9999? x99999" styleClass="form-control"></p-inputMask>

[attachment=0:1ru5l6p1]PrimeNG input mask Pic1.PNG[/attachment:1ru5l6p1]

Hope you guys suggest some solutions for these issues. Appreciate your response. Thanks

this issue has been fixed by adding below code to main-routing.module.ts (Just copied from admin-routing.module.ts)

constructor(private router: Router) {
        router.events.subscribe(() => {
            this.hideOpenDataTableDropdownMenus();
        });
    }

    hideOpenDataTableDropdownMenus(): void {
        let $dropdownMenus = $('.dropdown-menu.tether-element');
        $dropdownMenus.css({
            'display': 'none'
        });
    }

Thanks

Hi All, I am having a issue with dropdown embedded in PrimeNG datatable. When I launch new page from one of the Action in dropdown...the drop down is carried to next screen (non model form) and doesn't go away until I refresh the page. See Screenshots..

<p-column field=""
                                      header="{{l('Actions')}}"
                                      [sortable]="false"
                                      [style]="{'width':'130px','text-align':'center'}"
                                      [hidden]="!isGrantedAny('Pages.Tenant.SomeSecurity')">
                                <ng-template let-record="rowData" pTemplate="body">
                                    <div class="btn-group dropdown" normalizePosition>
                                        <button class="dropdown-toggle btn btn-sm btn-primary"
                                                data-toggle="dropdown"
                                                aria-haspopup="true"
                                                aria-expanded="false">
                                            <i class="fa fa-cog"></i><span class="caret"></span> {{l("Actions")}}
                                        </button>
                                        <ul class="dropdown-menu">
                                            <li>
                                                <a *ngIf="permission.isGranted('Pages.Tenant.SomeSecurity')"
                                                   (click)="onView(record.id)">{{l('Edit')}}</a>
                                            </li>
                                            <li>
                                                <a *ngIf="permission.isGranted('Pages.Tenant.SomeSecurity')"
                                                   (click)="onView(record.id)">{{l('Activate')}}</a>
                                            </li>
                                            <li>
                                                <a *ngIf="permission.isGranted('Pages.Tenant.SomeSecurity')"
                                                   (click)="onView(record.id)">{{l('Discard')}}</a>
                                            </li>
                                        </ul>
                                    </div>
                                </ng-template>
                            </p-column>

[attachment=1:2oa8k11n]ActionPic1.PNG[/attachment:2oa8k11n]

[attachment=0:2oa8k11n]ActionPic2.PNG[/attachment:2oa8k11n]

when I go back, the dropdown stays in the screen and when click on another Action it opens another one. I don't see any page errors in chrome console. Am I missing something?

Appreciate your quick reply. Thank you!

HI Guys,

I am assuming most of you are implementing multi-tenant based system using ABP. This question may not be related to ABP, just trying to figure out how to use it in ABP. I need your help and suggestions on how to implement custom code by tenant. Some tenants have different business rules, entity logic etc., compared to others. How is the work flow of the code execution defined by tenant. How to implement separation of code by tenant custom logic. By the way, I am using Angular version of ABP.

Any suggestions and pointers to documents will be appreciated.

Apart from above question, Anyone integrated workflow component or rules engines to ABP. If so, can you make some suggestions.

Looking for some architectural guidelines for multi-tenant applications.

Thanks

For Problem 4: How do we change the Metronic purple color to something else in Angular project.

Thanks

I can share mine...please check in Edge and Chrome <a class="postlink" href="https://jasperapi.azurewebsites.net">https://jasperapi.azurewebsites.net</a>

Finally, I am able to deploy on Azure. Thank you for your help! I had to delete and recreate app services multiple times and finally it worked without any code changes.

I did everything I could...but unable to solve this problem. can you please check swagger is working fine at <a class="postlink" href="https://jasperapi.azurewebsites.net">https://jasperapi.azurewebsites.net</a> Angular Client App is at <a class="postlink" href="https://jasperweb.azurewebsites.net/">https://jasperweb.azurewebsites.net/</a> ...(Issue)

if you need any credentials, I can email you at <a href="mailto:[email protected]">[email protected]</a>. I am stuck at this point.

Anyone faced the same problem, please share your experiences and solutions. Thanks

Thanks Aaron..I deleted and recreated everything again on Azure. I get the same issue even without diagnostic on azure. Here is the logs.txt file from App_Data folder on server side. I don't have any problem with server, but unable to run angular client. Same issue as below screen shot. [attachment=1:3q07bf2h]Pic2.PNG[/attachment:3q07bf2h]

<a class="postlink" href="https://jasperweb.azurewebsites.net/">https://jasperweb.azurewebsites.net/</a> (This is Angular Client). If you need any credentials to look at the files or configuration, we can take a offline and I can share the any credentials required to solve this problem.

Thank you. Logs.rar