JQueryUI передает динамический селектор в диалог - PullRequest
Новая
       16

JQueryUI передает динамический селектор в диалог

0 голосов
/ 13 января 2011

Хорошо, поэтому, когда пользователь нажимает кнопку «Добавить», поскольку это относится к записи, предполагается, что «Добавить» получает и использует DIV ID, связанный с этой записью. Я довольно близок к тому, чтобы заставить его работать, но мне просто нужно динамически передать селектор.

Как бы вы могли передать свой селектор динамически, хотя? 

<tr>
    <td>1/1/0001</td>
    <td>SOME FName</td>
    <td>SOME LNAME</td>
    <td>SKIN TW</td>
    <td>SOMEID</td>
    <td>1/7/2009</td><td>Graph Trend View <a href="#" id="dialog_3333333" class="ui-state-default ui-corner-all">Add</a></td>
    <td class="hide-cell">
    <!-- ui-dialog -->
   <div id="dialog_3333333_message" title="3333333 THOMAS LNAME">
    <p>3333333 THOMAS LNAME, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
   </div>            
    </td>
</tr>

    <tr>
        <td>6/21/2010</td>
        <td>EMERY</td>
        <td>LNAMED</td>
        <td>RAND E</td>
        <td>77777777777</td>
        <td>1/7/2009</td><td>Graph Trend View <a href="#" id="dialog_77777777777" class="ui-state-default ui-corner-all">Add</a></td>
        <td class="hide-cell">
        <!-- ui-dialog -->
       <div id="dialog_77777777777_message" title="77777777777 EMERY RANDOLPH">
        <p>77777777777 EMERY LNAME, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
       </div>            
        </td>
    </tr>

Я довольно близок к решению, но не могу обойти это препятствие? 

    $(function() {

      // Dialog
      **// This is where the dynamic selector needs to be passed in**
    $('#dialog_33333333_message').dialog({
        autoOpen: false,
        resizable: false,
        height: 260,
        modal: true,
        width: 240,
        buttons: {
          "Compare Carriers": function() {
            $(this).dialog("close");
          },
          "Save": function() {
            $(this).dialog("close");
          }
        }
      });

      // Dialog Link
      $('.ui-state-default').click(function() {

   var target = $(this).attr("id");   

      alert(target);

   $('#' + target + '_message').dialog('open');
        return false;
      });

      //hover states on the static widgets
      $('.ui-state-default').hover(
         function() { $(this).addClass('ui-state-hover'); },
         function() { $(this).removeClass('ui-state-hover'); }
        );
    });

Вот что я имею в виду под тем, как близко я. http://tinypic.com/r/2hs2o0i/7 Перейти к изображению, я новичок в публикации

1 Ответ

0 голосов
/ 13 января 2011

Вы можете использовать селектор, который отражает шаблон, который есть у диалога div ( $ ('div [id ^ = "dialog _"). Dialog () ), и использовать его, как показано ниже: 

$(function () { 
    $('div[id^="dialog_").dialog({
        autoOpen: false,
        resizable: false,
        height: 260,
        modal: true,
        width: 240,
        buttons: {
            "Compare Carriers": function () {
                $(this).dialog("close");
            },
            "Save": function () {
                $(this).dialog("close");
            }
        }
    }); // Dialog Link      
    $('.ui-state-default').click(function () {
        var target = $(this).attr("id");
        alert(target);
        $('#' + target + '_message').dialog('open');
        return false;
    });
    //hover states on the static widgets    
    $('.ui-state-default').hover(function () {
        $(this).addClass('ui-state-hover');
    }, function () {
        $(this).removeClass('ui-state-hover');
    });
});
...