Getting properties of dojo's dijit.InlineEditBox for ajax request

Question

In essence I have the same problem as described in this question, but the accepted answer there is not fully working for me.

I want to have the id of the record I'm processing in an HTML5 compliant data-myid attribute, then when the text in the text area is changed, I want call a function that will send an ajax request containing the new value and data-myid to the server. This is important because there can be multiple inlineEditBoxesi a single page. The ajax request part I'm fine with, is getting the proper values to send where I'm stuck.

So far, I know the end result of the HTML declaration will look something like this:

<span data-dojo-type="dijit.InlineEditBox"  data-dojo-props="editor:'dijit.form.Textarea'" data-myid="123" title="some title" id="test" >
<script type="dojo/connect" event="onChange" data-dojo-args="myid,value">
  console.log(myid + " changed to value " + value);
</script>1339598</span> 

But I have not been able to get this to work.

Answer 1

You can get the myId value through

this.domNode.dataset.myid;

... in your onChange event.

Example here : http://jsfiddle.net/psoares/ycEN7/

A more portable solution is to use dojo/dom-attr instead though, like this :

*HTML

<div id="editBox" data-dojo-type="dijit/InlineEditBox"  
     data-dojo-props="editor:'dijit/form/Textarea'"
     data-myid="123" 
     title="some title">1339598</div>
<div id="output"><div>`

*Javascript :

require(["dojo/dom",
     "dojo/dom-attr",
     "dojo/parser",
     "dojo/html",
     "dijit/registry",
     "dijit/InlineEditBox", 
     "dijit/form/Textarea",
    "dojo/domReady!"], 
function(dom, domAttr, parser, html, registry){
    var editBox;
    parser.parse().then(function(instances){
        editBox = registry.byId("editBox");
        editBox.on("change", function(value){
           var myId = domAttr.get(this.domNode, "data-myid");
           html.set(dom.byId("output"), "Editor " + myId + "'s value changed to " + value); 
         });
    });
});