Вопрос об обновлении UI ASP.net

Я использую флажок и список флажков на одной из моих веб-страниц.Вопрос об обновлении UI ASP.net

Пользовательский интерфейс похож

Цвет - Заголовок Checkbox

CheckBoxList элементы

Красный

Зеленый

Синий

Желтый

Полный выбор - щелчок по заголовку флажок выбирает/отменяет выбор всего списка флажков.

Частичный выбор флажка показывает флажок заголовка с другим цветом фона для указания частичного выбора.

Я проверил количество выбранных элементов в каждом из изменений в списке выбора флажка. В среде клиентского сервера есть временная задержка, и если мы сделаем два непрерывных выбора в списке флажков, обновление для элемента управления заголовка будет выполнено для первого выбора, а по истечении времени пользовательского интерфейса второй выбор исчезнет. Я также реализовал вышеупомянутый, используя JavaScript, но тогда и поведение такое же. Что может быть альтернативой этому?

источник

2012-03-15 MithunRaj

Я прочитал это в два раза и до сих пор не имеют ни малейшего понятия, что вы говорите. http://www.whathaveyoutried.com – Marc

, о котором вы говорили? –

нужна дополнительная информация. чего вы пытаетесь достичь? что происходит за сценой (при нажатии на флажок) и т. д. –

Ваш вопрос не особо понятен, но похоже, что вы хотите установить флажок в виде трех состояний? Это также звучит так, как происходит обратная передача и уничтожение второго выбора?

Если да, есть некоторые варианты контроля. Вот ссылка на тот, который может помочь. http://www.chadscharf.com/index.php/2008/10/3-state-checkbox-using-microsoft-ajax/

Вам действительно нужно опубликовать код и ссылку на снимки экрана, которые вы упомянули.

источник

2012-03-15 13:01:56 Chuck

Спасибо за ваш ответ. Да, я пытаюсь добиться чего-то вроде трех состояний. Я не смог прикрепить скриншоты. – MithunRaj

Существует два сценария, которые вы пытаетесь удовлетворить, а самый простой подход - использование Javascript. Конечно, в одном направлении используется JQuery для упрощения проводки элементов DOM.

Ниже приведен пример, который относится к двум сценариям. Один элемент управления верхнего уровня проверяет/отменяет все элементы. Во-вторых, люди меняют фон элемента верхнего уровня. Это не падение и запуск кода, он просто демонстрирует технику в изоляции. Изменения и настройки, которые я оставляю вам +, если вы не знакомы с JQuery: просто выполните поиск по каждой функции на сайте Jquery. Наслаждайтесь!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script> 

    <script type="text/javascript"> 
     $(document).ready(function(){  

      // Wire up the 'select-all' to the child elements 
      $('#topLevel').bind('change' , function(){ 
       // Record this object 
       var base = this; 
       // Change the child elements 
       $('#checkboxContainer input').each(function(){ 
        $(this).attr('checked' , $(base).is(':checked')) 
       })     
      }); 

      // Make the individual checkbox selects alter the 
      // background of the top-level wrapper 
      $('#checkboxContainer input').bind('change' , function(){ 
       // Get a handle to the top item 
       var topLevel = $('#topLevelWrapper');     
       // Have we selected the item? 
       if($(this).is(':checked')){ 
        // Remove the previous class assignments 
        topLevel.attr('class' , ''); 
        // Assign the current css class from the parent 
        topLevel.addClass($(this).parent().attr('class'));       
       } 
      }); 

     }) 
    </script> 

    <style type="text/css"> 
     .Red{ 
      background-color:#F00; 
     } 
     .Green{ 
      background-color:#0F0; 
     } 
     .Blue{ 
      background-color:#00F; 
     } 
    </style> 
</head> 
<body> 

    <div id="topLevelWrapper"> 
     <label for="topLevel">Top level selection</label> 
     <input type="checkbox" id="topLevel" /> 
    </div> 

    <div id="checkboxContainer"> 
     <ul> 
      <li class="Red"> 
       <label for="topLevel">Red</label> 
       <input type="checkbox" /> 
      </li> 
      <li class="Blue"> 
       <label for="topLevel">Blue</label> 
       <input type="checkbox" /> 
      </li> 
      <li class="Green"> 
       <label for="topLevel">Green</label> 
       <input type="checkbox" /> 
      </li> 

     </ul> 

    </div> 

</body>

источник

2012-03-15 14:20:12 SeanCocteau

Вопрос об обновлении UI ASP.net

ответ

Смежные вопросы