2015-12-04 2 views
0

У меня проблема с обработкой событий переключателя с помощью jquery. Я новичок в JQuery, но пытаюсь обрабатывать события элементов формы html с помощью JQuery. В последние дни я добавил JQuery datepicker в свою форму, которая отлично работает и теперь пытается добавить переключатель и обрабатывать отмеченные и непроверенные события переключателя, чтобы скрыть и показать некоторые части элементов html (текстовые поля, выбор и другие элементы).struts2 с вызовом события события jQuery

Вот

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
pageEncoding="ISO-8859-1"%> 
<%@ taglib prefix="tags" uri="/struts-tags"%> 
<html> 
<head> 
     <link rel="stylesheet" href="jquery/jquery-ui.css"> 
</head> 
<body> 
<tags:form name="someForm" action="someAction" method="post"> 
    <tags:textfield key="someActionClass.transactionDate" id="datepicker"  label="Transaction Date" /> 
    <tags:radio list="#{'1':'One Time','2':'Recurring'}" id="tType" lable="Transaction Type" name="recurringOrOneTime"></tags:radio> 


    <div class="recuType"> 
    <h1>this part should be hiden/show depending upon radio button events</h1> 
    </div> 

    <script src="jquery/external/jquery/jquery.js"></script> 
    <script src="jquery/jquery-ui.js"></script> 
    <script> 

    $("#datepicker").datepicker({ 
    inline: true 
    }); 

    $("#tType").change(function(){ 
    alert('Radio Button event raised'); 
    }); 

    </script> 
    </tags:form> 
    </body> 
    </html> 

Я добавил LIB JQuery, что я скачал для моего JQuery DatePicker в каталоге JQuery, как вы можете видеть из этой ссылке тега

<link rel="stylesheet" href="jquery/jquery-ui.css"> 

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

Есть ли что-то неправильно, что я делаю с моим кодом? или пропустили любую библиотеку для включения? пожалуйста, помогите

ответ

2

Использование:

$("input[name='recurringOrOneTime']").change(function(){ 
     alert('Radio Button event raised'); 
     }); 

Вместо

$("#tType").change(function(){ 
    alert('Radio Button event raised'); 
    }); 

идентификатор должен быть уникальным в HTML документе, вы начислением 2 радиокнопки тот же идентификатор.

+0

так как назначить два разных идентификатора в моем случае. Поскольку я использую struts2, и мы должны предоставить список для переключателей и как я могу добавить два разных идентификатора? –

+0

У вас есть какая-то особая причина для присвоения им идентификатора? Обычно радиокнопкам нужен только атрибут имени для отправки формы и, возможно, класс для стилизации. – AVAVT

+0

теперь я могу вызвать события, но мое следующее требование, которое скрывает элементы html, такие как текстовое поле, выбор и другие элементы, которые были помещены в

this part should be hiden/show depending upon radio button events

Я могу скрыть простой текст, но когда дело доходит до текстовых полей или других элементов формы это не. Как выполнить эти операции скрытия и шоу для них. Пожалуйста, предложите –

1

Вы можете изменить две вещи:

  1. изменить атрибут id к class.
  2. Привяжите событие вместо имени класса.

Изменить

id="tType" 

в

class="tType" 

и теперь связывают событие:

$(".tType").change(function(){ 
    alert('Radio Button event raised'); 
}); 

или даже вы можете передать его с input[type="radio"], :radio и т. Д .:

$("form input[type='radio']").change(function(){ // or $("form :radio") 
    alert('Radio Button event raised'); 
}); 
Смежные вопросы