0

我已经创建了一个带有 ajax 功能的 liferay portlet,该应用程序运行良好,但问题是当我将 ajax 脚本放在 jsp 页面中时,如下所示,我将能够传递 ${findState} url,但如果我在 js 文件中包含外部的 javascipt 并尝试触发 ajax 我没有得到 ${findState} 的值并且显示错误。

<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<portlet:defineObjects />

<portlet:resourceURL id="findState" var="findState" ></portlet:resourceURL>

<script type="text/javascript">
$(document).ready(function(){

$( "#country" ).change(function() {
      $.ajax({
            url: "${findState}" ,
            type: 'POST',
            datatype:'json',
            data: { 
                    countryName: $("#country").val() 
              },
                success: function(data){
                var content= JSON.parse(data);
                $('#state').html('');// to clear the previous option
                $.each(content, function(i, state) {
                    $('#state').append($('<option>').text(state.name).attr('value', state.stateId));
                });
            }
        });
  }); 
});
</script>

<b>Change the Country State Change By Ajax</b> <br><br>
Country:
<select id="country" name="country">
<option value="select">Select Country</option>
<option value="india">India</option>
<option value="usa">USA</option>
</select>

<br><br>
State:
<select id="state" name="state">
</select>

任何人都可以告诉我一些解决方案吗

4

1 回答 1

2

${findState} 是由 JSP 引擎在服务器上处理的表达式语言变量。所以在运行时,在浏览器中,该url: "${findState}"属性实际上是一个url: "someUrlString". 当您将代码的 Javascript 部分移动到单独的 js 文件中时,该文件将不再由服务器(JSP 引擎)处理。

我的建议是将 ajax 调用包装在一个单独的 js 文件(yourJavascriptFile.js例如,名为 )中的函数中,其中包含以下内容:

var callAjax = function(ajaxUrl) {
      $.ajax({
            url: ajaxUrl ,
            type: 'POST',
            datatype:'json',
            data: { 
                    countryName: $("#country").val() 
              },
                success: function(data){
                var content= JSON.parse(data);
                $('#state').html('');// to clear the previous option
                $.each(content, function(i, state) {
                    $('#state').append($('<option>').text(state.name).attr('value', state.stateId));
                });
            }
        });
}

那么您的 JSP 应该具有以下内容:

<script src="yourJavascriptFile.js"></script>
<script type="text/javascript">
$(document).ready(function(){

$( "#country" ).change(function() {
      callAjax("${findState}");
  }); 
});
</script>

换句话说,您正在尝试将表达式语言变量混合到您的服务器引擎不会执行的外部 JS 文件中。有关此类问题的其他解决方案,请参阅此问题的答案。

于 2015-12-18T13:27:32.560 回答