Click here to Skip to main content
15,896,606 members
Home / Discussions / JavaScript
   

JavaScript

 
QuestionRedirecting to the URL after Submit Pin
simpledeveloper6-Mar-19 12:37
simpledeveloper6-Mar-19 12:37 
AnswerRe: Redirecting to the URL after Submit Pin
Nathan Minier7-Mar-19 1:39
professionalNathan Minier7-Mar-19 1:39 
GeneralRe: Redirecting to the URL after Submit Pin
simpledeveloper7-Mar-19 8:29
simpledeveloper7-Mar-19 8:29 
GeneralRe: Redirecting to the URL after Submit Pin
simpledeveloper7-Mar-19 10:52
simpledeveloper7-Mar-19 10:52 
GeneralRe: Redirecting to the URL after Submit Pin
Nathan Minier11-Mar-19 1:15
professionalNathan Minier11-Mar-19 1:15 
GeneralRe: Redirecting to the URL after Submit Pin
simpledeveloper12-Mar-19 6:32
simpledeveloper12-Mar-19 6:32 
GeneralRe: Redirecting to the URL after Submit Pin
simpledeveloper13-Mar-19 6:24
simpledeveloper13-Mar-19 6:24 
QuestionToggling two Radio buttons depending upon enum values in Angular 2.0 Pin
simpledeveloper27-Feb-19 13:38
simpledeveloper27-Feb-19 13:38 
Hi, I am new in Angular world, I am struggling for small thing, but I a trying everything to fix it.
I have a ts file as below:
@Component({
    templateUrl: 'residentialRegistration.component.html'
})
export class ResidentialRegistrationComponent extends ComponentBase {
    private _lsKey: string = 'OnlineRegistration.LS';

    public OnlineRegistration: OnlineRegistration = new OnlineRegistration();
    public NoOfInvalidAttempts: number = 0;
    public RegexValidationType = RegexValidationType;
    public EmitEvent: boolean = false;
    public RouteName: string = '';
    public MaskingResource: MaskingResource = new MaskingResource();

    public IdentificationType: IdentificationType = IdentificationType.PhoneNumber;
    public VerificationType: VerificationType = VerificationType.Last4DigitsOfSSN;

    public IsIdentifiedByAcctNumber: boolean = false;
    public IsIdentifiedByPhoneNumber: boolean = false;
    public IsVerifiedByLast4DigitsOfDriversLicenseOrStateId: boolean = false;
    public IsVerifiedByLast4DigitsOfSSN: boolean = false;

    constructor(private _ls: PgeLocalStorage_PROVIDER<OnlineRegistration>,
        private _pgeRoute: PgeRoute,
        private _activatedRoute: ActivatedRoute
        //,public MaskingResource: MaskingResource
    ) {
        super();
        this.initialize();
    }

    public initialize(): void {
        let lsData = this._ls.getEncrypted(this._lsKey);
        if (lsData !== null && lsData !== undefined) {
            this.OnlineRegistration = lsData;
            //this.IsIdentifiedByAcctNumber = false;
            //this.IsVerifiedByLast4DigitsOfDriversLicenseOrStateId = false;
            this.IdentificationType = IdentificationType.PhoneNumber;
            this.VerificationType = VerificationType.Last4DigitsOfSSN;
        }
        else {
            debugger;
            this._pgeRoute.redirectToError();
        }
    };

    public onAccountVerificationCompleted(verificationValidation: VerificationValidation): void {
        if (verificationValidation.FormValid && !verificationValidation.AccountVerificationValid) {
            this.NoOfInvalidAttempts += 1;
        }
        else if (verificationValidation.FormValid && verificationValidation.AccountVerificationValid) {
            this._pgeRoute.navigateToSibling('Success', this._activatedRoute);
        }
    }

