2013-12-15 11 views
5

spservices, datatable, jeditable 및 datatable.editable을 사용하여 SharePoint 2010에서 작업하고 있습니다. 다음과 같이 프레임 워크 내 버전은datatable editable가 IE에 문제가 있습니다.

  1. IE 9, 10, 11
  2. jQuery를 2013.01
  3. 데이터 테이블 1.7.2
  4. spservices 1.9.4
  5. 데이터 테이블 편집 2.3.3
  6. jedittable N/A

이제는 datatabale의 편집이 FireFox 및 Chrome bu에서 잘 작동하고 있습니다. IE에서 작동하지 않는 요소에서 흐려지면 사라지지 않습니다. 다음과 같이

내 코드는

<link rel="stylesheet" type="text/css" href="/sites/MS/Style%20Library/en-us/CSS/forms-simple.css"/> 

    <script type="text/javascript" src="/sites/ms/Style%20Library/en-us/JS/jquery.min.js"></script> 
    <script type="text/javascript" src="/sites/ms/Style%20Library/en-us/JS/jquery.SPServices-2013.01.min.js"></script> 
<script type="text/javascript" src="/sites/ms/Style%20Library/MarketSurveillance.js"></script> 
    <script type="text/javascript" src="/sites/MS/Style%20Library/ar-sa/JS/jquery.dataTables.min.js"></script> 
<script type="text/javascript" src="/sites/MS/Style%20Library/en-us/JS/jquery.jeditable.mini.js"></script> 
<script type="text/javascript" src="/sites/MS/Style%20Library/en-us/JS/jquery.dataTables.editable.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
var oTable, anOpen = [], sImageUrl = "/sites/MS/Style%20Library/Images/", sInner; 
var viewFields = "<FieldRef Name='ID' /><FieldRef Name='Title' /><FieldRef Name='TelephoneNo' /><FieldRef Name='PlaceOfProduct' />"; 
viewFields += "<FieldRef Name='CategoryID' /><FieldRef Name='SubCategoryID' /><FieldRef Name='Status' />"; 
populateGrid("/sites/ms/", "ComplaintForm", viewFields, "", handleData); 

oTable = $("#tbComplaintForm").dataTable({ 
    "bProcessing": true, 
    "aoColumns": [ 
    { 
     "bSortable": false, 
     "mDataProp": null, 
     "mData": null, 
     "sClass": "control center", 
     "sDefaultContent": '<img src="' + sImageUrl + 'details_open.png">' 
    }, 
    null , 
    null , 
    null , 
    null , 
    null , 
    null 
    ] 
}); 

oTable.makeEditable({ 
    "aoColumns": [ 
    null, null, null, null, null, null, 
    { 
     "sName": "Status", 
     "indicator": "Approve/Reject Complaint Status", 
     "tooltip": "Approve/Reject", 
     "loadtext": "loading...", 
     "type": "select", 
     "onblur": "submit", 
     "data": "{'0':' ', '3':'Approved','4':'Rejected'}", 
     "sUpdateURL": function (value, settings) { 
     var columnId = oTable.fnGetPosition(this)[2]; 
     var dataArray = []; 
     dataArray.push([oTable.fnSettings().aoColumns[columnId].sTitle, value]); 
     itemOperation("/sites/ms/", "ComplaintForm", "Update", dataArray, $(this).closest('tr').attr('id')); 
     return value; 
     } 
    } 
    ], 
    "oEditableSettings": { event: 'click' } 
}); 

