CODEWITHSUNDEEP
jquerystruts-1
user3721476
user3721476

Reputation: 1

Does jquery work with struts 1.x html tags?

This is my code.

I want to write on change text field using jQuery for this text field. Can Anyone please help me to write? I have written jQuery many times but for struts 1.x html tags, I am not getting any docs.

<html:text property="toYear" size="20" styleId="toyear" maxlength="20"/>
    $('#toyear').on('change', function() {
        // do something
    });

Upvotes: 0

Views: 1404

Answers (2)

peater
peater

Reputation: 1273

(An old question, but just in case anyone gets here searching for Struts 1 answers...)

As mentioned, the easiest way to figure out what is going on is to look at the HTML which gets produced and rendered by the browser. For your code:

<html:text property="toYear" size="20" styleId="toyear" maxlength="20"/>

something like this will get generated:

<input type="text" name="toYear" maxlength="20" value="" id="toyear"/>

The original jQuery selector was incorrect, using the name instead of the id attribute. Try this:

$('#toyear').on('change', function() {
    // do something
});

And make sure it is inside a $( document ).ready(function() {...});

Upvotes: 0

mrjoltcola
mrjoltcola

Reputation: 20852

Struts is a server side rendered technology.

jQuery is a client-side technology. So it runs after the page loads, which means it is unaware of struts tags.

To use jQuery with struts means your jquery will need to work with the regular HTML tags, ids, etc. So you need to learn how struts tags / properties map to HTML tags.

See the docs on the struts styleId tag which lets you set the Id of the resulting tag, and you would use that id as the selector for jquery after page load.

http://struts.apache.org/release/1.2.x/userGuide/struts-html.html

Put your jquery events (which is just javascript) within struts event handler (on*) tags, which are quoted strings.

Something like:

 <html:text property="toYear" size="20" styleId="toyear" maxlength="20"
    onclick="$('#toyear').on('change', function() { alert('test'); });" />

Upvotes: 1

Related Questions