Как отметить checkbx по клику на строку таблицы?

[Okkkks]

Ребята, подскажите, пожалуйста, как отметить/снять отметку  серверного  checkbxа по клику на строку таблицы?
Есть серверная табличка griedview. В табличке столбец с checkbx-ами (TemplateField).

Код:

<asp:GridView ID="gvCategory" runat="server" CssClass="Control"  onrowcreated="gvCategory_RowCreated">
      
        <Columns>
            <asp:TemplateField HeaderText="">
                <ItemTemplate>
                    <asp:CheckBox ID="cbSelect" runat="server" />
                </ItemTemplate>
            </asp:TemplateField>
        
        </Columns>
      
    </asp:GridView>

Вот код (как мне казалось должен был работать, но нет =((  ):

Код:

function ClickRow(CurrentRow, RowIndex)
{
            var check = CurrentRow.getElementByID("cbSelect");
            check.Checked = !check.Checked;
}

Пробовала так же писать document.getElementByID(<%=cbSelect.ClientID %>), но ничего не  получается =((

[Sla]

какой код формируется?
<label for="id_chekbox">Метка чекбокса</label><input type="chekbox" checked=checked" />
При выводе будет установлена "галка"
Кликая по метке или по полю чекбокса, галка то потухнет, то погаснет то снимется, то установится

[Okkkks]

На странице получается вот так:

Код:

<table class="Control"  id="ctl00_ContentPlaceHolder1_gvCategory" >
<tr onclick="javascript:ClickRow(this, 0);" >
<td>
                    <input id="ctl00_ContentPlaceHolder1_gvCategory_ctl02_cbSelect" type="checkbox" name="ctl00$ContentPlaceHolder1$gvCategory$ctl02$cbSelect" />
                       </td>
                </tr>
                    
<tr onclick="javascript:ClickRow(this, 1);">
<td>
                    <input id="ctl00_ContentPlaceHolder1_gvCategory_ctl03_cbSelect" type="checkbox" name="ctl00$ContentPlaceHolder1$gvCategory$ctl03$cbSelect" />
                       </td>
</tr>
</table>

[Sla]

tr onclick="javascript:ClickRow(this, ID_нужного_чекбокса);"

[Okkkks]

Спасибо. Сейчас попробую =)

Добавлено через 11 минут и 45 секунд:
Не помогло =((
Теперь на странице вот так:

Код:

<table class="Control"  id="ctl00_ContentPlaceHolder1_gvCategory" >
<tr onclick="javascript:ClickRow(this,cbSelect);" >
<td>
                    <input id="ctl00_ContentPlaceHolder1_gvCategory_ctl02_cbSelect" type="checkbox" name="ctl00$ContentPlaceHolder1$gvCategory$ctl02$cbSelect" />
                       </td>
                </tr>
                    
<tr onclick="javascript:ClickRow(this, cbSelect);">
<td>
                    <input id="ctl00_ContentPlaceHolder1_gvCategory_ctl03_cbSelect" type="checkbox" name="ctl00$ContentPlaceHolder1$gvCategory$ctl03$cbSelect" />
                       </td>
</tr>
</table>

но только checkbox всё равно не находится =((

[Sla]

Okkkks, читай внимательно...

tr onclick="javascript:ClickRow(this, ID_нужного_чекбокса);"
 а что у тебя?

<tr onclick="javascript:ClickRow(this,cbSelect);" >
         <td>
                    <input id="ctl00_ContentPlaceHolder1_gvCategory_ctl02_cbSelect"

и что ты чекаешь? (ха, прикольно чекаты по-украински - ждать)

[Okkkks]

но дело в том что я же изначально не знаю что у меня айдишник будет ctl00_ContentPlaceHolder1_gvCategory_ctl02_cbSelect
это же asp уже сам генерит. У меня изначально сказано что айдишник = cbSelect. Ладно если бы у меня было фиксированое число чекбоксов, тогда ещё можно было бы прописать вручную и то если их не много, но у меня их количество зависит от количества строк в таблице.

Добавлено через 2 минуты и 23 секунды:
Вот привязка функции к строке таблицы (при создании строки таблицы на сервере):

Код:

 e.Row.Attributes["onclick"] = string.Format("javascript:ClickRow(this, {0});", e.Row.Cells[0].FindControl("cbSelect").ID);

[Sla]

но дело в том что я же изначально не знаю что у меня айдишник будет ctl00_ContentPlaceHolder1_gvCategory_ctl02_cbSelect
это же asp уже сам генерит. У меня изначально сказано что айдишник = cbSelect. Ладно если бы у меня было фиксированое число чекбоксов, тогда ещё можно было бы прописать вручную и то если их не много, но у меня их количество зависит от количества строк в таблице.

Добавлено через 2 минуты и 23 секунды:
Вот привязка функции к строке таблицы (при создании строки таблицы на сервере):

Код:

  e.Row.Attributes["onclick"] = string.Format("javascript:ClickRow(this, {0});", e.Row.Cells[0].FindControl("cbSelect").ID);

Сам генерит... НЕ ВЕРЮ. Значит надо отключить генерацию айди или генерировать айди, а потом генерировать строку с чекбоксом

[Okkkks]

Свойства идентификатора

Серверные веб-элементы управления ASP.NET имеют следующие свойства, действующие как идентификаторы:

    *

      ID –— это идентификатор, который задается в разметке или путем установки свойства ID элемента управления;
    *

      UniqueID –— это идентификатор, который создается ASP.NET для использования кодом, работающим на сервере;
    *

      ClientID –— это идентификатор, который формируется ASP.NET для использования клиентским кодом (он отображается как значение атрибута id в HTML).  


а за идею отключения автогенерации большое спасибо.

назначила свойству ClientIDMode значение static ( теперь ClientID  равен ID = cbSelect), но достать чекбокс все равно не получается =((

[Okkkks]

ребят, я тут пробую вручную перебирать строчки...

 

Код:

function ClickRow(CurrentRow, RowIndex) {
 
    var table = document.getElementById("gvCategory");

    var listRow = table.getElementsByTagName("tr");
   
    var listColumn = listRow[RowIndex].getElementsByTagName("td");
 
    var el = listColumn[0];

    var check = el.getElementById("cbSelect");

    check.Checked = !check.Checked;
   
       
    }

таблицу находит, колекцию строк и столбцов возвращает, а дальше не идёт...=(( может вы видите где я не так что делаю?.. 

[Sla]

потому что
НЕ
check = el.getElementById("cbSelect");

а

check = document.getElementById("cbSelect");

[Okkkks]

Sla,  Спасибо =)) чекбокс наконец-то нашёлся =)))
 

[baldr]

Okkkks, оно вполне может быть null, поэтому не стоит применять операцию инвертирования..

[Okkkks]

а разве это не булевское значение(либо true либо false)?   чувствую себя совсем идиотом  

а ещё у меня проблема с передачей айдишника в функцию...

передаю так:

Код:

                CheckBox cb = (CheckBox)e.Row.Cells[0].FindControl("cbSelect");
                cb.ID +=  e.Row.RowIndex.ToString();
                e.Row.Attributes["onclick"] = string.Format("javascript:ClickRow({0});",  cb.ID);

принимаю так:

Код:

function ClickRow(ID) {
    alert(ID);
.....................
}

 
даж алерт не сробатывает =((  а если передаю туда номер строки всё работает.... прям чудеса...

Добавлено через 2 минуты и 33 секунды:
тут говорят, что всё таки булевское...

Описание свойства checked

Возвращает текущее значение флажка или переключателя. Вызывается
formName.checkboxName.checked
formName.radioButtonName[index].checked
forms[index].elements[index].checked

Возвращается значение true или false в зависимости от того, установлен или нет флажок.

[Sla]

не булевское... (что-то мне подсказывает)
По умолчанию on или off

[Okkkks]

ребят, у меня теперь новая проблема =((

чекбокс нашла, код отрабатывает, alert(check.Checked); возвращает true, а флажок на форме не рисуется =((( скажите скрипт вообще умеет рисовать или мне нужно это моё значение передавать на сервер и там выставлять?  

вот итоговый код:

Код:

function ClickRow(CurrentRow, ID) {

  
    var check = document.getElementById("cbSelect"+ID);
  
        check.Checked = !check.Checked;
        alert(check.Checked);
        
    }

on/off - говорят, что это значения свойства value для чекбокса, а checked = true/false.

[Sla]

Checked != checked

[Okkkks]

не поняла... меняем на противоположное.... я пробовала писать document.getElementById("cbSelect"+ID).Checked=true;  всё равно не рисует =(

[Sla]

метод checked, но не Checked

[Okkkks]

Sla, Спасибо огромное!!! За терпение и, конечно, за помощь!  =)) наконец-то заработало... Ура!!!! =))

[Sla]

та какое тут терпение...
это все шишки

ничего... еще все впереди, когда дойдешь до изменения атрибутов стиля элементов

[Okkkks]

Ну я надеюсь, что и в дальнейшем могу рассчитывать на вашу помощь=)) Ещё раз огромное спасибо =)

Ребят, я не знаю, может нужно было новую тему начать... перетащите, если сочтёте нужным... =))
У меня нарисовалась новая проблема =(
Скрипт отрабатывает от и до, но теперь сервер, который проверял и выбирал отмеченные чекбоксы в упор не видит изменений=(( просматривает и у всех  Checked=false(как при создании установлено по умолчанию, будто пользователь ничего и не выбирал)... =((
 
при создании строки таблицы меняю айдишник чекбокса cbSelect на cbSelectX, где Х - номер строки таблицы:

Код:

                CheckBox cb = (CheckBox)e.Row.Cells[0].FindControl("cbSelect");
                cb.ID += e.Row.RowIndex.ToString();

потом когда пользователь навыбирал и нажал кнопку нужно собрать выбраное:

Код:

            for (int i = 0; i < gvCategory.Rows.Count; i++)//цикл по таблице
            {

                CheckBox check = (CheckBox)grid.Rows[i].Cells[0].FindControl("cbSelect");//находим чекбоксы
              
                if (check.Checked)//отбираем отмеченые
                {}
            }

но  check.Checked всегда = false.

 если делать

Код:

CheckBox check = (CheckBox)grid.Rows[i].Cells[0].FindControl("cbSelect"+i);//находим чекбоксы

то вообще возвращает нуль. Никак не могу понять почесу скрипт не может договориться с сервером =(( Помогите, пожалуйста.... 

[Sla]

Это ты уже на сервере обрабатываешь?

Ты можешь вывести массив POST или GET после сабмита формы

[Okkkks]

Я сейчас ещё проверю.... я тут просто решила убрать скрипт и посмотреть что будет и похоже я где-то ещё нахимичила....


Ситуация такова:
Если убрать

Код:

                CheckBox cb = (CheckBox)e.Row.Cells[0].FindControl("cbSelect");
                cb.ID += e.Row.RowIndex.ToString();

 
тогда нормально работает. Может нельзя так менять айдишники?

[baldr]

Okkkks, вроде ж выяснили что "checked" - с маленькой буквы?

[Okkkks]

checked с маленькой в скрипте. на сервере с маленькой не знает

Добавлено через 4 минуты и 37 секунд:
Sla,

Это ты уже на сервере обрабатываешь?

Ты можешь вывести массив POST или GET после сабмита формы

в смысле нужно вручную передавать новое состояние чекбоксов? я надеялась что скрипт и сервер имеют равноправный доступ к свойствам контрола... эээхх...

[Sla]

как в ручную?
запрос с формы поступает  в массив GET или POST
соответсвенно ты должна обработать ВХОДНЫЕ данные
Сервер уже не знает о состоянии контролов

[Okkkks]

Sla,  нужно использовать Request... я правильно понимаю? А где там искать мои чекбоксы? в Params?

[Sla]

ну... наверное в REQUEST

[Okkkks]

=)) спасибо. буду искать =)

[Dimka]

Судя по коду, серверная часть пишется на C# - вероятно ASP.NET. В этом случае не надо ничего вручную анализировать в RequestString. Нужно правильно запрограммировать действия и, в первую очередь, инициализацию дочерних контролов на форме.

[Sla]

Dimka, я не знаю C# - ASP.NET

тогда подскажи, и мне, как это правильно
запрограммировать действия

или объясни, кто будет анализировать REQUEST?

и...
произошла автоматическая генерация id контрола (элемента), мне нужно с помощью js скрипта добраться до этого элемента по id, откуда я узнаю его id в коде C#

ps мне это не нужно... так на всякий случай, и описал существующую ситуацию у ТС

[Джон]

Это немного не так работает. ASP контрол создаётся на сервере и для него генерится HTML код. Все универсальные ClientID тоже создаются там, и через них сервер узнаёт контрол, отправивший сообщение (обрабатывает REQUEST). После этого он вызывает зарегистрированный обработчик для данного сообщения в C# коде. По окончании работы обработчика, сервер обновляет HTML код с учётом изменённых в обработчике данных, в котором, например, чекбокс = true. Если честно, то я тоже не понимаю, зачем при работе с ASP.NET мутить что-то с JS? GridView великолепно отправляет сообщения о своих Item-ах, а в C# работать ИМХО гораздо удобней.

Добавлено через 18 минут и 37 секунд:
Вот так, к примеру выглядит код для грида с кнопкой в каждой строке для удаления текущей позиции:

Код: (ASP)

                       
            <asp:TemplateField ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center"
                    ItemStyle-BorderWidth="1px" HeaderStyle-BorderWidth="1px" FooterStyle-BorderWidth="0px">
                <ItemTemplate>
                      <asp:ImageButton ImageUrl="Images/cart_remove_btn.png" runat="server" ID="_remove"
                                                CommandName="Remove" CommandArgument='<%# Eval("Id") %>' />
                 </ItemTemplate>
             </asp:TemplateField>

А вот обработчик:

Код: (C#)

        protected void _gridView_RowCommand(object sender, GridViewCommandEventArgs e)
        {
                if (e.CommandName == "Remove")
                {
                        MyViewModel.Remove(e.CommandArgument.ToString());
                }
        }

И всё. Не надо с JS отыскивать кнопку, и тд и тп.

[Dimka]

Разве что следует отметить, что из-за вложенности контролов и их автоматического повтора следует различать содержимое поля ID (это для сервера) и ClientID (это для JS). Второе поле хранит более сложный автоматически генерируемый идентификатор, уникальный в пределах HTML.

[Джон]

Да, конечно. Это как раз те самые "сложные" Id уже упомянутые Okkkks, например  "ctl00_ContentPlaceHolder1_gvCategory_ctl02_cbSelect".

[Sla]

а каким образом они попадают в клиентский код, при условии что мне нужно именно уникальный, заранее известный, т.е. ClientId

[Джон]

Слав, я думаю тут немного другая философия подхода. Зачем тебе нужно знать этот ClientId? Это часть контрола, который, да, будет представлен сервером в виде HTML кода (а как же иначе?). Но тебе зачем в него вникать? Всё, что нужно ты можешь сделать на сервере. А поменяв что-то не то у клиент, ты рискуешь прервать связь с объектом на сервере.

[Sla]

Мы говорим об web интерфейсе
Например,
мне нужно повесить обработчик js на событие onchange
при этом, если true (напрмиер, маскируемый ввод), то изменить состояние control  type=hidden на type=text

Как?

[Джон]

Слав, давай уточним, на onchage ASP.NET контролла? Я вот про что говорю. Ведь у него такое событие обрабатывается на сервере, в C# коде.

[Sla]

Web > Клиентские скрипты

Это тема

Следовательно, когда браузер получил html контент, то он уже ничего не знает о сервере (если не принимать особых усилий)

<input type=chekbox id=check1 onchange=func(text1)>
<input type=hidden id=text1>
<scriot>
function func(id){
getElementById(text1).type="text";
}
</script>

Вот, например, такое решение хотела видеть ТС

Как ты предлагаешь сделать такое?

[Джон]

Ну... дык. То что вопрос задан в этой теме, ещё не показатель того, что поиск решения идёт в верном направлении. Может у человека просто не хватает опыта с ASP.NET, а JS она знает хорошо, вот и пытается применить имеющиеся знания. Поэтому я предлагаю делать это на стороне сервера и не мешать все существующие способы манипулирования контента. Личное моё мнение ессно.

зы Опять же ИМХО, я не исключаю ситуации, когда такое может и придётся делать, запускать клиенсткий скрипт с серверными элементами. Но тогда усилия должны себя оправдывать. Скажем так, безвыходная ситуация, время поджимает и тп. Тогда можно попробовать пофантазировать без 100% гарантии на успех, о том как формируются ClientID, пока логика просматривается довольно чётко:

ctl00 -> ContentPlaceHolder1 -> gvCategory -> ctl02 -> cbSelect

Ну как-то так. Но в данном случае можно легко обойтись без этого.

[Dimka]

изменить состояние control  type=hidden на type=text

Я не проверял, но на 90% уверен, что ASP.NET этого не переживёт, если страница описана статически. Хотя там тоже можно исхитриться, поскольку есть иерархия контролов.

а каким образом они попадают в клиентский код, при условии что мне нужно именно уникальный, заранее известный, т.е. ClientId

Я делаю серверными вставками В aspx/ascx файле прописать скрипт с нужной обёрточной функцией

Код: (HTML)

<SCRIPT type="text/javascript">
  function foo()
  {
    var element = document.getElementById("<%= this.myControl.ClientID %>");
    // ...
  }
</SCRIPT>

При генерации HTML вставка заменится на магический идентификатор.

Но на самом деле у контролов есть свойства вроде OnClientClick.

[Sla]

изменить состояние control  type=hidden на type=text

Я не проверял, но на 90% уверен, что ASP.NET этого не переживёт, если страница описана статически. Хотя там тоже можно исхитриться, поскольку есть иерархия контролов.

А причем здесь ASP.NET?
Может мы говорим о разных вещах?

Есть web-сервер - отдает html контент
есть приложение - принимает html контент (браузер) Обрабатывает его своим внутренним языком, пусть это будет js)
И отдает запрос в виде REQUEST серверу. Кто не переживет?

[Dimka]

Sla, по-моему, говорить о сервере вообще - это то же самое, что говорить о сферическом коне в вакууме.

Мы же не протокол HTTP обсуждаем и т.п., мы обсуждаем то, как создать приложение. А приложение работает в рамках той или иной технологии, которая инкапсулирует HTTP, REQUEST и отчасти JS в браузере (по крайней мере предоставляет свой framework) и т.д. Например, ASP.NET так делает. Почему заговорили про ASP.NET - потому что приведённый выше код серверной стороны написан на C#.

Говорить про RequestString - всё равно, что говорить о WinAPI. Да, оно есть, но львиная доля приложений строится на базе надстроек над WinAPI, а не на голом WinAPI.

[Okkkks]

Ребята, задача изначально была такая:
Нужно выделять/снимать выделение чекбокса,который находится в таблице, кликая не по самому чекбоксу, а по строке в таблице. Как это сделать на стороне сервера да так чтоб это не пидалило на каждом шагу я не придумала. Да и мне всегда казалось, что для этого и придумали скрипт =)) (знаю его кстати весьма поверхностно =(((  )  вот поэтому собственно скрипт...
Если вы знаете как эта задача решается на сервере расскажите мне пжалста =))

на данный момент:
 автогенерация айдишника отключена (ID=ClientID=cbSelect), но при создании строк таблицы я модифицирую айдишники добавляя к ним № строки, для того, чтоб легче было искать потом в html  (ClientID=cbSelect№).
скрипт отрабатывает как надо, всё выделяется/снимается выделение, но теперь я похоже "потеряла связь сервера с контролом". Сервер не видит отмеченые чекбоксы =(( и как тут выкрутится не знаю.... =(( ничё не получается =((

[Dimka]

Как это сделать на стороне сервера да так чтоб это не пидалило на каждом шагу я не придумала.

Никак. Чтобы это происходило на сервере, нужно именно послать на сервер форму.

Уменьшить объём передаваемых данных можно через AJAX. Но в общем и целом эта задача решается клиентским скриптом.

автогенерация айдишника отключена (ID=ClientID=cbSelect), но при создании строк таблицы я модифицирую айдишники добавляя к ним № строки, для того, чтоб легче было искать потом в html  (ClientID=cbSelect№).
скрипт отрабатывает как надо, всё выделяется/снимается выделение, но теперь я похоже "потеряла связь сервера с контролом". Сервер не видит отмеченые чекбоксы =(( и как тут выкрутится не знаю.... =(( ничё не получается =((

Потому что нельзя "отключать" автогенерацию ID. Напиши скрипт, который использует реальные автоматически сгенерированные ID (пример серверной вставки я давал).

[Okkkks]

Dimka,  спасибо =) есть пара мыслей =))