0

很抱歉开始另一个线程,但我有点解决了我的第一个线程的问题,但现在我遇到了另一个问题。

背景:

我有一个 portlet,它接受 3 个参数(Temperature、FromUnit、ToUnit)并将它们传递给位于此处的外部 WebService: http ://www.webservicex.net/ConvertTemperature.asmx/ConvertTemp

我不希望 portlet 实际重定向到 webService 的 URL,而这样做的唯一方法似乎是使用 jquery 的 AJAX,我现在已经这样做了。但是,我还希望将 webService 的响应嵌入到我曾经调用它的同一 portlet 中,这就是我遇到问题的地方。

这是我到目前为止得到的,这是我的 portlet 页面:

  <html>
    <head>
        <meta charset="utf-8" />
        <title>Demo</title>
    </head>
    <body>


        <script src="http://localhost:8080/my-greeting-portlet/jquery.js"></script>
        <script type="text/javascript" src="http://localhost:8080/my-greeting-portlet/js/script.js"></script>



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



    <%@ page import="javax.portlet.PortletPreferences" %>

    <portlet:defineObjects />
    <%

    PortletPreferences prefs = renderRequest.getPreferences();
    String Temperature = (String)prefs.getValue("Temperature","Temperature");

    PortletPreferences prefs2 = renderRequest.getPreferences();
    String FromUnit = (String)prefs2.getValue("FromUnit", "FromUnit");

    PortletPreferences prefs3 = renderRequest.getPreferences();
    String ToUnit = (String)prefs3.getValue("ToUnit","ToUnit");



    %>



    <portlet:renderURL var="editGreetingURL">

        <portlet:param name="jspPage" value="/edit.jsp" />

    </portlet:renderURL>


    <div id="contact_form">  
    <form name="callWebService" id="callWebService" action="">
     <fieldset> 
        <label for="Temperature" id="Temperature_label">Temperature </label>  
        <input type="text" name="Temperature" id="Temperature" size="30" value="" class="text-input" />  
        <label class="error" for="Temperature" id="Temperature_error">This field is required.</label>
        <br />  

        <label for="FromUnit" id="FromUnit_label">From unit  </label>  
        <input type="text" name="FromUnit" id="FromUnit" size="30" value="" class="text-input" />  
        <label class="error" for="FromUnit" id="FromUnit_error">This field is required.</label>
        <br />  

        <label for="ToUnit" id="ToUnit_label">To Unit    </label>  
        <input type="text" name="ToUnit" id="ToUnit" size="30" value="" class="text-input" />  
        <label class="error" for="ToUnit" id="ToUnit_error">This field is required.</label>  

        <br />  
        <input type="submit" name="submit" class="button" id="submit_btn" value="submit" />  
      </fieldset>  
    </form>  
    </div>  


    </body>
    </html>

这是jquery代码:

$(function() {  
  $('.error').hide();  
  $(".button").click(function() {  
    // validate and process form here  
    var dataString = $("#callWebService").serialize();  
    // alert (dataString);return false;  
    $.ajax({  
      type: "POST",  
      url: "http://www.webservicex.net/ConvertTemperature.asmx/ConvertTemp",  
      data: $("#callWebService").serialize(), 
      success: function() {  
        $('#contact_form').html("<div id='message'></div>");  
        $('#message').html("<h2>Contact Form Submitted!</h2>")  
        .append("<p>We will be in touch soon.</p>")  
        .hide()  
        .fadeIn(1500, function() {  
          $('#message').append("<img id='checkmark' src='images/check.png' />");  
        });  
      }  
    });  
    return false;   



    $('.error').hide();  
      var Temperature = $("#Temperature").val();  
        if (Temperature == "") {  
      $("#Temperature_error").show();  
      $("#Temperature").focus();  
      return false;  
    }  
        var FromUnit = $("input#FromUnit").val();  
        if (FromUnit == "") {  
      $("label#FromUnit_error").show();  
      $("input#FromUnit").focus();  
      return false;  
    }  
        var ToUnit = $("input#ToUnit").val();  
        if (ToUnit == "") {  
      $("label#ToUnit_error").show();  
      $("input#ToUnit").focus();  
      return false;  
    }  

  });  
}); 

一切似乎都在工作,或者至少我没有收到错误,但似乎这部分代码被完全忽略了:

success: function() {  
           $('#contact_form').html("<div id='message'></div>");  
          $('#message').html("<h2>Contact Form Submitted!</h2>")  
        .append("<p>We will be in touch soon.</p>")  
          .hide()  
          .fadeIn(1500, function() {  
           $('#message').append("<img id='checkmark' src='images/check.png' />");  
      });  

当我按下“提交”按钮时,什么也没有发生。没有重定向到 web 服务 URL(好),但上面定义的自定义消息也没有显示(坏)。屏幕保持原样。

当我取消注释 jquery 代码中的“警报”并且参数肯定被正确拾取时,我会假设它们被传递到 webService URL 但没有其他任何事情发生。

这是因为网络服务 URL 返回的响应会覆盖我的消息或类似的东西吗?

如何将 webService 响应嵌入到 portlet 中?

再次,非常感谢您查看此内容,非常感谢!

4

1 回答 1

1

您遇到了跨域脚本问题。

阅读这个这个来解决问题

于 2013-08-27T19:39:55.310 回答