Question

我正在尝试使用struts2。我试过以下代码：

function onChangeProduct(){
  var name = $('#product').val();   
   alert(name);
  $.ajax({  
    type: "POST",  
    url: "/SampleAjax/getProduct.do",  
    data: "name=" + name,  
    success: function(response){  
      // we have the response  
      $('#info').html(response);  
    },  
    error: function(e){  
      alert('Error: ' + e);  
    }  
  });

}

DropDown框：

<s:select  name="product"  headerKey="0" headerValue="Select Product" list="#request.Product" onchange="onChangeProduct()"></s:select>

当我从上面的DropDown框中选择值并尝试获取产品的价值时。我在警报信息中得到了解决。请帮帮我。

Answer 1

是的，它会给出undefined，因为你没有在你的标签中提供id。在您的代码中添加 id =“product”，它将显示值。 Jquery将使用id而不是名称来查找标记。

Answer 2

您可以尝试更改此内容：

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

到此：

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

并在此处添加：

onchange="onChangeProduct(this.value)"></s:select>

完整功能：

function onChangeProduct(val){
   var name = val;   
   alert(name);
   $.ajax({  
      type: "POST",  
      url: "/SampleAjax/getProduct.do",  
      data: {name : name},   //<-----use this to make a dataString
      success: function(response){  
           // we have the response  
          $('#info').html(response);  
      },  
      error: function(e){  
          alert('Error: ' + e);  
      }  
   });  

}

Answer 3

我得到了上面相同的解决方案，我在下面分享代码，

Details.jsp

<script type="text/javascript">
    function onChangeProduct() {/* 
        var name = $('#product').val();
        alert(name);
        $.ajax({
            type : "POST",
            url : "/SampleAjax/getProduct.action",
            data : {
                prod : name
            },
            success : function(response) {
                // we have the response  
                $('#productPitch').html(response);
            },
            error : function(e) {
                alert('Error: ' + e);
            }
        }); */

        name=document.getElementById("product").value;
           //document.myForm.selectedGroupId.value=groupIds;
             var  strURL="/SampleAjax/getProduct.action?prod="+name;

                          if (window.XMLHttpRequest) { 

                             var xmlHttp = new XMLHttpRequest();

                           } else if (window.ActiveXObject) { 

                             var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

                           }
                        xmlHttp.open('POST',strURL , true);
                        xmlHttp.onreadystatechange = function() {
                        if (xmlHttp.readyState == 4) {
                    document.getElementById("productPitch").innerHTML = xmlHttp.responseText;
                      //document.getElementById("load3").style.display = "none";
                    //document.getElementById("load").style.display = "block";


                       }
                }



                xmlHttp.send(null);


    }
</script>
</head>
<body>
    Details
<s:form name="sampleDto">

    <s:select name="product" id="product" headerKey="0"
        headerValue="Select Product" list="#request.Product"
        onchange="onChangeProduct()" theme="simple">
        </s:select>
</s:form>
<div id="productPitch"></div>

product.jsp

<select>
        <option value="">Select</option>
        <c:forEach var="listItems" items="${ProductPitch }">

            <option value="<c:out value="${listItems}" />">
                <c:out value="${listItems}" />
            </option>
        </c:forEach>
    </select>

动作：

System.out.println("Hi");
    ArrayList<String> prodPitch = new ArrayList<String>();
    if(null != getProd()){
        System.out.println(""+getProd());
        prodPitch = sampleBo.getProductPitch(getProd());
    }
    System.out.println(prodPitch.size());
        request.put("ProductPitch", prodPitch);

    return "success";

如何在Struts2中使用Ajax调用Action

3 个答案: