jquery?? help!!!

[LaughingKor]

if(draggable.attr("value")==1)
alert("correct!");
else

}




after the else, i'm looking for something like "myline.remove()"

to remove the line which is wrong.

not sure what exactly to key in there..

 

[davidktw]

if(draggable.attr("value")==1)
alert("correct!");
else

}




after the else, i'm looking for something like "myline.remove()"

to remove the line which is wrong.

not sure what exactly to key in there..

I on't quite get what you are trying to achieve. But if you ask me that you want to remove a line, maybe what you want to look at is the removeChild method. Get parent node of the line and remove the child identified using the child ID or anyway you deem fit.

https://developer.mozilla.org/en-US/docs/Web/API/Node/removeChild

 

[LaughingKor]

I on't quite get what you are trying to achieve. But if you ask me that you want to remove a line, maybe what you want to look at is the removeChild method. Get parent node of the line and remove the child identified using the child ID or anyway you deem fit.

https://developer.mozilla.org/en-US/docs/Web/API/Node/removeChild

meaning for this, the items on the left column is draggable, so when i drag it to the item on the right, if it is not correct, i want to remove that line. Only leave the line when the answer is correct. like this question:

so i want to remove the specific line at the else portion when the answer is wrong.

$(function () {
      
      $(".boxes").draggable(
          {revert: true,
           
         }
      );
      
     
	  $("#droppable").droppable({
          drop: function (event, ui) {
            var draggable = ui.draggable;
            if(draggable.attr("value")==1)
                alert("correct!");
              else
			  
			  	alert("WRONG!");
                
				
				
           }
		   
		   });
		 $("#droppable2").droppable({
          drop: function (event, ui) {
            var draggable = ui.draggable;
            if(draggable.attr("value")==4)
                alert("correct!");
              else
                
				alert("WRONG!");
				
           }

 

[davidktw]

meaning for this, the items on the left column is draggable, so when i drag it to the item on the right, if it is not correct, i want to remove that line. Only leave the line when the answer is correct. like this question:

so i want to remove the specific line at the else portion

$(function () {
      
      $(".boxes").draggable(
          {revert: true,
           
         }
      );
      
     
	  $("#droppable").droppable({
          drop: function (event, ui) {
            var draggable = ui.draggable;
            if(draggable.attr("value")==1)
                alert("correct!");
              else
			  
			  	alert("WRONG!");
                
				
				
           }
		   
		   });
		 $("#droppable2").droppable({
          drop: function (event, ui) {
            var draggable = ui.draggable;
            if(draggable.attr("value")==4)
                alert("correct!");
              else
                
				alert("WRONG!");
				
           }

I believe in the "event" object, you can use the srcElement property to obtain a reference to the object that is currently being dragged ?

But the question is, "Is the line the object?" If not you will need to identify yourself which is the line object and use the removeChild method to remove it.

 

[LaughingKor]

I believe in the "event" object, you can use the srcElement property to obtain a reference to the object that is currently being dragged ?

But the question is, "Is the line the object?" If not you will need to identify yourself which is the line object and use the removeChild method to remove it.

so in that case i would have to put this at the else portion?

parent.removeChild(myline);

but i only want myline to be the last line which i've drawn

 

[davidktw]

so in that case i would have to put this at the else portion?

parent.removeChild(myline);

but i only want myline to be the last line which i've drawn

How about you go and do some thinking first

 

[LaughingKor]

How about you go and do some thinking first

these are some of the ideas i currently have, tomorrow go back test it out.

do correct me if i'm heading in the wrong direction

var list = [B]document[/B].getElementById[B]("myList");[/B]  
list.removeChild(list.childNodes[0]);

and based on my code it would be replacing the myList with myspace?? since the lines are all in myspace, and the childNodes[0] change it to the last by using len(list) - 1. Or i could use ".lastChild.innerHTML;" to get the last childnode instead?


i'm actually confused as what to put in the bolded part...

 

[davidktw]

these are some of the ideas i currently have, tomorrow go back test it out.

do correct me if i'm heading in the wrong direction

var list = [B]document[/B].getElementById[B]("myList");[/B]  
list.removeChild(list.childNodes[0]);

and based on my code it would be replacing the myList with myspace?? since the lines are all in myspace, and the childNodes[0] change it to the last by using len(list) - 1. Or i could use ".lastChild.innerHTML;" to get the last childnode instead?


i'm actually confused as what to put in the bolded part...

Then go test it out and make the mistake and observe. It is called trial and error

 

[LaughingKor]

i'm not really sure what went wrong, is it right to put the codes at the bolded area? i've tried exchange certain variables following websites but it doesn't seem to work...

perhaps some clue on the placement of the codes or any sources? thanks!

$(window).load(function(){
var noOfLines = -1;

$("#myspace").data("draw_mode", false);

var createline = function(id,x1,y1,x2,y2,color,w) {
    var aLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    aLine.setAttribute('id', id);
    aLine.setAttribute('x1', x1);
    aLine.setAttribute('y1', y1);
    aLine.setAttribute('x2', x2);
    aLine.setAttribute('y2', y2);
    aLine.setAttribute('stroke', color);
    aLine.setAttribute('stroke-width', w);
    return aLine;
}

var draw = function(e) {
	console.debug("draw (" + e.pageX + "," + e.pageY + ")");
    var draw_start = $("#myspace").data("draw_start");
    var myline = $("#myline"+noOfLines)[0];
    myline.setAttribute("x1", draw_start.x);
    myline.setAttribute("y1", draw_start.y);
    myline.setAttribute("x2", e.pageX);
    myline.setAttribute("y2", e.pageY);
};

var penup = function(e) {
    $("#myspace").data("draw_mode", false);
    console.debug("pen up = " + $("#myspace").data("draw_mode"));
    $("#myspace").off("mousemove", draw);

    
    if ($("#myspace")[0].checkIntersection($("#myline"+noOfLines)[0], $("#myrect")[0].getBBox())) alert("Intersection Occurs");
};

var pendown = function(e) {
    $("#myspace").data("draw_mode", true);
    console.debug("pen down = " + $("#myspace").data("draw_mode"));
    $("#myspace")[0].appendChild(createline('myline'+(++noOfLines),0,0,0,0,"rgb(255,0,0)",2));
    $("#myspace").data("draw_start", { "x" : e.pageX, "y" : e.pageY });
    $("#myspace").on("mousemove", draw);
};

$("#myspace").on("mouseup", penup);
//$("#myspace").on("mouseleave", penup);
$("#myspace").on("mousedown", pendown);



//---------------------------------------
  




  $(function () {
      
      $(".boxes").draggable(
          {revert: true,
           
         }
      );
      
     
	  $("#droppable").droppable({
          drop: function (event, ui) {
            var draggable = ui.draggable;
			[B][SIZE="5"]var list = createline.getElementById("myline").lastChild.innerHTML;[/SIZE][/B]
            if(draggable.attr("value")==1)
                alert("correct!");
              else
			  		
               [B][SIZE="5"] list.parentNode.removeChild(myline+[noOfLines])[/SIZE][/B];
				
				
           }

 

[KnightNiwrem]

i'm not really sure what went wrong, is it right to put the codes at the bolded area? i've tried exchange certain variables following websites but it doesn't seem to work...

perhaps some clue on the placement of the codes or any sources? thanks!

Do you even know what you are doing? Programming is not about the trial-and-error on the placement of lines of programs, you know?

 

[LaughingKor]

Do you even know what you are doing? Programming is not about the trial-and-error on the placement of lines of programs, you know?

i'm thinking that the remove line code should be there, at the else (if the value doesn't match, then remove the line.).

but i can't seem to get it to work

 

[davidktw]

i'm thinking that the remove line code should be there, at the else (if the value doesn't match, then remove the line.).

but i can't seem to get it to work

Dude, when I ask you to trial-and-error, it is to first reason about what you are going to do and postulate an idea and then try out if it works.

Not trial-and-error add or remove lines, unless you can reason adding or removing should result in what effect. So your trial and error is to observe if your amendments indeed get the results you expected, or you get something else and then reason why it did not get what you wanted and what that change eventually resulted in what you see instead.

 

[KnightNiwrem]

i'm thinking that the remove line code should be there, at the else (if the value doesn't match, then remove the line.).

but i can't seem to get it to work

Let's start with this. createline is a variable that has been assigned an anonymous function, right?

Then what does createline.getElementById.xx.xxx even mean?

 

[LaughingKor]

Let's start with this. createline is a variable that has been assigned an anonymous function, right?

Then what does createline.getElementById.xx.xxx even mean?

i'm not sure what they mean by parent node, i was thinking it's to get the id of the element i want which is myline, under createline....

 

[KnightNiwrem]

i'm not sure what they mean by parent node, i was thinking it's to get the id of the element i want which is myline, under createline....

No, I'm not talking about the line in the else block.

Have you tried to see what list is?

You know... like alert(list); or console.log(list);.

If list was the line you created, what is the output expected? If not, what would be the output obtained?

 

[davidktw]

i'm not sure what they mean by parent node, i was thinking it's to get the id of the element i want which is myline, under createline....

If the code uses appendChild for your line object, which is the parent of your line object ?

 

[LaughingKor]

If the code uses appendChild for your line object, which is the parent of your line object ?

i think it would be whatever is before .appendChild?

like $("#myspace")[0].appendChild

 

[LaughingKor]

No, I'm not talking about the line in the else block.

Have you tried to see what list is?

You know... like alert(list); or console.log(list);.

If list was the line you created, what is the output expected? If not, what would be the output obtained?

sorry, i don't quite get you...

list meaning after i create the variable list to get the element "myline"?

 

[davidktw]

i think it would be whatever is before .appendChild?

like $("#myspace")[0].appendChild

https://developer.mozilla.org/en/docs/Web/API/Node/appendChild

 

[KnightNiwrem]

sorry, i don't quite get you...

list meaning after i create the variable list to get the element "myline"?

Duh. You don't see any other list, right?