JQuery 1.4.4和Datatable 1.7不工作

I needed some help with datatables. I might be missing something here:-

我需要一些关于数据的帮助。我可能漏掉了一些东西:-

Below is my HTML

下面是我的HTML

<div id="cfcPhoneDirectory">
<table id="dynamicPhoneDirectory">
    <thead>
       <tr><th>Phone Book</th><th>Last Name</th><th>First Name</th><th>Number</th></tr>
    </thead>
</table>

And the Script

和脚本

    var rawxmlData = "<PhoneBooks><PhoneBook><name>PhoneBook1</name><type>GLOBAL</type><Contacts><Contact><LNAME>Elis</LNAME><FNAME>Jason</FNAME><Number>1234567890</Number></Contact><Contact><LNAME>Randell</LNAME><FNAME>Mark</FNAME><Number>7895896710</Number></Contact><Contact><LNAME>Flower</LNAME><FNAME>Andy</FNAME><Number>8796024589</Number></Contact></Contacts></PhoneBook><PhoneBook><name>PhoneBook2</name><type>TEAM</type><Contacts><Contact><LNAME>Cullinan</LNAME><FNAME>David</FNAME><Number>6027051573</Number></Contact><Contact><LNAME>Webber</LNAME><FNAME>Mark</FNAME><Number>4842051298</Number></Contact><Contact><LNAME>Mitchell</LNAME><FNAME>Randy</FNAME><Number>7012841562</Number></Contact></Contacts></PhoneBook></PhoneBooks>";

    var t = $('#dynamicPhoneDirectory').DataTable();


    var xmlData = JSON.stringify(xmlToJson(rawxmlData));

    ($(xmlData)).find("PhoneBook").each(function () 
    {
       var phoneBookType = $(this).find("type").text()
       $(this).find("Contact").each(function () {     t.row.add([phoneBookType,     $(this).find("LNAME").text(),                     $(this).find("FNAME").text(), $(this).find("Number").text()]).draw();
       });
    });
    // Changes XML to JSON
    function xmlToJson(xml) {

        // Create the return object
        var obj = {};

        if (xml.nodeType == 1) { // element
            // do attributes
            if (xml.attributes.length > 0) {
            obj["@attributes"] = {};
                for (var j = 0; j < xml.attributes.length; j++) {
                    var attribute = xml.attributes.item(j);
                    obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
                }
            }
        } else if (xml.nodeType == 3) { // text
            obj = xml.nodeValue;
        }

        // do children
        if (xml.hasChildNodes()) {
            for(var i = 0; i < xml.childNodes.length; i++) {
                var item = xml.childNodes.item(i);
                var nodeName = item.nodeName;
                if (typeof(obj[nodeName]) == "undefined") {
                    obj[nodeName] = xmlToJson(item);
                } else {
                    if (typeof(obj[nodeName].push) == "undefined") {
                        var old = obj[nodeName];
                        obj[nodeName] = [];
                        obj[nodeName].push(old);
                    }
                    obj[nodeName].push(xmlToJson(item));
                }
            }
        }
        return obj;
    };

I am using Jquery version of 1.4.4 and datatable version of 1.7.5?

我使用的是Jquery版本的1.4.4和datatable版本的1.7.5?

Any help would be appreciated.

如有任何帮助，我们将不胜感激。

Thanks, Hash

谢谢,希

2 个解决方案

#1

I gave up debugging the XML parsing - too cryptic. There is no need for porting the XML to JSON at all. So made this up instead :

我放弃了调试XML解析——太神秘了。根本不需要将XML移植到JSON。所以这是编造出来的:

var table = $('#dynamicPhoneDirectory').dataTable();

var parser = new DOMParser(),
    xmlDoc = parser.parseFromString(rawxmlData,"text/xml"),
    phoneBook = xmlDoc.querySelector('PhoneBooks'),
    phoneBooks = phoneBook.querySelectorAll('PhoneBook');

for (var i=0;i<phoneBooks.length;i++) {
    var firstname, lastname, number, contacts,
        phoneBookName = phoneBooks[i].querySelector('name').textContent,
        phoneBookContacts = phoneBooks[i].querySelector('Contacts'),
        contacts = phoneBookContacts.querySelectorAll('Contact');
    for (var c=0;c<contacts.length;c++) {
        lastName = contacts[c].querySelector('LNAME').textContent;
        firstName = contacts[c].querySelector('FNAME').textContent;        
        number = contacts[c].querySelector('Number').textContent;        
        //add the contact to dataTables
        table.fnAddData([phoneBookName, lastName, firstName, number]);
    }        
}

this works with datatables 1.7.5 -> http://jsfiddle.net/nsmqg4n2/ the used jQuery is 1.6.4, the lowest possible in jsFiddle, but that does not really inflict on the above code after all. jQuery dataTables 1.7.5 just need jQuery 1.3.x or better.

这适用于datatables 1.7.5 -> http://jsfiddle.net/nsmqg4n2n2/使用的jQuery是1.6.4，是jsFiddle中可能的最低级别，但是这并不会真正影响上面的代码。jQuery dataTables 1.7.5只需要jQuery 1.3。x或更好。

To retrieve data (for example when the table is clicked) use the API method fnGetData(), example (jQuery 1.6.4, dataTables 1.7.5) :

要检索数据(例如单击该表)，请使用API方法fnGetData()，例如(jQuery 1.6.4, dataTables 1.7.5):

$("#dynamicPhoneDirectory").delegate('tbody tr', 'click', function() { 
    var data = table.fnGetData(this);
    alert('Number to dial : '+data[3]);
});

forked fiddle -> http://jsfiddle.net/bu87ke7a/

分叉的小提琴- > http://jsfiddle.net/bu87ke7a/

2 个解决方案

#1

更多相关文章

随机推荐