2014-09-05 48 views
0

我試圖使用jqTree來呈現可摺疊樹以通過使用AJAX的ASP.NET項目顯示來自MySQL數據庫的數據。將字符串轉換爲Javascript對象以便在jqTree中使用

問題:

我能順利拿到包含jqTree格式的數據字符串(這是 JSON,即使他們說支持的話)從我的AJAX調用回。然而,一旦我得到它,它會呈現爲一個垂直的字符串。如果我對數據進行類型化調用,它表示它是一個字符串,即使通過console.log進行視覺檢查時它看起來像一個對象。

我嘗試了許多不同的方法將字符串轉換爲對象,結果各不相同。

我在代碼中使用這背後返回字符串製造:

return sb.ToString(); 

結果字符串看起來是這樣的(注意沒有包裝引號):

[{label: 'PCBID: 350',children:[{label: 'TimeStamp: 04-Sep-14 10:30:23'},{label: 'User:  DAVEG'},{label: 'PCBID: 350'},{label: 'Assembly Drawing: 41411'},{label: 'PCB Drawing: 10348'},{label: 'Vendor: SBE'},{label: 'PO Number: 98019'}]},{label: 'Serial Number: Not Assigned'},{label: 'Assembly Drawing: 41411'},{label: 'Last Test Result: None Found'}] 

它得到呈現像這樣在我的div:

[ 
{ 
l 
a 
b 
e 
l 
: 

' 
P 
C 
B 
I 
D 
...and so on... 

我知道這些正在由jqTr呈現因爲我可以拖拽&,它們在點擊時突出顯示等等,但不是樹視圖,我會看到一個「搖晃的藤蔓」視圖,但並不完全有用。

如果我只是採取完全相同的同一個字符串,並宣佈它作爲JS內的VAR(不使用message.d的返回值):

var data = [{label: 'PCBID: 350',children:[{label: 'TimeStamp: 04-Sep-14 10:30:23'},{label: 'User: DAVEG'},{label: 'PCBID: 350'},{label: 'Assembly Drawing: 41411'},{label: 'PCB Drawing: 10348'},{label: 'Vendor: SBE'},{label: 'PO Number: 98019'}]},{label: 'Serial Number: Not Assigned'},{label: 'Assembly Drawing: 41411'},{label: 'Last Test Result: None Found'}] 

我的JS代碼裏面&使用的是,它完美顯示並且typeof認爲它是一個對象。

工作實例,所以你可以看到我在尋找:

JSFiddle

守則的JS方:

這裏是我的AJAX調用與成功的部分一堆註釋掉的版本不起作用:

success: function (message) 
    { 
     console.log("SUCCESS: Inside processEvent AJAX success call"); 
     console.log(message.d); 
     console.log(typeof message); 
     console.log(typeof message.d); 
     var data = message.d; 
     //this method works, but not very useful as it's hard coded: 
     //var data = [{ label: 'PCBID: 350', children: [{ label: 'TimeStamp: 04-Sep-14 10:30:23' }, { label: 'User: DAVEG' }, { label: 'PCBID: 350' }, { label: 'Assembly Drawing: 41411' }, { label: 'PCB Drawing: 10348' }, { label: 'Vendor: SBE' }, { label: 'PO Number: 98019' }] }, { label: 'Serial Number: Not Assigned' }, { label: 'Assembly Drawing: 41411' }, { label: 'Last Test Result: None Found' }]; 
     var data = $.getJSON(message.d); 
     //var data = { JSON.parse(message.d) }; 
     //var data = ({}).valueOf.call($.parseJSON(message.d)); 
     //var data = object.create(message.d); 
     console.log(typeof data); 
     console.log(data); 
     $(function() 
     { 
      $('#tree1').tree({ 
       data: data, 
       autoOpen: false, 
       saveState: true, 
       dragAndDrop: true 
      }); 
     }); 

問題:

畢竟是這樣,我的問題是,我該如何採取從AJAX message.d字符串,並把它變成一個對象,以便jqTree可以用它來呈現樹我米尋找?

工作代碼:

我已經添加回來一些成功的用戶,告知的東西(jGrowl),所以不要讓你扔。那固定它的代碼位是在這裏:data = eval($.parseJSON(message.d));

success: function (message) 
    { 
     console.log("SUCCESS: Inside processEvent AJAX success call"); 
     console.log(message.d); 
     //if it's a non query event, do this 
     if (DTO.eventData.eventType != "PCBID_query") 
     { 
      $.jGrowl("\nSuccessfully inserted a " + DTO.eventData.eventType + " event into the MySQL database.", 
       { header: 'SUCCESS', theme: "pcb-success", life: 10000 }); 
     } 
     //if processData was used for a PCBID query, process this code 
     if (DTO.eventData.eventType === "PCBID_query") 
     { 
      var data = {}; 
      data = eval($.parseJSON(message.d)); 
      $(function() 
      { 
       //force reload of tree data 
       $('#tree1').tree('loadData', data); 
       $('#tree1').tree({ 
        data: data, 
        autoOpen: false, 
        saveState: true, 
        dragAndDrop: true 
       }); 
      }); 
     } 

我知道eval是邪惡&提出了一個安全漏洞,但是,這是一個將只對本地服務器&生產車間電腦上使用的所有內部代碼所以我認爲風險是可以接受的(我的經理也是如此)。

+0

'eval(data)'在這種情況下會起作用,但這是一個安全問題。你最好的解決方案是尋找一種真正的方法從你的ASP.NET中導出JSON。在不知道你的代碼的情況下,一些Google搜索表明那裏有解決方案。 – 2014-09-05 17:32:48

+0

我試着用'返回Newtonsoft.Json.JsonConvert.SerializeObject(sb.ToString(),Newtonsoft.Json.Formatting.Indented)作爲JSON導出數據;'但是當我解析它時,我得到了相同的結果JS方面。這不會被任何人在外部使用,所以安全問題可能是沒有意義的。我會給你一個建議嘗試(雖然我已經嘗試了幾個使用eval的其他方法,只是沒有在例子中包含它們)。 – delliottg 2014-09-05 17:36:58

+0

工作,謝謝!有沒有另外一種方法可以做到不使用'eval'?無論如何,因爲它只是一個內部工具,我並不過分擔心安全問題。如果你想寫一個快速答案,我會選擇它。順便說一句,我看到你的原始答案,然後使用getJSON刪除它並嘗試了它,沒有奏效。 再次感謝。 – delliottg 2014-09-05 18:05:50

回答

1

eval(data)可以在這種情況下工作,但使用eval()通常是一個安全問題,尤其是從公共區域(如用戶提交的SQL數據)獲取數據時。

最好的解決方案是尋找一種真正的方式從ASP.NET中導出JSON。在不知道你的代碼的情況下,一些Google搜索表明那裏有解決方案。

+0

安全不應該是一個問題這是一個內部唯一的工具。感謝您的幫助,我很感激。 – delliottg 2014-09-05 20:00:57