0

I have list of divs that are produced dynamically, which basically users clicks on one of the them ex: the div dat has data-square=0-1 and then clicks on the div data-square=0.8, the class attr and data-square values are being send to server and server approves whether they should be replaced or not. for replacing. but first inner div attr should be replaced by the second one thats clicked, and the first one should have a class=empty

before being send to server:

<div class="column" data-square="0-1">
<div class="GREEN"></div>
</div>

<div class="column" data-square="0-5">
    <div class="GREEN"></div>
</div>

<div class="column" data-square="0-8">
    <div class="YELLOW"></div>
</div>

it should be like this once it receives back from server

 <div class="column" data-square="0-1">
    <div class="EMPTY"></div>
</div>
 <div class="column" data-square="0-5">
    <div class="GREEN"></div>
</div>
 <div class="column" data-square="0-8">
    <div class="GREEN"></div>
</div>

but when i receive from the server, it deletes all the class titled GREEN, it should replace the class titled GREEN which the user clicked the fist time.

i can replace and make the first div to empty without sending it to server, but when it comes to , performing the actions upon receiving the entire class gets deleted.

$.post("check.php", { from:from,to:to,classFrom:$classFrom,classTo:classTo},
         function(data) {

    $($classFrom).children().removeAttr('class').addClass('EMPTY');
           })
  • A class selector, by definition, selects all DOM elements with the same class. How is $classFrom defined? If $classFrom is defined as $('.GREEN'), then it will select all elements with a class of GREEN as you've described. – Dan A. Apr 23 '12 at 17:12
  • so the only solution would be copying the entire div right? – user1349526 Apr 23 '12 at 17:14

1 Answers1

2

Just do it in 2 lines, remove the old, add the new:

$($classFrom).children().removeClass( classFrom );
$($classFrom).children().addClass('EMPTY');
Jonathan Payne
  • 2,223
  • 13
  • 11
  • 2
    Or in just 1 line: `$($classFrom).children().removeClass(classFrom).addClass("EMPTY")` – Andrew Whitaker Apr 23 '12 at 17:10
  • it gives me classFrom undefined – user1349526 Apr 23 '12 at 17:29
  • What are the values that you're getting back from the server? (ie: from:from,to:to,classFrom:$classFrom,classTo:classTo ) – Jonathan Payne Apr 23 '12 at 17:32
  • from stores the data-square that is clicked first, to stores the data square that is clicked second, classFrom stores the inner child of column clicked first, and classTo stores the inner child of second column clicked – user1349526 Apr 23 '12 at 17:51
  • right, but what are the actual text values that you're receiving back from the server? what does classFrom=? – Jonathan Payne Apr 23 '12 at 17:54
  • from the server, it is just true or false, boolean if its true it can replace. its like a chess game. knight wants to kill the white pawn. so when it kills its previous space should be empty. server does some validation and either returns true or false – user1349526 Apr 23 '12 at 17:56
  • Ok, we just need to know which square was passed. Can you get "0-1" back from the server? – Jonathan Payne Apr 23 '12 at 18:07
  • yes . What i did now is i assign number to an ID , so for loop begins from 0 till it ends which is like 50, il be having a unique value, and i get the child of it and do the surgery – user1349526 Apr 23 '12 at 18:35