$('#tbComplaintForm td.control').live('click', function() { 
    var nTr = this.parentNode; 
    var i = $.inArray(nTr, anOpen); 

    if (i === -1) { 
    $('img', this).attr('src', sImageUrl + "details_close.png"); 
    var nDetailsRow = oTable.fnOpen(nTr, fnFormatDetails(oTable, nTr), 'details'); 
    $('div.innerDetails', nDetailsRow).slideDown(); 
    anOpen.push(nTr); 
    } 
    else { 
    $('img', this).attr('src', sImageUrl + "details_open.png"); 
    $('div.innerDetails', $(nTr).next()[0]).slideUp(function() { 
     oTable.fnClose(nTr); 
     anOpen.splice(i, 1); 
    }); 
    } 
    }); 
}); 

    function fnFormatDetails(oTable, nTr) { 
var oData = oTable.fnGetData(nTr); 
var _viewFields = "<FieldRef Name='Comments' /><FieldRef Name='Suggestions' />"; 
var qry = "<Query><Where><Eq><FieldRef Name=\"ID\" /><Value Type=\"Counter\">" + $(nTr).attr('id') + "</Value></Eq></Where></Query>"; 
populateGrid("/sites/ms/", "ComplaintForm", _viewFields, qry, innerData); 
var sOut = sInner; 
return sOut; 
} 

    function innerData(xData, Status) { 
sInner = ""; 
sInner += '<div class="innerDetails"><table cellpadding="7" cellspacing="0" border="0" style="padding-left:75px;">'; 
if (Status == "success") { 
    $(xData.responseXML).SPFilterNode("z:row").each(function() { 
    sInner += '<tr><td>Comment:</td><td>' + $(this).attr("ows_Comments") + '</td></tr>'; 
    sInner += '<tr><td>Suggestions:</td><td>' + $(this).attr("ows_Suggestions") + '</td></tr>'; 
    }); 
} 
sInner += '</table></div>'; 
} 

    function handleData(xData, Status) { 
var datarows = "<tbody>"; 
var query = ""; 
if (Status == "success") { 
    $(xData.responseXML).SPFilterNode("z:row").each(function() { 
    datarows += "<tr id=" + $(this).attr("ows_ID") + "><td class='read_only'></td><td>" + $(this).attr("ows_Title") + "</td>"; 
    datarows += "<td>" + $(this).attr("ows_TelephoneNo") + "</td>"; 
    query = "<Query><Where><Eq><FieldRef Name=\"ID\" /><Value Type=\"Text\">" + $(this).attr("ows_CategoryID").replace(".00000000000000", "") + "</Value></Eq></Where></Query>"; 
    datarows += "<td>" + getSingleItem("http://sp2010-base", "SAS_Categories", "Category_Title_EN", query) + "</td>"; 
    query = "<Query><Where><Eq><FieldRef Name=\"ID\" /><Value Type=\"Text\">" + $(this).attr("ows_SubCategoryID").replace(".00000000000000", "") + "</Value></Eq></Where></Query>"; 
    datarows += "<td>" + getSingleItem("http://sp2010-base", "SAS_SubCategories", "Sub_Category_Title_EN", query) + "</td>"; 
    datarows += "<td>" + $(this).attr("ows_PlaceOfProduct") + "</td>"; 
    if ($(this).attr("ows_Status") == 0) 
     datarows += "<td></td></tr>"; 
    else if ($(this).attr("ows_Status") == 1) 
     datarows += "<td>In Plane</td></tr>"; 
    else if ($(this).attr("ows_Status") == 2) 
     datarows += "<td>Checked</td></tr>"; 
    else if ($(this).attr("ows_Status") == 3) 
     datarows += "<td>Approved</td></tr>"; 
    else if ($(this).attr("ows_Status") == 4) 
     datarows += "<td>Rejected</td></tr>"; 
    }); 
    datarows += "</tbody>"; 
    $("#tbComplaintForm").append(datarows); 
} 
} 

불만 이름 전화 번호 카테고리 하위 카테고리 제품의 장소 상태

IE와 함께 문제가 될 수있는 이유

+0

어떤 버전의 IE를 사용하고 있습니까? – hanskishore

+0

친절하게 내 대답을 편집 된대로 확인하십시오. – Milind

+0

@Milind JSFiddle에서 작은 예제를 재현 할 수 있습니까? – Danny

답변

0

이 답변은 필요한 답변이 아닐 수도 있지만 마지막 코멘트에 따르면 IE의 JavaScript 디버거가 실행되고 있지만 정상적으로 작동하지 않는 코드가있는 것 같습니다. 이것은 console.log 또는 다른 종류의 "디버거 전용 js 코드"가 원인 일 수 있습니다. 다음은 가능한 문제에 대한 답변입니다. My application works in IE only in debug mode (works in other browsers)