Adding parameter to url from form data

Help Requests
1

I was reading about route configuration, and I figured out how to make a parameter optional.

But what I cannot find is how to add the parameter to the URL based on a form value.

Use case: I’ve got a form where the user will enter some data to look up a customer.

I’d like to have the customer number be put into the url, so they can use that url to reload that specific customer.

How do I add a value from the form to the url so this can happen?

Here’s my route configuration in app.js:

configureRouter( config, router )
  {
    config.title = 'ARIS';
    config.options.pushState = true;
    config.options.root = '/';

    config.map([
      {
        route: '', 
        name: 'home', 
        moduleId: PLATFORM.moduleName('home'), 
        nav: true, 
        title: 'Home',
      },
      {
        route: 'login', 
        name: 'login', 
        moduleId: PLATFORM.moduleName('login'), 
        nav: false
      },
      {
        route: 'customer/:debtor_id?', 
        name: 'customer', 
        moduleId: PLATFORM.moduleName('customer'), 
        nav: true, 
        href: 'customer',
        title: 'Customer',
        activationStrategy: activationStrategy.invokeLifecycle,
        settings: {dropdown: true}
      },
      {
        route: 'report_as/:aris_id', 
        name: 'report_as', 
        moduleId: PLATFORM.moduleName('report_as'), 
        nav: false, 
        title: 'Report As',
//        activationStrategy: activationStrategy.invokeLifecycle,
      },
      {
        route: 'search', 
        moduleId: PLATFORM.moduleName('search'), 
        nav: true, 
        title: 'Search/Worklist',
        settings: {dropdown: true}
      },
      ]);

    config.mapUnknownRoutes('home');
    config.fallbackRoute('home');    
    this.router = router;
  }
1 Like
2

So how do you envision the workflow? A form with a bunch of fields and a button. After the user clicks this should only the address be updated or also a navigation performed?

Most likely the solution is as explained here https://stackoverflow.com/questions/39244796/aurelia-router-modify-route-params-and-address-bar-from-vm-with-router
Just wanted to make sure we fully understand your use case

1 Like
3

“So how do you envision the workflow? A form with a bunch of fields and a button. After the user clicks this should only the address be updated or also a navigation performed?”

The form has fields, but only one field will update the url. That is the debtor_id. I don’t know about a navigation being performed, because I’m reusing the page? As in, it reloads itself and fills itself out with data.

A navigation could be performed? But I am not sure how that would look.

1 Like
4

I should also note that I’m using httpClient to get info from a perl script on another web server.

That makes it interesting, because I need to get the info based on form data, and then reload the page.

1 Like
5

The stackoverflow question helped a lot.

I was able to get the url to change by using navigateToRoute.

I also added an activate section that handles if someone types straight into the url bar a debtor_id.

Thanks for all the help!

2 Likes