Проблема с Sys.UI.DataView и javascript

StackOverflow https://stackoverflow.com/questions/1469205

  •  16-09-2019
  •  | 
  •  

Вопрос

Я использую Microsoft Ajax для динамического заполнения списка контактов с использованием пакета json.Мой код выглядит следующим образом:

function fillContactsFromData(contacts) {
    // this is just for debug to let me know that the data is correct
    if (contacts.length > 0) {
        alert('ID: ' + contacts[0].ID + ', Name: ' + contacts[0].Name);
    }

    $create(Sys.UI.DataView, { data: contacts }, null, null, $get('contacts'));
}

Связанный html-код выглядит следующим образом:

<div id="contacts" class="sys-template">
    <a onclick="removeContact('{{ ID }}');"><img src="remove.png" /></a>
    <a class="contact" rel="/Contacts/Index/{{ ID }}">{{ Name }}</a><br />
</div>

Первый <a> тег используется для запуска скрипта для удаления контакта, в то время как второй использует jQuery cluetip для вызова окна при наведении курсора мыши (подробности здесь пропущены).

Проблема, с которой я сталкиваюсь, заключается в том, что HTML отображается некорректно.То, что генерируется, является:

<div id="contacts">
    <a><img src="remove.png" /></a>
    <a class="contact" rel="/Contacts/Index/{{ ID }}">Darren Oster</a><br />
</div>

В поле предупреждения указываются данные с действительным идентификатором (Guid) и именем ("Даррен Остер").Имя отображается правильно, но поле ID не отображается в атрибуте 'rel', а оператор 'onclick' полностью удален.

Это ограничение MS Ajax или я что-то делаю неправильно?

Заранее благодарю.

Это было полезно?

Решение

Если атрибут должен содержать какие-либо выражения {{ }}, это должно быть полное значение.

ДА:foo="{{ 'abc' + ID }}"

НЕТ:foo="abc{{ ID }}"

Что касается того, что onclick не генерируется, вероятно, это так, но какая бы проверка вы ни использовали, она не показывает вам значение, поскольку оно задается прямым набором element.onclick, а не AddAttribute() .

Другие советы

InfinitiesLoop навел меня на правильный путь, так что вот окончательный ответ (на случай, если кто-то еще пойдет по этому пути)...

Во-первых, я использовал более ранний предварительный просмотр MS Ajax 4.0.Теперь я обновился до версии preview 5, и все работает немного по-другому.Вот окончательный HTML (javascript остается неизменным):

<div id="contacts" class="sys-template">
    <a sys:onclick="{{ 'removeContact(\'' + ID + '\');' }}"><img src="remove.png" /></a>
    <a class="contact" sys:rel="{{ '/Contacts/Index/' + ID }}">{{ Name }}</a><br />
</div>

Также обратите внимание, что для предварительного просмотра 5 требуется префикс 'sys:' для любых атрибутов, имеющих значения, привязанные к данным, поэтому

<option value="{{ Value }}">{{ Text }}</option>

внутри a <select> становится

<option sys:value="{{ Value }}">{{ Text }}</option>
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top