diff --git a/entries/static/entries/js/selectional_preference.js b/entries/static/entries/js/selectional_preference.js
index 2d50564babe31db6720c59c0dbecb758d60a6fcb..a8ef088454534aada338c83f81455ac14ae1af0b 100644
--- a/entries/static/entries/js/selectional_preference.js
+++ b/entries/static/entries/js/selectional_preference.js
@@ -3,6 +3,16 @@ var relations = [];
 var synsets = [];
 var change = false;
 
+function existingSelect() {
+    let availablePreferencies = slowal_frames2selecional_preferencies(unified_frame_active_frame, unified_view_frame_content)[unified_frame_active_argument_id];
+    if (!availablePreferencies) {
+        return gettext('Brak preferencji selekcyjnych do wyboru.')
+    }
+    return availablePreferencies.map(preference => {
+        return `<label><input type="checkbox" name="existing" value="${preference.type}:${preference.id}" /> ${preference.str}</label><br />`;
+    }).join("");
+}
+
 function predefinedSelect() {
     var display = "";
 
@@ -251,7 +261,7 @@ function addSelectivePreferenceBase(unified_frame, frame, complement_id) {
         },
         state4: {
             title: 'Wybierz z istniejÄ…cych',
-            html: 'TODO',
+            html: existingSelect(),
             buttons: { Anuluj: -1, Zatwierdź: 1 },
             focus: 1,
             submit: function(e,v,m,f){
@@ -261,9 +271,17 @@ function addSelectivePreferenceBase(unified_frame, frame, complement_id) {
                 }
                 if (v == 1) {
                     e.preventDefault();
-
-                    // TODO
-
+                    normalizeFormData(f.existing).map(choice => {
+                        let [type, id] = choice.split(':');
+                        switch (type) {
+                            case 'meanings.Synset':
+                                saveSynsetPreference(unified_frame_id, complement_id, id);
+                            case 'semantics.PredefinedSelectionalPreference':
+                                savePredefinedPreference(unified_frame_id, complement_id, id);
+                            case 'semantics.RelationalSelectionalPreference':
+                                saveRelationalSelectionalPreference(unified_frame_id, complement_id, null, null);  // TODO
+                        }
+                    });
                     $.prompt.goToState('state0');
                 }
             }
diff --git a/entries/static/entries/js/unification.js b/entries/static/entries/js/unification.js
index 2745f5e9d8ef0f72187738d27386181ded45160f..b544445a1ed658237eea4021c6bd0e56787e3e1e 100644
--- a/entries/static/entries/js/unification.js
+++ b/entries/static/entries/js/unification.js
@@ -298,8 +298,7 @@ function unifiedFrame2dom(unifiedFrame, slowal_frames) {
 
         let selecional_preferencies_poposition = slowal_frames2selecional_preferencies_mapping[argument.id]
         if(selecional_preferencies_poposition != null) {
-            let selectional_preference_proposition_html = create_selectional_preference_html(selecional_preferencies_poposition, '');
-            preferences_html += selectional_preference_proposition_html;
+            preferences_html += create_selectional_preference_html(selecional_preferencies_poposition, '');
         }
 
         // *** and we want to close the <td> here
@@ -314,7 +313,7 @@ function unifiedFrame2dom(unifiedFrame, slowal_frames) {
     return div;
 }
 
-function create_selectional_preference_html(preferences, additioan_css_class) {
+function create_selectional_preference_html(preferences, additional_css_class) {
     let preferences_html_local = '';
     for (var j in preferences) {
         var preference = preferences[j];
@@ -324,9 +323,9 @@ function create_selectional_preference_html(preferences, additioan_css_class) {
         }
         preferences_html_local += '<div class="preference py-2 px-1' + cls + '">';
         if (preference.url) {
-            preferences_html_local += ' <a class="synset-plwn '+additioan_css_class+'" href="' + preference.url + '" target="_blank">' + preference.str + '</a>';
+            preferences_html_local += ' <a class="synset-plwn '+additional_css_class+'" href="' + preference.url + '" target="_blank">' + preference.str + '</a>';
         } else {
-            preferences_html_local +=  ' <span class="'+additioan_css_class+'">' + preference.str +'</span>';
+            preferences_html_local +=  ' <span class="'+additional_css_class+'">' + preference.str +'</span>';
         }
         if (preference.info) {
             preferences_html_local += ' ' + tooltipped_info(preference.info);
diff --git a/entries/views.py b/entries/views.py
index f238216ba7e51ff5a08c89b9781fac1a019a3841..e8e75cf0e3b7b5484f5e6d8f0ada0caba8843616 100644
--- a/entries/views.py
+++ b/entries/views.py
@@ -516,11 +516,15 @@ def get_synset_def(synset):
 def get_prefs_list(argument):
     return sorted(
         ({
-            'str' : str(p),
+            'id'   : p.pk,
+            'type' : p._meta.label,
+            'str'  : str(p),
         } for p in argument.predefined.all()),
         key=lambda x: x['str']
     ) + sorted(
         ({
+            'id'   : s.pk,
+            'type' : s._meta.label,
             'str'  : str(s),
             # can be a new synset
             'url'  : None if s.id < 0 else 'http://plwordnet21.clarin-pl.eu/synset/{}'.format(s.id),
@@ -529,6 +533,8 @@ def get_prefs_list(argument):
         key=lambda x: x['str']
     ) + sorted(
         ({
+            'id'   : r.pk,
+            'type' : r._meta.label,
             'str'  : str(r),
             'info' : get_rel_pref_desc(r),
         } for r in argument.relations.all()),