如何使用ajax将值(不是表单值)传递给struts 1.3中的操作

时间:2014-02-19 07:21:30

标签: java jquery ajax jsp struts

我有以下jsp

    <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
        pageEncoding="ISO-8859-1"%>  
    <%@taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%>
    <%@taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
    <%@taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>



    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Get the best deal on Qnatas Partner credit cards</title>

<script type="text/javascript">

 function doAjaxPost() {
                    // get the form values
                    var name = $(#name).val();

                    $.ajax({
                        type: "POST",
                        url: "/cardselector/mailAction.do", // this is my action call
                        data: "name=" + name,
                        success: function(response){
                            // we have the response
                            $('#info').html(response);
                        },
                        error: function(e){
                            alert('Error: ' + e);
                        }
                    });
                }
</script>
    </head>
    <body>
    <p>Welcome to card selector</p>
    <html:form action="/cardsList" target="cardsListForm">
        <html:text name="cardsListForm" property="message" maxlength="250"/>
        <div id="name">sample</div>
        <input type="text" id="name">myname</input>

        <input type="button" value="Say Hello"><br/>
    <div id="info" style="color: green;"></div>
    </html:form>

    </body>
    </html>

这是我的表格

import java.util.List;

import org.apache.struts.action.ActionForm;

public class CardsListForm extends ActionForm{
    private static final long serialVersionUID = 1L;

    private String message;    

    public String getMessage() {
        return message;
    }

    public void setMessage(String message) {
        this.message = message;
    }   

}

这是我的行动

public class MailAction extends Action {

    private CardManagementService cardManagementService;

    @Override
    public ActionForward execute(ActionMapping mapping, ActionForm form,
            HttpServletRequest request, HttpServletResponse response)
            throws Exception {
        try {   
                 // Need to get the value of name from jsp input text

        } catch (Exception e) {
            System.out.println("Error:" + e.getMessage());
            e.printStackTrace();
        }

        return mapping.findForward("success");
    }


}

现在我想通过点击按钮使用ajax从jsp tp my action class传递myname的值。请注意,此名称不是我的表单类的属性。

请帮忙!

3 个答案:

答案 0 :(得分:1)

加载jquery并通过点击按钮的POST请求将数据传递给您,希望此操作有用

HTML:

 <input type="button" id="button" value="Say Hello">

<强> JS:

 $(document).ready(function(){
      $("#button").click(function (){

          var name = $('#name').val(); //your code has  $(#name) which is not selecting required input element!
         $.post("/cardselector/mailAction.do",{"name" : name},function(response) 
          {
                alert("done");
                console.log(response); //see what response you are getting        
         });
      })

    });

答案 1 :(得分:1)

改变这个:

var name = $(#name).val();

到此:

var name = $('#name').val(); //<---you had missing quotes

data: {name:name}, //<----send your user name as an object.

并进行内联关闭以输入elems:

<input type="text" id="name" />

我在你的代码中没有找到任何点击列表器,所以我建议你这样做:

 function doAjaxPost() {
    // get the form values
    var name = $('#name').val(); // <---missing quotes

    $.ajax({
         type: "POST",
         url: "/cardselector/mailAction.do", // this is my action call
         data: {name:name}, //<----and send it like this
         dataType: 'text', //<-----if response is string then use dataType:"text"
         success: function(response){
               // we have the response
               $('#info').html(response);
         },
         error: function(e){
               alert('Error: ' + e);
         }
    });
}

$(function(){
    $('[type="button"]').on('click', doAjaxPost);
});

答案 2 :(得分:0)

使用jquery $.post。例如:

$.post("youactionname",params); //this is just an example syntax.

此外,

<input type="text" id="name"> MYNAME </input>

你在哪里定义了我的名字?