    public onModelChange(): void {
        debugger;
        if (this.IdentificationType === IdentificationType.PhoneNumber) {
            this.IsIdentifiedByPhoneNumber = true;
            this.IsIdentifiedByAcctNumber = false;
        }
        else if (this.IdentificationType === IdentificationType.AccountNumber) {
            this.IsIdentifiedByPhoneNumber = false;
            this.IsIdentifiedByAcctNumber = true;
        }
        if (this.VerificationType === VerificationType.Last4DigitsOfSSN)
            this.IsVerifiedByLast4DigitsOfSSN = true;
        else if (this.VerificationType === VerificationType.Last4DigitsOfDriversLicenseOrStateId)
            this.IsVerifiedByLast4DigitsOfDriversLicenseOrStateId = true;
    }

IdentificationType and VerificationType are enum values
export enum IdentificationType {
Unknown,
PhoneNumber,
AccountNumber
}

export enum VerificationType {
Unknown,
Last4DigitsOfSSN,
Last4DigitsOfDriversLicenseOrStateId
}

And my html is as below:
<form name="residentialRegistrationForm" id="residentialRegistrationForm" novalidate #residentialRegistrationForm="ngForm" (submit)="onNext(residentialRegistrationForm.valid)">
    <div id="subHeaderText">
        {{ 'OnlineRegistration.SignUpToAccess' | Translate }}
        <a class="da-click" data-da-event="telephoneClick" href="tel:800-542-8818">
            {{ 'Common.CustomerServiceNumber' | Translate }}
        </a>.
        <br />
        <br />
        {{ 'OnlineRegistration.BusinessWithMoreAccounts' | Translate }}
        <a href="http://www.portlandgeneral.com/~/link.aspx?_id=B31F170826494FC88B776CBA1E49431F&_z=z">
            {{ 'OnlineRegistration.WorkWithMultipleAccounts' | Translate }}
        </a>.
    </div>
    <fieldset>
        <ol>
            <li>
                <br />
                <ol>
                    <li>
                        <div id="IdentifyLabel">Identify the PGE account:</div>
                    </li>
                    <li *ngIf="NoOfInvalidAttempts > 2">
                        <div class="field-validation-error" id="onlineHelpText">
                            {{ 'ResidentialView.Validator.OnlineHelp1' | Translate}}{{ 'ResidentialView.Validator.OnlineHelp2' | Translate}}{{ 'ResidentialView.Validator.OnlineHelp3' | Translate}}
                        </div>
                    </li>
                    <li>
                        <div class="two-up">
                            <input id="byPhoneNumberOption" name="identificationByOption" type="radio" class="ng-untouched ng-pristine ng-valid" [value]="IdentificationType.PhoneNumber"
                                   [checked]="IsIdentifiedByPhoneNumber"
                                   [(ngModel)]="IdentificationType" (ngModelChange)="onModelChange()" />
                            <label for="byPhoneNumberOption" id="byPhoneNumberLabel" name="byPhoneNumberLabel">{{'AccountVerification.PhoneNumber' | Translate}}</label>
                            {{IsIdentifiedByPhoneNumber}}
                            <div id="divPhoneIdentification" *ngIf="IsIdentifiedByPhoneNumber">
                                <div *ngIf="(residentialRegistrationForm.submitted || phoneNumberInput.touched)">
                                    <div id="phoneNumberInputRequired" name="phoneNumberInputRequired" class="field-validation-error" *ngIf="phoneNumberInput.errors !== null && phoneNumberInput.errors.required">{{'Common.Validator.PhoneNumberRequired' | Translate}}</div>
                                    <div id="phoneNumberInputRequired1" name="phoneNumberInputInvalid" class="field-validation-error" *ngIf="phoneNumberInput.errors !== null && phoneNumberInput.errors.regexValidator">{{'Common.Validator.PhoneNumberInvalid' | Translate}}</div>
                                </div>
                                <input id="phoneNumberInput"
                                       name="phoneNumberInput"
                                       type="tel"
                                       #phoneNumberInput="ngModel"
                                       placeholder="(___) ___-____"
                                       requiredValidator
                                       [textMask]="{ mask: MaskingResource.Phone }"
                                       (ngModelChange)="onInputChanged()"
                                       [(ngModel)]="OnlineRegistration.PhoneNumber"
                                       regexValidator="OnlineRegistration.PhoneNumber"
                                       [regexType]="RegexValidationType.Phone"
                                       pgeAutoMaskingCursor
                                       [ngClass]="{ 'ng-blurred' : residentialRegistrationForm.submitted || phoneNumberInput.touched }" />
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="two-up">
                            <input type="radio" id="byAccountNumberOption" name="identificationByOption" [value]="IdentificationType.AccountNumber"
                                   [checked]="IsIdentifiedByAcctNumber"
                                   [(ngModel)]="IdentificationType" (ngModelChange)="onModelChange()" />
                            <label id="byAccountNumberLabel" name="byAccountNumberLabel" for="byAccountNumberOption">{{'Common.AccountNumber' | Translate}}</label>
                            {{IsIdentifiedByAcctNumber}}
                            <div id="divAccountIdentification" *ngIf="IsIdentifiedByAcctNumber">
                                <div *ngIf="(residentialRegistrationForm.submitted || accountNumberInput.touched )">
                                    <div id="accountNumberInputRequired" name="accountNumberInputRequired" class="field-validation-error" *ngIf="accountNumberInput.errors !== null && accountNumberInput.errors.required">{{'Common.Validator.EnterValidAccountNumber' | Translate}}</div>
                                    <div id="accountNumberInputInvalid" name="accountNumberInputInvalid" class="field-validation-error" *ngIf="accountNumberInput.errors !== null && accountNumberInput.errors.regexValidator">{{'Common.Validator.EnterValidAccountNumber' | Translate}}</div>
                                </div>
                                <input type="tel"
                                       id="accountNumberInput"
                                       name="accountNumberInput"
                                       #accountNumberInput="ngModel"
                                       placeholder="__________"
                                       requiredValidator
                                       regexValidator="OnlineRegistration.AccountNumber"
                                       [regexType]="RegexValidationType.AccountNumber"
                                       [textMask]="{ mask: MaskingResource.AccountNumber }"
                                       pgeAutoMaskingCursor
                                       (ngModelChange)="onInputChanged()"
                                       [(ngModel)]="OnlineRegistration.AccountNumber"
                                       [ngClass]="{ 'ng-blurred' : residentialRegistrationForm.submitted || accountNumberInput.touched }" />
                            </div>
                        </div>
                    </li>
                </ol>
            </li>
        </ol>
    </fieldset>
</form>
<browser-back [lastpage]="false" redirecturl="/AccountInformation"></browser-back>

Basically when I click on the Radio button: byPhoneNumberOption, then it should be checked and radio button byAccountNumberOption should be unchecked and div: divPhoneIdentification should be visible and divAccountIdentification should invisible, similar but oppose thing should happen when we click on the byAccountNumberOption radio button.
Here I am trying to compare this with enum, and passing IdentificationType.PhoneNumber when byPhoneNumberOption radio is clicked
and IdentificationType.AccountNumber when byAccountNumberOption radio is clicked, depending upon this value I am trying to change the check status of radio buttons and visibility of the divs, any help would be very very helpful, I have declared the variables and imported the files properly, something else must be the problem.
When I am trying to see the below method:
public onModelChange(): void {
    debugger;
    if (this.IdentificationType === IdentificationType.PhoneNumber) {
        this.IsIdentifiedByPhoneNumber = true;
        this.IsIdentifiedByAcctNumber = false;
    }
    else if (this.IdentificationType === IdentificationType.AccountNumber) {
        this.IsIdentifiedByPhoneNumber = false;
        this.IsIdentifiedByAcctNumber = true;
    }
    if (this.VerificationType === VerificationType.Last4DigitsOfSSN)
        this.IsVerifiedByLast4DigitsOfSSN = true;
    else if (this.VerificationType === VerificationType.Last4DigitsOfDriversLicenseOrStateId)
        this.IsVerifiedByLast4DigitsOfDriversLicenseOrStateId = true;
}

this.IdentificationType value is coming as null instead of the value passed from the radios, where as this.VerificationType value is not coming as null, so, is there anything I am missing in the binding?
Any help would be very very helpful, thanks in advance friends.
QuestionAJAX,how to get more values from $.ajax({}) function in a Zend Controller Pin
serenimus25-Feb-19 8:49
serenimus25-Feb-19 8:49 
QuestionHow to identify if string is a phone number, Email address or a web address in Javascript? Pin
Member 1397526717-Feb-19 14:51
Member 1397526717-Feb-19 14:51 
SuggestionRe: How to identify if string is a phone number, Email address or a web address in Javascript? Pin
Richard MacCutchan17-Feb-19 22:05
mveRichard MacCutchan17-Feb-19 22:05 
AnswerRe: How to identify if string is a phone number, Email address or a web address in Javascript? Pin
Blikkies27-Feb-19 2:28
professionalBlikkies27-Feb-19 2:28 
QuestionAssignment help? Pin
Member 141452369-Feb-19 12:49
Member 141452369-Feb-19 12:49 
AnswerRe: Assignment help? Pin
Richard MacCutchan9-Feb-19 22:51
mveRichard MacCutchan9-Feb-19 22:51 
AnswerRe: Assignment help? Pin
ZurdoDev27-Feb-19 3:50
professionalZurdoDev27-Feb-19 3:50 
QuestionJavaScript Environment Pin
Member 141438347-Feb-19 21:44
Member 141438347-Feb-19 21:44 
AnswerRe: JavaScript Environment Pin
Richard MacCutchan7-Feb-19 22:31
mveRichard MacCutchan7-Feb-19 22:31 
QuestionJavaScript in Microsoft Visual Studio Pin
Member 141438347-Feb-19 21:43
Member 141438347-Feb-19 21:43 
AnswerRe: JavaScript in Microsoft Visual Studio Pin
Richard MacCutchan7-Feb-19 22:29
mveRichard MacCutchan7-Feb-19 22:29 
QuestionSimple Modal Dialog Pin
Bram van Kampen31-Jan-19 11:58
Bram van Kampen31-Jan-19 11:58 
AnswerRe: Simple Modal Dialog Pin
Richard Deeming8-Feb-19 1:09
mveRichard Deeming8-Feb-19 1:09 
QuestionCalling Web api from Angular Service and Component Pin
simpledeveloper29-Jan-19 7:07
simpledeveloper29-Jan-19 7:07 
QuestionFor loop query Pin
Member 1413327128-Jan-19 22:54
Member 1413327128-Jan-19 22:54 
QuestionRe: For loop query Pin
Richard MacCutchan28-Jan-19 23:35
mveRichard MacCutchan28-Jan-19 23:35 
AnswerRe: For loop query Pin
ZurdoDev30-Jan-19 2:08
professionalZurdoDev30-Jan-19 2:08 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.