From 99f5384785c37a59ddd18e631a24362c9a82c89a Mon Sep 17 00:00:00 2001
From: Abhijeet2019 <47414994+Abhijeet2019@users.noreply.github.com>
Date: Fri, 30 Sep 2022 16:01:31 +0530
Subject: [PATCH 1/3] Solve bug multiple selector in same designer view

Bug in Sitefinity having multiple sf-media-selector in same designer view (document/videos) always update first sf-media-selector element.
Also bug present when having autoOpenSelector attribute presents always open first sf-media-selector.
---
 .../fields/media-field/sf-media-field.js        | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js b/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
index 29a4ea715..dcde5987c 100644
--- a/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
+++ b/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
@@ -117,7 +117,9 @@
                     scope.mediaItemDeleted = false;
 
                     var autoOpenSelector = attrs.sfAutoOpenSelector !== undefined && attrs.sfAutoOpenSelector.toLowerCase() !== 'false';
-
+                    
+                    var mediaElement = element;
+                    
                     var mediaType = sfMediaTypeResolver.get(scope.sfMediaType);
 
                     var getDateFromString = function (dateStr) {
@@ -277,7 +279,18 @@
                             scope.model.filterObject.status = attrs.sfMaster === 'true' || attrs.sfMaster === 'True' ? 'master' : 'live';
                         }
 
-                        var mediaSelectorModalScope = angular.element('.mediaSelectorModal').scope();
+                        var mediaSelector = angular.element('.mediaSelectorModal');
+
+                        //Add below lines of code to solve multiple sf-media-field selector in same designer view
+                        if (mediaElement && mediaElement.length > 0) {
+                            var el = mediaElement[0].querySelector('.mediaSelectorModal');
+                            if (el) {
+                                var ngEl = angular.element(el);
+                                if (ngEl) {
+                                    mediaSelector = ngEl;
+                                }
+                            }
+                        }
 
                         if (mediaSelectorModalScope)
                             mediaSelectorModalScope.$openModalDialog();

From 7a31491ed5a53261cff7cf6a7810361910068a98 Mon Sep 17 00:00:00 2001
From: Abhijeet2019 <47414994+Abhijeet2019@users.noreply.github.com>
Date: Fri, 30 Sep 2022 16:13:04 +0530
Subject: [PATCH 2/3] Update sf-media-field.js

---
 .../client-components/fields/media-field/sf-media-field.js    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js b/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
index dcde5987c..a12374fc1 100644
--- a/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
+++ b/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
@@ -279,7 +279,7 @@
                             scope.model.filterObject.status = attrs.sfMaster === 'true' || attrs.sfMaster === 'True' ? 'master' : 'live';
                         }
 
-                        var mediaSelector = angular.element('.mediaSelectorModal');
+                        var mediaSelectorModalScope = angular.element('.mediaSelectorModal');
 
                         //Add below lines of code to solve multiple sf-media-field selector in same designer view
                         if (mediaElement && mediaElement.length > 0) {
@@ -287,7 +287,7 @@
                             if (el) {
                                 var ngEl = angular.element(el);
                                 if (ngEl) {
-                                    mediaSelector = ngEl;
+                                    mediaSelectorModalScope = ngEl;
                                 }
                             }
                         }

From c5a99bdd11bf630723ada7944bc56a6485ee0400 Mon Sep 17 00:00:00 2001
From: Abhijeet2019 <47414994+Abhijeet2019@users.noreply.github.com>
Date: Fri, 30 Sep 2022 16:15:16 +0530
Subject: [PATCH 3/3] Update sf-media-field.js

---
 .../client-components/fields/media-field/sf-media-field.js  | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js b/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
index a12374fc1..0f91a2a5c 100644
--- a/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
+++ b/Telerik.Sitefinity.Frontend/client-components/fields/media-field/sf-media-field.js
@@ -279,7 +279,7 @@
                             scope.model.filterObject.status = attrs.sfMaster === 'true' || attrs.sfMaster === 'True' ? 'master' : 'live';
                         }
 
-                        var mediaSelectorModalScope = angular.element('.mediaSelectorModal');
+                        var mediaSelector = angular.element('.mediaSelectorModal');
 
                         //Add below lines of code to solve multiple sf-media-field selector in same designer view
                         if (mediaElement && mediaElement.length > 0) {
@@ -287,11 +287,13 @@
                             if (el) {
                                 var ngEl = angular.element(el);
                                 if (ngEl) {
-                                    mediaSelectorModalScope = ngEl;
+                                    mediaSelector = ngEl;
                                 }
                             }
                         }
 
+                        var mediaSelectorModalScope = mediaSelector.scope();
+
                         if (mediaSelectorModalScope)
                             mediaSelectorModalScope.$openModalDialog();
                     };