mvc2, запрос и вопрос qtip - PullRequest
Новая
       6

mvc2, запрос и вопрос qtip

0 голосов
/ 26 июля 2010

У меня проблема с тем, что в моем контроллере я устанавливаю значения в коллекции и сохраняю их во ViewData. например: 

ViewData["ex1"] = new SelectList(ex1); // a simple collection
ViewData["ex2"] = new SelectList(group.Members, "Id", "Gender");

Я передаю их в свой View и перебираю вот так. например: 

<div id="divListBox" style="overflow:auto; border:1px solid #CCCCCC; padding-left:5px; background-color:white; height: 130px"> 

          <%
            var list = this.ViewData["e2x"] as SelectList;
            var pList = this.ViewData["ex1"] as SelectList;

            foreach (var p in list)
            {
                foreach (var pil in pList)
                  {
                    if(pil.Text.Contains(p.Value)) // ex1 does contains ex2
                    {
                       %>
                        <input id="cbPerson" type="checkbox" value="<%= p.Value %>" />
                        <label for="cbPerson"><%= p.Text %></label>
                        <input id="cbPersonInfo" type="hidden" value="<%= pil.Text %>" /><br />  
                       <%
                    }
                  }
            }
          %>
        </div> ...

и вот мой jQuery. например: 

$('#divListBox > input').each(function() {
        var personInfo = $('#cbPersonInfo').val();
        $(this).append($('personInfo'));
            $('*').qtip('hide');
            $('#divListBox label').each(function() {
                $(this).qtip({
                    content: personInfo,
                    show: 'mouseover',
                    hide: 'mouseout',
                    style: {
                        classes: 'ui-tooltip-custom',
                        tip: true
                    },
                    position: {
                        my: 'left bottom',
                        at: 'top right'
                    }
                });
            });
        });

если я установлю свой тип ввода «скрытый» на «текст», я увижу правильную информацию для каждого из них. Тем не менее, когда я наводю на них курсор, первая информация отображается как всплывающая подсказка для всех из них. Я думаю, что это может быть моей jquery, но я не слишком уверен. Я занимаюсь этой проблемой часами и до сих пор ничего. Может кто-нибудь помочь, пожалуйста?

Ответы [ 2 ]

2 голосов
/ 27 июля 2010

Еогеасп: 

id="cbPerson" type="checkbox" value="<%= p.Value %>" />
<label for="cbPerson"><%= p.Text %></label>
id="cbPersonInfo" type="hidden" value="<%= pil.Text %>" /><br />

означает, что у вас несколько раз один и тот же идентификатор (идентификатор ВСЕГДА! Уникален), поэтому при выполнении выбора jquery для идентификатора Jquery выбирает первый найденный им

если вы поместите человека в контейнер, это будет еще проще.

Я сделал для вас быструю настройку, которую я тестировал и работал 

  %>
    <div class="person">
     <input id="cbPerson" type="checkbox" value="<%= p.Value %>" />
     <label for="cbPerson"><%= p.Text %></label>
     <input id="cbPersonInfo" type="hidden" value="<%= pil.Text %>" /><br />  
    </div>
    <%

<script type="text/javascript">
// for each container with class person
    $('.person').each(function () {
    //find the input with class cbPersonInfo which is !!!! IN !!!! $(this): $(this) is now the container 
        var personInfo = $(this).find(".cbPersonInfo").val();
        $(this).qtip({
            content: personInfo,
            show: 'mouseover',
            hide: 'mouseout',
            style: {
                classes: 'ui-tooltip-custom',
                tip: true
            },
            position: {
                my: 'left bottom',
                at: 'top right'
            }
        });
    });


</script>

Этот код означает: для каждого div с классом person найдите div внутри с классом cbPeronInfo и используйте его значение для qtip. (и, конечно, подключить подсказку к этому классу)

@ Edit

на самом деле, по семантическим причинам лучше использовать UL вместо (больше логики), но я предполагаю, что вы можете выяснить, как это изменить самостоятельно? если вы хотите иначе дать мне знак:)

0 голосов
/ 27 июля 2010

Для одного вашего внешнего цикла c # foreach (var pil в pList) {'будет воссоздавать один и тот же элемент' "/>
', возможно, несколько раз.

JavaScript var personInfo = $('#cbPersonInfo').val(); выбирает (и повторно выбирает один и тот же элемент несколько раз, таким образом, одну и ту же подсказку для всех наведений, в данном случае pil.Text

Если более чем одному элементу был присвоен один и тот же идентификатор, запросы, использующие этот идентификатор, выберут только первый соответствующий элемент в DOM. (http://is.gd/dM4EG)

Убедитесь, что все HTML-элементы на вашей странице имеют уникальные идентификаторы.

Редактировать: Быстрая ссылка для решения (http://craigsworks.com/projects/qtip_new/forum/take-tooltip-content-from-the-element-attributes-t-8.html). Обновит возможное решение позже сегодня. 

<% foreach (var qt in Model)
{%>
    <input id="cbPerson" type="checkbox" value="<%= qt.Value %>" />
    <label for="cbPerson" qTip="<%=qt.Text  %>"><%= qt.Text %></label>
    <input id="cbPersonInfo" type="hidden" value="<%= qt.Text %>" /><br />
<%} %>

<script type="text/javascript">
    $(document).ready(function () {
        $('[qTip]').each(function () { // Find all elements that have the qTip attribute (labels)
            var personInfo = $(this).attr('qTip');
            $(this).qtip({
                content: personInfo ,
                show: 'mouseover',
                hide: 'mouseout',
                position: { target: 'mouse' }
            }); 
        });
    });
</script>
...