Call java method from javascript

Question

I have a web jsp web application. In one page I need two dropdownlist. When I will select a value from dd1 then second dropdown will be fill according this value. How I can call java function from dropdown 1 change event in javascript or jQuery?

I got example but that is calling jsp page but I need to java method and send parameter what i got from dropdown1

This is my dropdown dd1. So if I select tom I have to related information of tom in dd2.

            <td>
              <select  id="dd1">
                    <option value="1">john</option>
                    <option value="2">Tom</option>
              </select>

          </td>
        </tr>
        <tr>
          <th> Projects </th>
          <td>

              <select id="dd2">
                    <option value="1">pp1</option>
                    <option value="2">pp2</option>
              </select>

          </td>

I have following code

$(function () {
    var ddVal = '';
    var dropdown = document.getElementById("dd1")
    $(dropdown).focus(function () {
        ddVal = $(this).val();
        }).blur(function () {
        if (ddVal == $(this).val()) {
            $(this).change();
        }
    }).change (function () {

});

For change event of dd1. But I don't know how to call java method from jQuery.

In my application I have a java class where there is a method which return list that I need to load in dd2 dropdown.

Can anyone help me regarding this issue?

You definetely need to add some code...

M.Bennett
– M.Bennett

2013-05-10 22:47:47 +00:00
Commented May 10, 2013 at 22:47 — M.Bennett
– M.Bennett, Commented May 10, 2013 at 22:47

Powerslave · Accepted Answer · 2013-05-11 16:29:23Z

1

You should do such things with AJAX.

JavaScript sends the request, your controller utilizes the Java part to carry out what's needed and then passes back a JSON response, based on which your JavaScript manipulates the page.

EDIT:

For example, the script can issue the following request:

$.ajax({
    "type": "POST",
    "url": "/ajaxAPI/updatedropdown/",
    "data": {
        "selected": selectedMenuItemId
    },
    "success": function (data) {
        var menuItems = data.menuItems;
        dropDownToChange.updateChoices(menuItems);
    }
});

Your controller for such a request might look like:

public class DropDownListController implements Controller {

    @Override
    public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        MenuItem selected = extractSelectionFromRequest(request);
        List<MenuItem> choices = dropDownListService.getMenuFor(selected);
        ModelAndView mav = new ModelAndView("dropDownListAjax.jsp");
        mav.addObject("menu", choices);
    }

    // WARNING! Some error checks are missing!
    private MenuItem extractSelectionFromRequeset(HttpServletRequest request) {
        validateRequest(request);
        return dropDownListService.getMenuItemById(request.getAttribute("selected"));
    }

    // ...

}

And for the view you could have something like:

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
{
    "menuItems": [
        <c:forEach items="${menu}" var="menuItem">
            {
                "url": <c:out value="${menuItem['url']}"/>,
                "caption": <c:out value="${menuItem['caption']}"/>
            },
        </c:forEach>        
    ]
}

The client side JavaScript will then receive a response like:

{
    "menuItems": [
        {
            "url": "http://www.example.com/"
            "caption": "Home"
        },
        {
            "url": "http://www.example.com/news/list/"
            "caption": "News"
        },
        {
            "url": "http://www.example.com/forum/topics/"
            "caption": "Forum"
        },
    ]
}

Please note that the above example might not be 100% correct as there have been a while since I last used JSP (and I'm more comfortable with FreeMarker anyways).

Basically, you invoke part of your web infrastructure that, rather than responding with HTML code, passes back JavaScript Objects based on the results of the requested operation.

Since jQuery is in the client side and JSP is on the server side, you don't have the option of directly calling the remote method. The standard way to do this in the world of the Web is AJAX.

edited May 11, 2013 at 16:29

answered May 11, 2013 at 10:08

Powerslave

1,41815 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

tetrapack Over a year ago

Do you have some sample code that from you can show how to call java method from your ajax. I know following code $.ajax({ type: "POST", url: "test.java", data: data, success : function (data) { // Your return categories in data // Append list options to select2 } }); can call the java method. but here in the url what should I need to pass and how I pass the method parameter.

Powerslave Over a year ago

@tetrapack Actually, rather than calling a Java method directly, you invoke a web service. Your server side Java stuff simply does the same it would do on a browser-based request, except that the response will be in JSON format rather than HTML. There's really nothing special here.

tetrapack Over a year ago

in my project I did not use MVC. Its like I have java and jsp file. I just call java class in my jsp. Actually I am a new in JSP. Do you some example that from where it shown how to call webservice from jquery or ajax.

Powerslave Over a year ago

@tetrapack See above, I've just edited (okay it's not SOAP, but you do not necessarily need that). From JSP you could invoke the "controller" and have it return the list of menutiems, then print the JSON the very same way as in the above view. I'd also recommend applying the MVC pattern as it is pretty much straightforward and is a good base for a nicely structured codebase. What kind of framework (if any) and servlet container are you using?

tetrapack Over a year ago

Thanks Powerslave. I am using Apache tomcat and there is no frarework. I just using normal web application in netbeans.

|

Collectives™ on Stack Overflow

Call java method from javascript

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related