在Struts 2中使用ajax调用自动完成的奇怪响应

时间:2013-11-29 07:30:59

标签: jquery ajax struts2 autocomplete jquery-autocomplete

Ajax调用自动完成:

$(function() {

$("#businessCity").autocomplete(
        { 
            source : function(c, b) {
                $.ajax({
                    url : ctxPath + "/getCityNeighbourhood",
                    dataType : "json",
                    data : {
                        searchString : c.term,
                        itemType : "city"
                    },
                    success : function(d) {
                        b($.map(d.cityNeighbourhoodList, function(e) {
                            return {
                                label : e,
                                value : e
                            }
                        }))
                    }
                })
            },
            minLength : 1
        });
});

我的行动课程:

public class AutoCompleteAjax {
        XYZ  xyz = new XYZ();
        private List<String> cityNeighbourhoodList=new ArrayList<>();
    public String getCityNeighbourhood(){
        HttpServletRequest request =  ServletActionContext.getRequest();
        String searchString = request.getParameter("searchString");
        String itemType = request.getParameter("itemType");
        cityNeighbourhoodList = xyz.getListOfCityStateNeighborhood(itemType, searchString);
        return "success";
    }
    //getters & setters...
}

struts.xml条目的配置:

<action name="getCityNeighbourhood"
    class="com.abc.xyz.ui.action.AutoCompleteAjax"
    method="getCityNeighbourhood">
    <result type="json" />
</action>

我在struts.xml中使用下面的包:

<package name="default" namespace="/" extends="struts-default, json-default">

奇怪的行为是在本地工作正常,但当我在生产服务器上尝试时 - 在输入我的文本字段时,Action类被调用但没有得到任何自动完成建议。当我尝试在FireFox调试器中调试时,我可以看到响应类型是html,而不是Json。

任何帮助将不胜感激。

&GT;编辑:当我尝试使用FireFox调试器时 - 我得到的是整个代码,响应类型是html -

  

ReferenceError:未定义removeClass

$(input).focus( function(){removeClass('placeholder');});
     

homePageAction(第86行)GET http://xyz-qa.in/autoCompleteAction?boxName=B1&name_startsWith=a 200 OK 347ms jquery-1.7.1.js(第8102行)ParamsHeadersResponseHTMLCookies

<!doctype html>

<html> <head>


<meta charset="UTF-8"> <meta    content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"    name="viewport" /> <meta    content=""  name="keywords" /> <meta    content=""  name="description" />    <title>xyz - Home</title>


<link rel="xyz icon" type="image/ico"   href="/images/SMNS-favicon.ico" /> <link rel="stylesheet"   href="/css/boilerplate.css"     type="text/css" media="all" /> <link rel="stylesheet"   href="/css/jquery-ui.css"   type="text/css" media="all" /> <link rel="stylesheet"   href="/css/StreamlinedMNSstyle131024.min.css"   type="text/css" media="all" /> <link rel="stylesheet" type="text/css" media="all"   href="css/jquery.toolbars.css" />

