Click here to Skip to main content
15,887,027 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I want to update a specific object member via an event.
An object with a canvas is created and that object has a text member that will be drawn on the canvas. Each object contains html that fires an event called call_text.
I want to update the text member of each object through the call_text event.
But the code below doesn't work the way I want it to.
The point is that updating the text member via the call_text event is reflected in all object members, not the event object.
I would like to know how to solve this problem.

Thanks for reading.
Sorry for my english.

What I have tried:

JavaScript
// module object
var ele_canvas = function(){
   var subtext;

   return {
      setText: function( text ){
         subtext = text;
      },
      display: function( args ){
          html = "<div id='canvasWrapper"+args.id+"' class='canvaswrapper'><canvas ><canvas id='canvas"+args.id+"'></canvas><a href='#' class='call_text' data-root='"+args.id+"' data-target='"+args.target+"' >choose</a></div>";
          return html;
      }
   }
}

var theCanvas;
$(document).on('click', '.view-canvas', function(){
/* One or more multiple objects are created through this event. */
    const args = {        
        'id': $(this).attr('data-id'),
        'type': $(this).attr('data-type');
    }
    var theCanvas = Object.create(ele_canvas());
    $('#dataFeed').append(theCanvas.display(args));
}

$(document).on('click', '.call_text', function(){
    const id = $(this).attr('data-root');
    const target = $(this).attr('data-target');

    $.ajax({
         url: "http://localhost/html/subtext/view_text.php",
         type: "GET",
         data: { data: id },
         success: function ( json ){
            const result = JSON.parse(json);
            console.log(typeof(result));
            /* here Problem */
            theCanvas.setText(result.subText);
            drawScreen(target, true); // drawing text on canvas of theCanvas Object.
         }
    });
    return false;
});
Posted
Updated 1-Aug-22 9:43am
v3

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900