Проверить \ снять все элементы в списке - Visual Studio LightSwitch - PullRequest
Новая
       23

Проверить \ снять все элементы в списке - Visual Studio LightSwitch

0 голосов
/ 11 сентября 2018

Я использую Visual Studio LightSwitch 2015

Я добавил Countries Таблицу из SQL Server, и для каждого Country в Списке у меня есть CheckBox

Теперь я поместил CheckBox вверху списка, используя Custom Control

myapp.Countries.CheckAll_postRender = function (element, contentItem) {

var checkbox = $("<input type='checkbox'/>")
        .css({
            height: 20,
            width: 20,
            left:-26,
            margin: "45px"
        })
        .appendTo($(element));

};

Как я могу Select\DeSelect All CheckBoxes в списке с одним щелчком CheckBox вверху таблицы?

Любая помощь будет принята с благодарностью.

Ответы [ 2 ]

0 голосов
/ 11 сентября 2018

Хотя приведенный выше пример кода работает, вы можете сделать это быстрее, предполагая, что флажки, которые вы хотите проверить, являются единственными на странице (кроме флажка «проверить все»).

Ниже отмечены все флажки на странице, кроме "Отметить все". 

 $("#checkAll").click(function () {
     $('input:checkbox').not(this).prop('checked', this.checked);
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="checkAll">Check All
<hr />
<input type="checkbox" id="checkItem">Item 1
<input type="checkbox" id="checkItem">Item 2
<input type="checkbox" id="checkItem">Item3
0 голосов
/ 11 сентября 2018

Вот простой пример из этого поста Установите / снимите все флажки в jQuery 

$(document).ready(function() {
        $('#select-all').click(function(event) {  
            if(this.checked) { 
                $('.checkitem').each(function() { 
                    this.checked = true;     
                });
            }else{
                $('.checkitem').each(function() {
                    this.checked = false; 
                });        
            }
        });

    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
      <li><label>item-1</label><input name="checkbox-1" id="checkbox-1" type="checkbox" class="checkitem" /></li> 
      <li><label>item-1</label><input name="checkbox-2" id="checkbox-2" type="checkbox" class="checkitem"  /></li> 
      <li><label>item-1</label><input name="checkbox-3" id="checkbox-3" type="checkbox" class="checkitem"  /></li> 
      <li><label>item-1</label><input name="checkbox-4" id="checkbox-4" type="checkbox" class="checkitem"  /></li> 
    </ul>
    <input type="checkbox" name="select-all" id="select-all" /> Check all
...