Question

我正在使用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>

第一个＆lt; a＆gt; tag用于触发脚本以删除联系人，而第二个使用jQuery cluetip在悬停时显示一个框（此处跳过详细信息）。

我遇到的问题是HTML没有正确呈现。生成的是：

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

警告框表示具有有效ID（Guid）和名称（“Darren Oster”）的数据。名称正在正确呈现，但ID字段不会在'rel'属性中呈现，并且'onclick'语句将被完全删除。

这是MS Ajax的限制还是我做错了什么？

提前致谢。

Answer 1

如果属性要包含任何{{}}表达式，则它必须是整个值。

是： foo =“{{'abc'+ ID}}”

没有： foo =“abc {{ID}}”

至于onclick没有被生成，它可能是，但是你使用的任何检查都没有显示值，因为它是使用直接的element.onclick设置，而不是addAttribute（）。

Answer 2

InfinitiesLoop让我走上正轨，所以这是最终的答案（如果有其他人遵循这条道路的话）......

首先，我使用的是MS Ajax 4.0的早期预览版。我现在已经更新到预览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>

在＆lt; select＆gt;内变

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

Sys.UI.DataView和javascript的问题

2 个答案: