Click here to Skip to main content
14,452,924 members
Rate this:
Please Sign up or sign in to vote.
On my current Angular page I have a select dropdown which is autopopulated with addresses that currently exists for a client, with the final option being "Add New Address". When this is clicked, a modal window is shown where a new address can be entered. When the address is saved it should be added to the dropdown and selected by default.

I've searched online but haven't been able to find anything that worked. Any guidance would be greatly appreciated.

Thanks in advance.

What I have tried:

Currently this is the method that is executed when the new address is saved:
<pre lang="Javascript">addressSubmitted(form: FormGroup) {
      var addressLine1 = form.controls['address'].value;
      var addressLine2 = form.controls['address2'].value;
      addressLine2 = addressLine2.trim();
      var city = form.controls['city'].value;
      var stateId = form.controls['state'].value;
      var state = this.SelectedState; //form.controls['state'].find()
      var postalCode = form.controls['zip'].value;

      var fullAddress = addressLine1 + ', ';
      if('' != addressLine2){
        fullAddress = fullAddress + addressLine2 + ', ';
      fullAddress = fullAddress + city + ', ' + state + ' ' + postalCode
      this.servicePNotify.error("Error","New address information is not complete");

The dropdown in the popupForm form is named address_select and is the control that should have the new address added.
Updated 15-Apr-19 16:17pm

1 solution

Rate this:
Please Sign up or sign in to vote.

Solution 1

Your list of addresses should be a collection that exists in code. It would need two way binding. You can then add the new item to the collection and it will rebind and show it. You didn't post your template, does it have a way to set the selected item? This should also be a variable you can then change in your typescript code.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100