Как отключить расширенный календарь с помощью jQuery или javascript (на стороне клиента)

#javascript #jquery #calendar #richfaces

#javascript #jquery #Календарь #richfaces

Вопрос:

Все в вопросе, я хочу отключить и включить rich:calendar на стороне клиента (например, используя функцию javascript).

элементы xhtml:

 <rich:calendar id="calendar" ... />          
<h:selectBooleanCheckbox id="checkbox" onclick="change('checkbox', 'calendar')" ... />
  

Функция JS :

 function change(checkbox, calendar){
    if(jQuery('#' checkbox).is(':checked')){
        // Enable calendar
        jQuery('#' calendar).removeAttr('disabled');
    }
    else{
        // Disable calendar
        jQuery('#' calendar).attr('disabled',true);
    }
}
  

jQuery('#' checkbox) возвращает входные данные input#checkbox
но jQuery('#' calendar) возвращает таблицу table#calendar.rich-calendar-exterior , а не компоненты для отключения.

Как отключить ввод и значок расширенного календаря с помощью jQuery (или JavaScript)?

Редактировать: <rich:calendar id="calendar" /> генерирует html :

 <span id="calendarPopup"> 
  <input type="text" class="rich-calendar-input" id="calendar" name="calendar"
    style="vertical-align: middle; width: 130px">
  <img alt="" class="rich-calendar-button" id="calendarPopupButton"
    style="vertical-align: middle" src="/project/a4j/g/3_3_3.Finalorg.richfaces.renderkit.html.iconimages.CalendarIcon/DATB/eAE7fv4Kw6znAA4mA-w_.jsf">
  <input type="hidden" autocomplete="off" id="calendarInputCurrentDate" name="calendarInputCurrentDate" style="display: none" value="11/2011">
</span>
  

Комментарии:

1. Если вы можете опубликовать HTML, переданный в браузере (через view source), тогда люди, не знакомые с richfaces, также могут вам помочь.

2. @JamesMontagne Вы можете увидеть мою правку и мой ответ. Мой ответ не совсем соответствует ожидаемой реализации, поэтому я все еще ищу хороший ответ. Спасибо

Ответ №1:

Я не могу найти решение, используя только реализацию jQuery, поэтому я решил привязать значение флажка и атрибут отключенного календаря к одному и тому же логическому значению :

 <rich:calendar id="calendar" disabled="#{!checkboxValue}" />          
<h:selectBooleanCheckbox id="checkbox" value="#{checkboxValue}">
   <a4j:support event="onclick" reRender="calendar"></a4j:support>
</h:selectBooleanCheckbox>
  

Есть ajax (я не хочу) у кого-нибудь есть другое решение без ajax? Без другого решения я выберу это в качестве принятого ответа…

Ответ №2:

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

Я смог сделать это с JQuery . Глядя на сгенерированный HTML вывод, я мог видеть, что он создает несколько компонентов. Вот мой <rich:calendar>

 <rich:calendar id="cal" value="#{myManagedBean.date}" >
  

Как вы можете видеть, идентификатор cal . Но на самом деле это внутренний <input> идентификатор calInputDate , так что это тот, который я отключил через JQuery , вот так:

 $('#mainForm\:calInputDate').prop('disabled', true);
  

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

 $('#mainForm\:calInputDate').prop('disabled', false);
  

Это работает 🙂

Комментарии:

1. Это не отключает кнопку календаря, а только поле ввода