2012-04-18 3 views
0

웹 프로그래밍에 익숙하지 않습니다. 여기 아약스를 사용하는 데 문제가 있으며 json beig를 읽는 중입니다. 요구 사항은 인터넷 익스플로러 브라우저를 사용하는 것이므로 여기서는 선택의 여지가 없지만 사용하는 것이 좋습니다. 제 문제는 함수가 성공시 실행되지 않는다는 것입니다. 나는 심지어 왜 오류가 아무것도 보이지 않기 때문에 왜 여기에서 나가야하는지에 관해서 확실하지 않다. 이 코드는 방금 떠났고 사임 한 동료의 동료에 의해 제공되고 있으며, 이제는 그의 작업을 끝내게됩니다.jQuery.ajax 성공하지 못함 : function()

다음
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
     <title>ACES Wallboard</title> 
     <link href="StyleSheet.css" rel="Stylesheet" type="text/css" /> 
     <script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script> 
     <script type="text/javascript"> 
      <!-- 
      //var obj = jQuery.parseJSON('{"key": [{ "name": "ciq" },{ "name": "lwt" }],"value": [{ "ciq": "3", "lwt": "12" }]}'); 
      //window.onload = function() { 
      //while (true) { 
      //ajax request 
      //for (var i = 0; i < obj.key.length; i++) { 
      // jQuery("#" + obj.key[i].name).html(obj.value[0][obj.key[i].name]); 
      //} 
      //sleep 
      //} 
      //} 
      window.onload = function() { 

       function errorAlert(e, jxr) 
       { 
        alert("Your request is not successful. " + jxr); 
       } 

       jQuery.ajax(
        { 
         type: "POST", 
         async: true, 
         url: 'WallboardHandler.ashx', 
         contentType: "application/json; charset=utf-8", 
         dataType: "json", 
         success: function (obj) { 
          for (var i = 0; i < obj.key.length; i++) { 
           jQuery("#" + obj.key[i].name).html(obj.value[0][obj.key[i].name]); 
          } 
         } 
         error: errorAlert 
        }); 
      }; 
      //--> 
     </script> 
    </head> 
    <body> 
     <div> 
      <div class="panelstyle"> 
       <div class="ciqrowstyle">Call in Queue: <span id="ciq">&nbsp;</span> Calls</div> 
       <div class="lwtrowstyle">Longest Waiting Time: <span id="lwt">&nbsp;</span></div> 
       <div> 
        <table style="border:5px solid black;font-family:Tahoma;font-size:50px;color:black" width="100%"> 
         <tr style="background-color:SteelBlue;font-weight:bold;color:White;"> 
          <td class="gridheader">&nbsp;</td> 
          <td class="gridheader">Avail</td> 
          <td class="gridheader">Unavail</td> 
          <td class="gridheader">Eng</td> 
          <td class="gridheader">Other</td> 
         </tr> 
         <tr> 
          <td class="rowstyle">HQ</td> 
          <td id="11" class="rowstyle">&nbsp;</td> 
          <td id="12" class="rowstyle">&nbsp;</td> 
          <td id="13" class="rowstyle">&nbsp;</td> 
          <td id="14" class="rowstyle">&nbsp;</td> 
         </tr> 
         <tr> 
          <td class="alternatingrowstyle">CDA</td> 
          <td id="21" class="alternatingrowstyle">&nbsp;</td> 
          <td id="22" class="alternatingrowstyle">&nbsp;</td> 
          <td id="23" class="alternatingrowstyle">&nbsp;</td> 
          <td id="24" class="alternatingrowstyle">&nbsp;</td> 
         </tr> 
         <tr> 
          <td class="rowstyle">Div 1</td> 
          <td id="31" class="rowstyle">&nbsp;</td> 
          <td id="32" class="rowstyle">&nbsp;</td> 
          <td id="33" class="rowstyle">&nbsp;</td> 
          <td id="34" class="rowstyle">&nbsp;</td> 
         </tr> 
         <tr> 
          <td class="alternatingrowstyle">Div 2</td> 
          <td id="41" class="alternatingrowstyle">&nbsp;</td> 
          <td id="42" class="alternatingrowstyle">&nbsp;</td> 
          <td id="43" class="alternatingrowstyle">&nbsp;</td> 
          <td id="44" class="alternatingrowstyle">&nbsp;</td> 
         </tr> 
         <tr> 
          <td class="rowstyle">Div 3</td> 
          <td id="51" class="rowstyle">&nbsp;</td> 
          <td id="52" class="rowstyle">&nbsp;</td> 
          <td id="53" class="rowstyle">&nbsp;</td> 
          <td id="54" class="rowstyle">&nbsp;</td> 
         </tr> 
         <tr> 
          <td class="alternatingrowstyle">Div 4</td> 
          <td id="61" class="alternatingrowstyle">&nbsp;</td> 
          <td id="62" class="alternatingrowstyle">&nbsp;</td> 
          <td id="63" class="alternatingrowstyle">&nbsp;</td> 
          <td id="64" class="alternatingrowstyle">&nbsp;</td> 
         </tr> 
        </table> 
       </div> 
       <div class="dtrowstyle">Date: <span id="timestamp">&nbsp;</span></div> 
      </div> 
     </div> 
    </body> 
