diff --git a/backend/WebUI/api_webui.go b/backend/WebUI/api_webui.go
index 1b98e21e1b1e22eaa41b04dbf5ecb0a29ad34d4f..69470a0d23e5e37e0064bc79da0268ddafa825c7 100644
--- a/backend/WebUI/api_webui.go
+++ b/backend/WebUI/api_webui.go
@@ -302,6 +302,7 @@ func GetSubscriberByID(c *gin.Context) {
 	smfSelDataInterface := MongoDBLibrary.RestfulAPIGetOne(smfSelDataColl, filter)
 	amPolicyDataInterface := MongoDBLibrary.RestfulAPIGetOne(amPolicyDataColl, filterUeIdOnly)
 	smPolicyDataInterface := MongoDBLibrary.RestfulAPIGetOne(smPolicyDataColl, filterUeIdOnly)
+	flowRuleDataInterface := MongoDBLibrary.RestfulAPIGetMany(flowRuleDataColl, filter)
 
 	var authSubsData models.AuthenticationSubscription
 	json.Unmarshal(mapToByte(authSubsDataInterface), &authSubsData)
@@ -315,6 +316,8 @@ func GetSubscriberByID(c *gin.Context) {
 	json.Unmarshal(mapToByte(amPolicyDataInterface), &amPolicyData)
 	var smPolicyData models.SmPolicyData
 	json.Unmarshal(mapToByte(smPolicyDataInterface), &smPolicyData)
+	var flowRules []FlowRule
+	json.Unmarshal(sliceToByte(flowRuleDataInterface), &flowRules)
 
 	subsData = SubsData{
 		PlmnID:                            servingPlmnId,
@@ -325,6 +328,7 @@ func GetSubscriberByID(c *gin.Context) {
 		SmfSelectionSubscriptionData:      smfSelData,
 		AmPolicyData:                      amPolicyData,
 		SmPolicyData:                      smPolicyData,
+		FlowRules:                         flowRules,
 	}
 
 	c.JSON(http.StatusOK, subsData)
@@ -427,6 +431,17 @@ func PutSubscriberByID(c *gin.Context) {
 	smPolicyDataBsonM := toBsonM(subsData.SmPolicyData)
 	smPolicyDataBsonM["ueId"] = ueId
 
+	flowRulesBsonA := make([]interface{}, 0, len(subsData.FlowRules))
+	for _, flowRule := range subsData.FlowRules {
+		flowRuleBsonM := toBsonM(flowRule)
+		flowRuleBsonM["ueId"] = ueId
+		flowRuleBsonM["servingPlmnId"] = servingPlmnId
+		flowRulesBsonA = append(flowRulesBsonA, flowRuleBsonM)
+	}
+	// Replace all data with new one
+	MongoDBLibrary.RestfulAPIDeleteMany(flowRuleDataColl, filter)
+	MongoDBLibrary.RestfulAPIPostMany(flowRuleDataColl, filter, flowRulesBsonA)
+
 	MongoDBLibrary.RestfulAPIPutOne(authSubsDataColl, filterUeIdOnly, authSubsBsonM)
 	MongoDBLibrary.RestfulAPIPutOne(amDataColl, filter, amDataBsonM)
 	MongoDBLibrary.RestfulAPIPutOne(smfSelDataColl, filter, smfSelSubsBsonM)
diff --git a/frontend/src/pages/Subscribers/SubscriberOverview.js b/frontend/src/pages/Subscribers/SubscriberOverview.js
index 83f18aecf83a0d1c854b53acef13745a9e9a92c2..029ea7ba8e47295446d45f8208326f87f5b07632 100644
--- a/frontend/src/pages/Subscribers/SubscriberOverview.js
+++ b/frontend/src/pages/Subscribers/SubscriberOverview.js
@@ -54,14 +54,17 @@ class SubscriberOverview extends Component {
   // }
 
   /**
-   * @param subscriber  {Subscriber}
+   * @param subscriberData
    */
-  async updateSubscriber(subscriber) {
-    const result = await ApiHelper.updateSubscriber(subscriber.id, subscriber.plmn);
+  async updateSubscriber(subscriberData) {
+    this.setState({ subscriberModalOpen: false });
+
+    const result = await ApiHelper.updateSubscriber(subscriberData);
 
     if (!result) {
-      alert("Error updating subscriber: " + subscriber.id);
+      alert("Error updating subscriber: " + subscriberData["ueId"]);
     }
+    ApiHelper.fetchSubscribers().then();
   }
 
   /**
@@ -107,7 +110,7 @@ class SubscriberOverview extends Component {
                         <td style={{ textAlign: 'center' }}>
                           <Button variant="danger" onClick={this.deleteSubscriber.bind(this, subscriber)}>Delete</Button>
                          &nbsp;&nbsp;&nbsp;&nbsp;
-                        <Button variant="info" onClick={this.openEditSubscriber.bind(this)}>Modify</Button>
+                        <Button variant="info" onClick={this.openEditSubscriber.bind(this, subscriber.id, subscriber.plmn)}>Modify</Button>
                         </td>
                       </tr>
                     ))}
diff --git a/frontend/src/pages/Subscribers/components/SubscriberModal.js b/frontend/src/pages/Subscribers/components/SubscriberModal.js
index e93d97d9f87f3eadf5e25f35bc3e826c8c4c8a9d..44af569e165d04013014954208ee10570edc2a73 100644
--- a/frontend/src/pages/Subscribers/components/SubscriberModal.js
+++ b/frontend/src/pages/Subscribers/components/SubscriberModal.js
@@ -57,6 +57,65 @@ function flowRulesFromSliceConfiguration(sliceConfigurations) {
   return flowRules
 }
 
+function sliceConfigurationsFromSubscriber(subscriber) {
+  const defaultSingleNssais = subscriber["AccessAndMobilitySubscriptionData"]["nssai"]["defaultSingleNssais"] ? subscriber["AccessAndMobilitySubscriptionData"]["nssai"]["defaultSingleNssais"].map(nssai => {
+    return {
+      snssai: {
+        sst: nssai.sst,
+        sd: nssai.sd,
+        isDefault: true
+      }
+    }
+  }) : [];
+  const singleNssais = subscriber["AccessAndMobilitySubscriptionData"]["nssai"]["singleNssais"] ? subscriber["AccessAndMobilitySubscriptionData"]["nssai"]["singleNssais"].map(nssai => {
+    return {
+      snssai: {
+        sst: nssai.sst,
+        sd: nssai.sd,
+        isDefault: false
+      }
+    }
+  }) : [];
+
+  let sliceConfigurations = [ // merge
+    ...defaultSingleNssais,
+    ...singleNssais
+  ];
+
+  const sessionManagementSubscriptionData = subscriber["SessionManagementSubscriptionData"];
+
+  sliceConfigurations.forEach(sliceConf => {
+    const dnnConfigs = sessionManagementSubscriptionData.find(data => data.singleNssai.sst === sliceConf.snssai.sst && data.singleNssai.sd === sliceConf.snssai.sd).dnnConfigurations;
+    sliceConf.dnnConfigurations = Object.keys(dnnConfigs).map(dnn => {
+      let flowRules = [];
+      const flowRulesData = subscriber["FlowRules"];
+      if(flowRulesData && flowRulesData.length !== 0) {
+        flowRules = flowRulesData
+        .filter(rule => rule.snssai === snssaiToString(sliceConf.snssai) && dnn === rule.dnn)
+        .map(rule => {
+          return {
+            filter: rule.filter,
+            "5qi": rule["5qi"],
+            gbrUL: rule.gbrUL,
+            gbrDL: rule.gbrDL,
+            mbrUL: rule.mbrUL,
+            mbrDL: rule.mbrDL  
+          }
+        })
+      }
+      return {
+        dnn: dnn,
+        uplinkAmbr: dnnConfigs[dnn].sessionAmbr.uplink,
+        downlinkAmbr: dnnConfigs[dnn].sessionAmbr.downlink,
+        "5qi": dnnConfigs[dnn]["5gQosProfile"]["5qi"],
+        flowRules: flowRules
+      };
+    });
+  });
+
+  return sliceConfigurations;
+}
+
 class SubscriberModal extends Component {
   static propTypes = {
     open: PropTypes.bool.isRequired,
@@ -331,6 +390,7 @@ class SubscriberModal extends Component {
           OPOPcSelect: isOp ? "OP" : "OPc",
           OPOPc: isOp ? subscriber['AuthenticationSubscription']["milenage"]["op"]["opValue"] :
             subscriber['AuthenticationSubscription']["opc"]["opcValue"],
+          sliceConfigurations: sliceConfigurationsFromSubscriber(subscriber),
         };
 
         this.updateFormData(formData).then();
@@ -455,7 +515,11 @@ class SubscriberModal extends Component {
       "FlowRules": flowRulesFromSliceConfiguration(formData["sliceConfigurations"])
     };
 
-    this.props.onSubmit(subscriberData);
+    if(this.state.editMode) {
+      this.props.onModify(subscriberData);
+    } else {
+      this.props.onSubmit(subscriberData);
+    }
   }
 
   render() {
diff --git a/frontend/src/util/ApiHelper.js b/frontend/src/util/ApiHelper.js
index eea5ebb923001e5f6a66fcc5a9edde82cf021754..5dc35bae53b714d3ca84f15cc8f108cdc5d66364 100644
--- a/frontend/src/util/ApiHelper.js
+++ b/frontend/src/util/ApiHelper.js
@@ -46,9 +46,9 @@ class ApiHelper {
 
   static async updateSubscriber(subscriberData) {
     try {
-      let response = await Http.patch(
+      let response = await Http.put(
         `subscriber/${subscriberData["ueId"]}/${subscriberData["plmnID"]}`, subscriberData);
-      if (response.status === 201)
+      if (response.status === 204)
         return true;
     } catch (error) {
       console.error(error);