управление доступом с помощью jquery в ячейке gridview в событии teled datepicker selecteddate

Question

 <asp:TemplateField HeaderText="DOB" >
  <ItemTemplate>
  <telerik:RadDatePicker RenderMode="Lightweight" ID="txtDob" runat="server" 
  DateInput-DateFormat="yyyy-MM-dd" 
  DateInput-DisplayDateFormat="dd MMM yyyy" 
  ClientEvents-OnDateSelected="OnDateSelected"></telerik:RadDatePicker>  
  </ItemTemplate>
</asp:TemplateField> 
<asp:TemplateField HeaderText="Age" >
<ItemTemplate>
    <asp:Label ID="lblAge" runat="server" Text=""></asp:Label>
</ItemTemplate>
</asp:TemplateField>

<script type="text/javascript">
function OnDateSelected(sender, e) {
if (e.get_newDate() != null) {
    var dob = e.get_newDate(), 
        today = new Date(), 
        ageInMilliseconds = new Date(today - dob), 
        years = ageInMilliseconds / (24 * 60 * 60 * 1000 * 365.25), 
        age = parseInt(years);
    //how to access the lable control
    //$("span[id$='lblAge']").text(age);                
  }
}

не может получить доступ к элементу управления lblAge в событии OnDateSelected telerik: RadDatePicker.если как-то пропущен rowIndex, то можно установить с помощью tdvar td = $ ("table [id $ = '" + gridViewCtlId + "'] tr: eq (" + rowIndex + ") td: first");

Answer 1

Вот пример кода, который может быть жизнеспособным решением для вашего сценария:

<script type="text/javascript">
    function OnDateSelected(sender, e) {
        if (e.get_newDate() != null) {
            var dob = e.get_newDate(),
                today = new Date(),
                ageInMilliseconds = new Date(today - dob),
                years = ageInMilliseconds / (24 * 60 * 60 * 1000 * 365.25),
                age = parseInt(years);
            //how to access the lable control
            //$("span[id$='lblAge']").text(age);

            // get reference to the HTML element of RadDatePicker 
            var datePickerElement = sender.get_element(); 
            // get reference to the current Grid row using the jQuery closest() method and search for the tr element.
            var currentGridRow = $(datePickerElement).closest('tr');
            // search for the label which ID contains "lblAge"
            var lblAge = currentGridRow.find('span[id*="lblAge"]'); 

            // exit the logic if the label is not found
            if (!lblAge) return; 

            // set the Label's text
            lblAge.text(age); 
        }
    }
</script>

Вот короткое видео, которое показывает, как было достигнуто решение для этого сценария.Кроме того, это может оказаться хорошим способом отладки приложения на стороне клиента с помощью инструментов разработчика браузера: OnDateSelected установить текст метки в той же строке

Вот некоторые ссылки, которые выможет просмотреть для получения дополнительной информации о методах, используемых для достижения этого сценария:

• .closest ()

• .find ()

• Атрибут содержит селектор [имя * = «значение»]

Iтакже рекомендовал бы ознакомиться с статьей клиентского программирования RadDatePicker , описывающей использование API-интерфейсов элемента управления RadDatePicker.