</html> 

내 WallboardHander.cs의 코드이지만 URL에서 ASHX이라고 이유를 모르겠어요 : 아래

내 HTML 코드?

/* 
* Copyright (C) 2009 CanaPlus Consulting Pte Ltd 
*/ 

using System; 
using System.Collections.Generic; 
using System.Data; 
using System.Data.SqlClient; 
using System.Web; 
using Com.Canaplus.Commons.Config; 
using Com.Canaplus.Commons.Logging; 
using Newtonsoft.Json; 

namespace Com.Canaplus 
{ 
    public class WallboardHandler : IHttpHandler 
    { 
     private static ILogger _logger; 

     protected string GetConnectionString() 
     { 
      return ConfigurationManager.GetInstance().GetConfiguration().GetConnectionString("SS1CMSDBC1"); 
     } 

     protected static ILogger GetLogger() 
     { 
      return _logger ?? (_logger = LoggerFactory.GetLogger(typeof (WallboardHandler).FullName)); 
     } 

     public bool IsReusable 
     { 
      // Return false in case your Managed Handler cannot be reused for another request. 
      // Usually this would be false in case you have some state information preserved per request. 
      get { return false; } 
     } 

     public void ProcessRequest(HttpContext context) 
     { 
      var data = new Dictionary<string, ICollection<JsonType>>(); 
      var keys = new LinkedList<JsonType>(); 
      data.Add("key", keys); 
      var values = new LinkedList<JsonType>(); 
      data.Add("value", values); 
      var value = new ValueType(); 
      values.AddLast(value); 
      try 
      { 
       using (var conn = new SqlConnection(GetConnectionString())) 
       { 
        conn.Open(); 
        var spGetTotalCallInQueue = new SqlCommand("sp_getToTalCallInQueue", conn) 
                {CommandType = CommandType.StoredProcedure}; 
        var o = new KeyType {name = "ciq"}; 
        keys.AddLast(o); 
        value.ciq = spGetTotalCallInQueue.ExecuteScalar().ToString(); 

        var spGetWallBoardMatrixTb = new SqlCommand("sp_getWallBoardMatrixTB", conn) 
                {CommandType = CommandType.StoredProcedure}; 

        var spGetMaxLongestWaitingTime = new SqlCommand("sp_getMaxLongestWaitingTime", conn) 
                 {CommandType = CommandType.StoredProcedure}; 
        o = new KeyType { name = "lwt" }; 
        keys.AddLast(o); 
        value.lwt = spGetMaxLongestWaitingTime.ExecuteScalar().ToString(); 

        var spGetCurrentDateTime = new SqlCommand("sp_getCurrentDateTime", conn) 
                {CommandType = CommandType.StoredProcedure}; 
        o = new KeyType { name = "timestamp" }; 
        keys.AddLast(o); 
        value.timestamp = spGetCurrentDateTime.ExecuteScalar().ToString(); 
       } 
      } 
      catch(Exception e) 
      { 
       GetLogger().Error(e); 
      } 
      context.Response.ContentType = "text/json"; 
      context.Response.Write(JsonConvert.SerializeObject(data, Formatting.Indented)); 
     } 
    } 
} 

당신이 나에게 사람을 도울 수 있다면 정말 정말 감사 ...

+2

이 http://yourserver.com/WallboardHandler.ashx합니까 작업을 시도 할 것인가? – mplungjan

+0

질문을하기 전에 구문 오류 *를 해결하십시오 (찾기가 어렵거나 이해가되지 않는 경우 제외). 콘솔을 보았거나 JSHint와 같은 도구를 사용했다면 보셨을 것입니다. –

답변

2

당신은 당신의 AJAX 호출에 구문 오류가 있습니다. 성공 함수 뒤에 쉼표가 필요합니다. 이것을 다음으로 바꾸십시오 :

  jQuery.ajax(
       { 
        type: "POST", 
        async: true, 
        url: 'WallboardHandler.ashx', 
        contentType: "application/json; charset=utf-8", 
        dataType: "json", 
        success: function (obj) { 
         for (var i = 0; i < obj.key.length; i++) { 
          jQuery("#" + obj.key[i].name).html(obj.value[0][obj.key[i].name]); 
         } 
        }, 
        error: errorAlert 
       }); 
+0

Drat - 내가 읽을만한 것으로 다시 포맷하는 동안 당신은 그것에 나를 때렸다. – mplungjan

0

오류 처리기 전에 쉼표가 누락되었습니다.

나는 위치 표시 줄에서 자체적으로이

<script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>   
<script type="text/javascript"> 
$(document).ready(function() { 
    $.ajax({ 
    type: "POST", 
    async: true, 
    url: 'WallboardHandler.ashx', 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (obj) { 
     for (var i = 0; i < obj.key.length; i++) { 
     $("#" + obj.key[i].name).html(obj.value[0][obj.key[i].name]); 
     } 
    }, 
    error: function(e, jxr) { 
     alert("Your request is not successful. " + jxr); 
    } 
    }); 
});