0

In an Angular application I have a form filters (multi select directive). Whenever a filter value is selected, it has to be included in the URL.

The goal is to be able to copy the URL with the form parameters and values and being able to send it to another client.
In this way the second client would open the same page and all its fields would be already filled with the same values used by the first client.

At the moment every value selection triggers a function that encodes the parameter and the relative value and adds it to the current URL.

 function obj_to_query(obj) {
      var parts = [];
      for (var key in obj) {
          if (obj.hasOwnProperty(key)) {

               for (var i = 0; i < obj[key].Keys.length; i++) {

                   if (encodeURIComponent(obj[key].FilterType) == 1) {
                        parts.push(encodeURIComponent("areas=" + obj[key].Keys[i]));
                      } 
                   else if (encodeURIComponent(obj[key].FilterType) == 2) {
                        parts.push(encodeURIComponent("categories=" + obj[key].Keys[i]));
                      } 
                   }
                }
            }

            return "?" + parts.join('&');
        }

Is there a better way to achieve the same result?

Francesco
  • 9,947
  • 7
  • 67
  • 110
  • Not a good approach due to URI limitations http://stackoverflow.com/questions/417142/what-is-the-maximum-length-of-a-url-in-different-browsers - try to persist your form in a backend. Create an unique hash on that form data. The hash could be parsed in an URL which points to a specific form data set in your backend. – lin Mar 01 '17 at 17:00
  • Thanks lin for the comment. However the main benefit of the URL approach is that the user can simply copy/paste it and pass it to another colleague to view the same form. Having to persist the form in the DB, would mean that I have to make a roundtrip to the DB everytime a single value of the form is changed. – Francesco Mar 06 '17 at 06:50

0 Answers0