Двойной щелчок по элементу div fancybox

Мое требование состоит в том, что при двойном щелчке по div другой div должен открываться как fancybox. Как это можно сделать в Jquery с rails 3.1

У меня есть следующая функция внутри document.ready()

$("#a1").dblclick(function () {
  $.get("/projects/edit/"+this.id,{
  u:$('#user').val()
  },
  function(data)
  {
  $("#edit_proj").fancybox();
  $("#edit_proj").html(data);

  });

Но div edit_proj не открывается в fancybox. Я не знаю, как открыть его в fancybox..

Спасибо


ruby-on-rails jquery fancybox
person UserROR    schedule 22.11.2012    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Я не знаю ни структуры вашего divs, ни того, существует ли <div id="edit_proj"></div> в структуре вашего документа или нет (хотя вы можете оценить это и динамически добавить div в родительский контейнер)... так что предполагаю, что у вас есть это (рендеринг html) структура :

<div id="a1">double click me</div>
<div id="container"></div>

... где #container является (будет) родителем div для #edit_proj, тогда вы можете попробовать этот скрипт

$("#a1").dblclick(function() {
    $.get("/projects/edit/" + this.id, {
        u: $('#user').val(),
    }, function(data) {
        if ($("#edit_proj").length == 0) {
            console.log("it doesn't exist"); // so append it
            $("<div id='edit_proj' />").appendTo("#container").html(data);
            $.fancybox("#edit_proj"); // fancybox
        } else {
            console.log("it does exist"); // so add data
            $("#edit_proj").html(data);
            $.fancybox("#edit_proj"); // fancybox
        }
    }); // get
}); // dblclick

См. JSFIDDLE.

ВАЖНО. Имейте в виду, что, поскольку вы используете контент inline, fancybox вернет <div id='edit_proj'></div> на свое место в структуре документа со свойством display:none;.

ПРИМЕЧАНИЕ. В этой демонстрации используется fancybox v2.1.3+.

person JFK    schedule 22.11.2012

arrow_upward
0
arrow_downward

убедитесь, что #edit_proj существует на вашей странице, также измените это

 $("#edit_proj").fancybox();
  $("#edit_proj").html(data);

к этому

  $("#edit_proj").html(data);
 $("#edit_proj").fancybox();
person rahul    schedule 22.11.2012