Problème avec Sys.UI.DataView et javascript

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

  •  16-09-2019
  •  | 
  •  

Question

J'utilise Microsoft Ajax pour remplir dynamiquement une liste de contacts, étant donné un paquet de JSON. Mon code est le suivant: 

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'));
}

Le html associée est la suivante: 

<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>

La première balise est utilisé pour déclencher un script pour supprimer le contact, tandis que le second utilise le cluetip jQuery pour faire apparaître une boîte sur le vol stationnaire (détails sauté ici).

Le problème que j'ai est que le HTML n'est pas rendu correctement. Ce qui est généré est: 

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

La zone d'alerte indique que les données avec carte d'identité valide (Guid) et le nom ( « Darren Oster »). Le nom est rendu correctement, mais le champ d'ID n'est pas rendu dans l'attribut « rel », et la mention « onclick » est entièrement supprimée.

Est-ce une limitation de MS Ajax ou que je fais quelque chose de mal?

Merci d'avance.

Était-ce utile?

La solution

Si un attribut doit contenir toutes les expressions {{}} il doit être la valeur entière.

Oui: foo = "{{ 'abc' + ID}}"

Non: foo = "abc {{ID}}"

En ce qui concerne onclick pas généré, il est probablement, mais quelle que soit l'inspection que vous utilisez ne vous montre pas la valeur, car elle est définie par un ensemble direct de element.onclick, non addAttribute ().

Autres conseils

InfinitiesLoop me mettre sur la bonne voie, alors voici la réponse finale (au cas où quelqu'un d'autre suit ce chemin) ...

D'abord, j'utilisais un aperçu antérieure de MS Ajax 4.0. Je suis maintenant mis à jour pour afficher un aperçu 5, et les choses fonctionnent un peu différemment. Voici le code HTML final (le javascript est inchangé): 

<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>

Notez également que 5 aperçu requiert « sys: » préfixe sur tous les attributs qui ont des valeurs liées aux données, donc 

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

dans un

Le contenu est autorisé sous Creative Commons.

Si vous trouvez des violations du droit d'auteur, vous pouvez nous contacter à info@generacodice.com pour demander la suppression du contenu.

scroll top