JSON, возвращенный из ASP.NET WebService, неадекватен

Question

Я создал несколько веб-сервисов, которые успешно сериализуют мои типы .NET в JSON. Однако я столкнулся с проблемой полной совместимости JSON с библиотекой YUI и, в частности, с таблицей данных.

Таблица данных YUI может быть полностью настроена с использованием объектов JSON. Я создал следующую структуру в .NET для представления данного определения столбца YUI:

 public struct YuiColumnDefinition{
        public string key;
        public string label;
        public bool sortable;
        public string formatter;
 }

Свойство 'formatter' - это то, как вы указываете таблице YUI использовать пользовательскую функцию javascript при отображении данного столбца. Проблема заключается в том, что, поскольку средство форматирования определено как строка, ASP.NET оборачивает свое значение в двойные кавычки при сериализации, и YUI больше не распознает значение как токен JavaScript:

JSON YUI ожидает

[ 
{key:"1", label:"Order Date", formatter:myCustomJavaScriptFunction, sortable:true},
{key:"2", label:"Customer Name", formatter:null, sortable:false}
]

JSON ASP.NET создает

[ 
{key:"1", label:"Order Date", formatter:"myCustomJavaScriptFunction", sortable:true},
{key:"2", label:"Customer Name", formatter:null, sortable:false}
]

У кого-нибудь есть решение помимо изменения исходного кода YUI?

Спасибо

Answer 1

Измените код анализа.

Думайте о json как о замене xml, вы не поместите переменную / функцию в xml. В любом случае вы могли бы легко идентифицировать имя или тип (скажем, из списка или перечисления) используемого форматера. Тогда ваш код синтаксического анализа будет знать, что он должен назначить переменную / метод в качестве свойства "formatter".

Просто неправильно возвращать фактическую переменную / функцию в таком обратном вызове. Вы могли бы заставить это работать, но, честно говоря, это не тот путь.

Я бы сделал следующее ...

Измените свой обратный json на это.

[ 
{key:"1", label:"Order Date", formatterName:"myCustomJavaScriptFunction", sortable:true},
{key:"2", label:"Customer Name", formatterName:null, sortable:false}
]

Тогда в JS предположим, что json хранится в переменной returnedObj

function augmentReturnedObject(returnedObj)
{
    // validate that returnObj.formatterName (as a variable) is not undefined
    var isValidObj = (window[returnedObj.formatterName] !== undefined);

    if (isValidObj)
    {

        // this will return the actual function / variable, here we are assigning it to returnedObj.formatter
        returnedObj.formatter = window[returnedObj.formatterName];
    }
    else
    {
        returnedObj.formatter = null;
    }
}

Вы можете легко уменьшить это до этого, не задумываясь

function augmentReturnedObject(returnedObj)
{
    var specifiedMethod = window[returnedObj.formatterName];

    returnedObj.formatter = (specifiedMethod === undefined) ? null : window[returnedObj.formatterName];
}

Итак, в конце вы возьмете свой объект json и сделаете augmentReturnedObject(returnedObj);, и в этот момент вы можете передать returnedObj в YUI

Answer 2

Как правильно заметил Аллен:

Просто неправильно возвращать фактическую переменную / функцию в таком обратном вызове.

Тем не менее, я не смог найти нигде в документации по YUI, где объясняется, как работать с функциями JavaScript, возвращаемыми в виде строк из JSON или XML.

Слава Богу за блоги. Как указано в this one, «правильный» способ регистрации пользовательских функций форматирования javascript заключается в использовании YAHOO.widget.DataTable.Formatter:

Определения столбцов JSON, возвращенные из .ASMX

[              
 {key:"1", label:"Order Date", formatter:"myCustomJavaScriptFunction1", sortable:true},             
 {key:"2", label:"Customer Name", formatter:null, sortable:false}             
 {key:"3", label:"State", formatter:"myCustomJavaScriptFunction2", sortable:false}             
]

Javscript для подключения таблицы данных YUI

YAHOO.widget.DataTable.Formatter.myCustomJavaScriptFunction1= this.myCustomJavaScriptFunction1;
YAHOO.widget.DataTable.Formatter.myCustomJavaScriptFunction2= this.myCustomJavaScriptFunction2;

function  myCustomJavaScriptFunction1(elCell, oRecord, oColumn, oData) {
   //do something
}

function  myCustomJavaScriptFunction2(elCell, oRecord, oColumn, oData){
   //do something
}