topic Using Jquery in an Info Window in ArcGIS JavaScript Maps SDK Questions

Using Jquery in an Info Window

deleted-user-K_IRAXrpGKsG — Tue, 31 Jan 2012 20:24:42 GMT

Hello, I am developing a campus map and need some help! I am attempting to add a jquery slider in an info window to give the user a "more information" option" However, I'm not quite sure how to add ta jquery element into a info window. Can someone please tell me what's wrong with this code?

   var infoTemplate = new esri.InfoTemplate();
        infoTemplate.setTitle("<b>${BldgName}</b>");
        infoTemplate.setContent("${Type}<br/>"
  + "${Hours}<br/>"
  + $(document).ready(function(){
    $(".flip").click(function(){
                                $(".panel").slideToggle("slow");
                         });
                   })
  );

Re: Using Jquery in an Info Window

StephenLead — Sat, 11 Dec 2021 08:04:47 GMT

Patrick,

I'm not an expert on jQuery, but I think you might want to put the jQuery code outside of the infoWindow, and in the main JS section of your page:

<script type="text/javascript">
$(document).ready(function(){
 $(".flip").click(function(){
         $(".panel").slideToggle("slow");
        });
})

Re: Using Jquery in an Info Window

MattDriscoll — Sat, 11 Dec 2021 08:04:50 GMT

the .click function likely won't work unless the .flip selector is in the HTML DOM on page load. I would use the .on function to handle this. This will apply to any elements with the class flip that are inserted after page load.

$(document).ready(function(){
  $(document).on('click', '.flip', function(){
      $(".panel").slideToggle("slow");
  });
});