24 Replies Latest reply on Mar 1, 2018 8:35 AM by itsallbroken

    How to prevent JS people picker from closing my Tile Action dialog?

    dbreen

      Hi,

       

      I am using the OSAPI Jive Core V3 Picker JS dialog to pull up the Person picker.  The button that does so is part of my Tile action.  When the button is clicked, the Person picker pops up correctly, but my underlying Tile action dialog closes by itself.  Is there a way to prevent this?  I need to capture the Person information so I can have my action send back this person data to my Node.js app.

       

      Here's the code in my action.js that triggers the picker:

       

          $("#btn_choose_to").click(function () {

            osapi.jive.corev3.people.requestPicker({

              success: function(data) { console.log('success: '+JSON.stringify(data)); },

              error: function(data) { console.log('error: '+JSON.stringify(data)); },

              multiple: true

            });

          });

       

      Thanks,

      Devin

       

      Ryan Rutan Rashed Talukder Andrew Mishalove

        • Re: How to prevent JS people picker from closing my Tile Action dialog?
          dbreen

          Bump Ryan Rutan Rashed Talukder -- I have 90 minutes left to finish my hackathon project.  I'd love to figure this part out if possible, thanks.

           

          Andrew Mishalove

          • Re: How to prevent JS people picker from closing my Tile Action dialog?

            Sorry guys ... looked into the source code and dont see any parameter options you can pass in to control this behavior.  Not sure if you tried "return false;" in any of your callback methods to see if that affects the behavior?

             

            osapi.jive.corev3.people.requestPicker = function(options) {

                options = options || {};

                var success = options.success || function() {};

                var error   = options.error   || function() {};

                var pickerOptions = {};

                pickerOptions.multiple = options.multiple || false;

             

             

                // Take the osapi.jive.corev3.people.Person object(s) returned from pickerCallback

                // and execute the originally requested callback function

                var personLoaderCallback = function(data) {

                    if (data && !data.error) {

                        success(data);

                    }

                    else {

                        error(data && data.error || {message:"unknown error"});

                    }

                }

             

                // Take the data returned by the picker and convert to full osapi.jive.corev3.people.Person object(s)

                var pickerCallback = function(data) {

                    if (data.users.length == 1) {

                        osapi.jive.corev3.people.get({ id : data.users[0].userID }).execute(function(response) {

                            personLoaderCallback(response);

                        })

                    }

                    else if (data.users.length > 1) {

                        var results = [ ];

                        var ids = "";

                        for (var i = 0; i < data.users.length; i++) {

                            if (ids != "") {

                                ids += ",";

                            }

                            ids += "" + data.users[i].userID;

                        }

                        var href = '/people?ids=' + ids;

                        console.log("href=" + href);

                        var response = osapi.jive.core.get({

                            href : href,

                            v : 'v3'

                        }).execute(function(response) {

                            personLoaderCallback(response);

                        });

                    }

                }

                gadgets.rpc.call(null, "request_user_picker", pickerCallback, pickerOptions);

            }

              • Re: How to prevent JS people picker from closing my Tile Action dialog?
                bradwarren

                Hey Ryan, thanks for the response!  return false; doesn't seem to help me.

                 

                While i originally mentioned my problem was "exactly" the same its a bit different.  Maybe adding a bit of detail can help point me to what i'm doing wrong (which is probably very simple...  i'm just now getting around to learning how to make tiles and may be missing something obvious as to how this works)

                 

                I'm trying to use a Place Picker in the configuration options.  I'm starting from tile-app-internal using the SDK and i added a button in configuration.html and then in configuration.js I added a click event handler for that button that opens the place picker.  The place picker opens and as long as my first click is on the name of a space it successfully returns a place object to my config window but any other click causes the underlying config window to close without waiting for the picker response.

                 

                A snippet of my configuration.js :

                 

                (function() {
                    jive.tile.onOpen(function(config, options ) {
                        gadgets.window.adjustHeight();
                
                
                        $("#placepick").click(function() {
                
                            osapi.jive.corev3.places.requestPicker({
                               type : "space",
                               error: function() {
                                    console.log('place picker callback error');
                               },
                               success : function(data) {
                                    console.log('place picker callback success');
                
                
                                      // do something with the place data
                               }
                           });
                      
                       });
                        // update config object after clicking submit
                        $("#btn_submit").click( function() {
                
                            // save config data
                
                            jive.tile.close(config, {} );
                        });
                    });
                
                
                })();
                
                  • Re: How to prevent JS people picker from closing my Tile Action dialog?
                    bradwarren

                    Ryan Rutan, wanted to follow up and let you know that I found my problem.  The issue Devin and I both reported seems to only affect the people picker and place picker.  When I replaced my place picker with the search content picker (osapi.jive.corev3.search.requestPicker) i no longer have the problem.

                     

                    So there is something different happening with the search picker that gives it focus while the other 2 keep focus on the config panel.  In fact, i forgot to mention and include in my snippet above that my place picker was actually showing up behind the config window so i had modified z-index to get it to show up above the config in the first place.

                      • Re: How to prevent JS people picker from closing my Tile Action dialog?
                        Eric Pierce

                        The search.requestPicker doesn't seem to be recognizing our mouse and is only controllable through the keyboard. Did you happen to run into this problem?

                        • Re: How to prevent JS people picker from closing my Tile Action dialog?
                          sscullion
                          my place picker was actually showing up behind the config window so i had modified z-index to get it to show up above the config in the first place

                          Hi Brad Warren, wondering if you recall how you did this? I'm hitting the same issue and feel I'm missing something obvious in getting the z-index change to take!

                           

                          Thanks!

                            • Re: How to prevent JS people picker from closing my Tile Action dialog?
                              bradwarren

                              Hi Simon Scullion, I don't remember off the top of my head how I did it but could probably track it down.  That said, changing the z-index did not end up really solving the underlying problem.  Even after getting the picker to appear above the config window by modifying z-index i still had this problem :

                               

                              The place picker opens and as long as my first click is on the name of a space it successfully returns a place object to my config window but any other click causes the underlying config window to close without waiting for the picker response.

                               

                              So for now, I'd recommend using only the Search picker (search.requestPicker) instead of Place or People pickers in a tile config.  You can put params on the search picker (see my other comment below) to have it only search people or places to "sort of" emulate a people picker even though the UI is not the same and forces the user to do a search instead of browsing.  I'm hoping Jive will eventually address this as I couldn't find any way to get the Place picker to actually work in a Tile config.

                              1 person found this helpful
                                • Re: How to prevent JS people picker from closing my Tile Action dialog?
                                  sscullion

                                  Thanks Brad, I'll give that a bash and see how we get on.

                                   

                                  Still interested in the z-index fix if you get a sec and find it, it's driving me crazy not spotting what I'm getting wrong! LOL

                                    • Re: How to prevent JS people picker from closing my Tile Action dialog?
                                      bradwarren

                                      I did a quick glance through my old commits for the project I worked on and found this code.  This was my original attempt at using a Place Picker in the configuration screen.  This is the click handler for my search_placepick button.  Note in particular this line :

                                       

                                        $(".j-pop-tileConfig", parent.document).css('z-index','1000');

                                       

                                      Since your config JS is running inside the tile iframe and the picker opens in the parent, you have to target the container using parent.document.  At least thats what i remember having to do after looking at this again.  I didn't try to run this again to test, just pasting here from my old commit.  Let me know if it works .

                                       

                                      $("#search_placepick").click(function(e) {

                                       

                                        e.preventDefault();

                                       

                                        $(".j-pop-tileConfig", parent.document).css('z-index','1000');

                                       

                                        osapi.jive.corev3.places.requestPicker({

                                            type : "space",

                                            error: function() {

                                              console.log('place picker callback error');

                                            },

                                            success : function(data) {

                                              console.log('place picker callback success');

                                                  // "data" will be the Space object (in this case) selected by the user

                                                $("#search_placename").html(data.name);

                                                $("#search_placeid").val(data.placeID);

                                            }

                                        });

                                       

                                       

                                      });

                                      2 people found this helpful
                          • Re: How to prevent JS people picker from closing my Tile Action dialog?
                            jordan.van.bergen@copaco.com

                            Devin Breen / Brad Warren Did you guys ever solve this? I am running into the same issue currently.

                            • Re: How to prevent JS people picker from closing my Tile Action dialog?
                              itsallbroken

                              Hey guys,

                               

                              I'm having a similar issue with using the requestPicker on the tile config page, reading through it appears to be the same problem so feel free to let me know if it isn't.

                               

                              I have tried the Place and the Search but both present the same issue, they both pop the requestPicker as expected but as soon as i try to select something thats not on the initial list (click on 5 more for example) the requestPicker remains on screen but my configuration popup disappears.

                               

                              Can anyone confirm if this is in fact the same issue and if a solution has been found please?

                               

                              Thanks

                              Gareth