Dojo.query foreach accessing element value

Question

I'm a newbie in Dojo framework, so I hope my question is not really dumb.

I have a link in my web page :

<a href="#" value="${index}" name="delete_name" id="delete_id${index}">Delete</a>

The variable "index" is well defined, no issue with that.

Then, I've written this piece of code to add an action to the onclick event on my link and a JS function to call before the submit :

dojo.query("a[name=supprimerEnfant_name]").forEach(function(element) {
    Spring.addDecoration(new Spring.AjaxEventDecoration({
        formId: "form_id",
        elementId: element.id,
        event: "onclick",
        beforeSubmit: function(){
            jsFunctionToCall(element.value);
        },
        params: { _eventId: "deleteEvent", fragments:"frag"}
    }))
});

In my jsFunctionToCall, I can get the element.id (checked and it's OK) but the element's value is null and I can't figure out why.

I'm probably missing something important, could you help me with that ?

Thanks in advance.

Answer 1

You should be aware that element.value only works with elements where it's part of the DOM, defined by W3C. So, if you look at the HTMLInputElement interface (used by form elements), you will see that it clearly has a property called value, referencing to the the value of the element.

However, the same is not true for an HTMLAnchorElement. This means the proper way to retrieve the value of the value attribute, is by selecting the attribute itself, using the getAttribute() function or by using the the dojo/dom-attr Dojo module.

For example:

require(["dojo/query", "dojo/dom-attr", "dojo/domReady!"], function(query, domAttr) {
    query("a").forEach(function(element) {
        console.log(element.id);
        console.log(domAttr.get(element, "value")); // This will work
    });
});

Demonstration: JSFiddle

Answer 2

The dojo query will return the domNode references always. Anyhow, the anchor element is a HTML element. So, this is nothing to do with Dojo and lets see whats wrong with the JS part.

The "value" is not a standard attribute of anchor element. So, the additional attributes need to be accessed using "getAttribute" method. i.e. in your case,

element.getAttribute('value')