<style> .placeholder {  color: #aaa; } </style>

<script type="text/javascript"  src="/scripts/jquery-1.7.1.js">  </script> <script> function getPlaceHolders(){     $("[placeholder]").focus(function() {
        var input = $(this);
        if (input.val() == input.attr("placeholder")) {
            input.val("");
            input.removeClass("placeholder");
        }
    }).blur(function() {
        var input = $(this);
        if (input.val() == "" || input.val() == input.attr("placeholder")) {
            input.addClass("placeholder");
            input.val(input.attr("placeholder"));
        }
    }).blur();

     $("[placeholder]").parents("form").submit(function() {
        $(this).find("[placeholder]").each(function() {
            var input = $(this);
            if (input.val() == input.attr("placeholder")) {
                input.val("");
            }
        });
    });     }       function removePlaceHolderValues(formName){ 

        var elemArray = document.getElementById(formName).elements;
         for (var i = 0; i < elemArray.length;i++)
         {
             var element = elemArray[i];
                if((element.placeholder == element.value)){
                     element.value = "";    
                }
         }      }       function removePlaceHolderProperty(formName){       var elemArray = document.getElementById(formName).elements;
         for (var i = 0; i < elemArray.length;i++){
             var input = elemArray[i];
             if(input.placeholder!='')
                 $(input).focus( function(){removeClass('placeholder');});

         }      }    </script> <center>     <noscript>Please enable JavaScript to use this website</noscript> </center>

<script type="text/javascript">var
_gaq=_gaq||[];_gaq.push(["_setAccount","UA-38795955-3"]);_gaq.push(["_trackPageview"]);(function(){var b=document.createElement("script");b.type="text/javascript";b.async=true;b.src=("https:"==document.location.protocol?"https://ssl":"http://www")+".google-analytics.com/ga.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(b,a)})();</script> </head> <body>


    <div class="gridContainer clearfix">        <!--Header-->       <div id="header">





<!--Auto Complete Code-->

<form id="headerPage" name="headerPage" action="/homePageAction.action" method="post" onSubmit="removePlaceHolderValues('headerPage'); removePlaceHolderProperty('headerPage');">   <input type="hidden" name="pageNumber" value="1" id="pageNumber"/>

    <!--End Auto Complete Code-->   <div class="signin-text">





            <div class="signin-text">
                <a href="javascript:viewProfile();" >
                <img
                                    src='/mns_ads_in/pictureads/8141_profile_31_9_2013_0_2_15.jpg'
                                    width="20" height="21">

                    Hi shailesh Kumar !</a>
                <span>l</span> <a href="signOutAction">Sign Out </a>
                 <div id="menucontainer" style="position:relative; margin-left:7px; float:right;"> <span id="editmenu"><img src="/images/gear-icon.jpg" alt="Gear"/></span>
                        <div id="user-options" class="toolbar-icons" style="display: none;"> 
                          <a href="displayUpdateProfile?location=Bangalore" onclick="redirect('displayUpdateProfile?location=Bangalore&pageNumber=1')">Update Profile</a>
                          <a href="javascript:displayInviteFriends();" onclick="javascript:displayInviteFriends();" >Invite Friends</a> 
                        </div>
                </div>          </div>





        </div>  <div style="float: right;">         <input type="text" name="location" maxlength="50" value="Bangalore" id="location" class="location-input" onblur="return getTheLocation(this.value)" onkeypress="displayResults(event);" onkeyup="return getTheLocation(this.value)" placeholder="Location Metro"/>      <span role="status" aria-live="polite"          class="ui-helper-hidden-accessible"></span>     </div>  <div class="logo-home">         <a          href="javascript:displayHomePage();"><img           src='/images/SMNS-logo.jpg' alt="xyz"> </a>     </div>  <p class="clear"></p>   <!--Search-->       <div class="tittle-container">      <div class="tittle">            <img width="104" height="28" alt="" src="images/SMNS-search-tittle.jpg">        </div>
            </div>      <div style="margin-top: 10px;">         <input type="text" name="search" value="" id="search" class="searchfor item" onkeyup="displayResultOnhitEnter(event);" placeholder="Business Name or Category" onInput="$(this).removeClass('placeholder');"/>      <input type="text" name="city" value="" id="city" class="where item" onkeyup="displayResultOnhitEnter(event);" placeholder="City, State or Neighborhood" onInput="$(this).removeClass('placeholder');"/>        <img style="float: right;display:block;bgcolor:red;"            src="/images/SMNS-new-go-button.png" width="49" height="32"             class="btninimg"            onclick="displaySearchResults('');" />      <!--Search End-->   </div>

</form>




<br/><br/>

<!-- Move the SCRIPT stuff to the Separate js file  --> <script> var ctxPath = ''; </script> <script type="text/javascript"     src="/scripts/home.header.display.result131004.min.js"> </script> <script type="text/javascript" src="/scripts/jquery.toolbar.min.js"></script> <script type="text/javascript" src="/scripts/gear.menu.js"></script>        </div>

        <!--Content-->      <div class="content-area">          <div>


<form id="iconsForm" name="iconsForm" action="/homePageAction.action" method="post" onSubmit="removePlaceHolderValues('iconsForm');"> <!--Explore-->   <input type="hidden" name="pageNumber" value="1" id="pageNumber"/>   <input type="hidden" name="location" value="Bangalore" id="location"/>   <input type="hidden" name="category" value="" id="category"/>   <div class="tittle-container">
    <div class="tittle"><img src="/images/SMNS-explore-tittle.jpg" alt="" width="104" height="28" /></div>   </div>         <div class="in-around">In and around <span id="locationLabel"
></span></div>   <div id="explore-ico-container">
    <div class="explore-icon"><a onclick="callAction('','Restaurant');" style="cursor: pointer;"><img src="/images/SMNS-restaurant-icon.jpg" alt="" width="103" height="103" /></a></div>
    <div class="explore-icon"><a onclick="callAction('','Shopping');" style="cursor: pointer;"><img src="/images/SMNS-shopping-icon.jpg" alt="" width="103" height="103" /></a></div>
    <div class="explore-icon"><a onclick="callAction('','Entertainment');" style="cursor: pointer;"><img src="/images/SMNS-entertainment-icon.jpg" alt="" width="103" height="103" /></a></div>
    <div class="explore-icon"><a onclick="callAction('','Spas and Salons');" style="cursor: pointer;"><img src="/images/SMNS-spa-icon.jpg" alt="" width="103" height="103" /></a></div>   </div>   <!--Explore End-->    </form>



    <script type="text/javascript"  src="/scripts/display.home.page130911.min.js"></script>     <script>            document.getElementsByTagName('title')[0].innerHTML = 'xyz - Home';     </script>           </div>      </div>  </div>  <!--Footer-->   <div id="footer">


 <div class="footer-text">Copyright  2013 xyz</div>         </div>  <input type="hidden" id="refreshed" value="no">     <!--Footer End-->

    <script type="text/javascript"      src="/scripts/jquery-ui.js"></script>   <script type="text/javascript"      src="/scripts/respond.min.js"></script>

</body> </html>

1 个答案:

答案 0 :(得分:2)

url : ctxPath + "/getCityNeighbourhood",

如果项目在本地工作,但在服务器上工作,则此设置会产生问题。您必须验证ctxPath变量的值。

将其更改为:

url : "${pageContext.request.conetxtPath}/getCityNeighbourhood",

并尝试不使用contextPath:

url : "/getCityNeighbourhood",