2012-03-01 42 views
0

所以我有一个包含多个发布和取消发布按钮的表。ajax的jQuery Parent

简单按钮:

<button id="publish" 
    <?php 
     if ($singleBlog->isPublished()) 
      echo ' class="green small"'; 
     else 
      echo ' class="green red small"'; 
    ?> 
    value="<?php echo $singleBlog->getBlogId(); ?>">publish</button> 

添加的按钮。

然后我做ajax调用,返回一些东西,并更改切换按钮类和名称。 它曾经工作之前,我添加了ajax,但我似乎无法使它与ajax调用工作。

我怀疑这是因为在ajax调用中引用它,我似乎无法弄清楚如何得到它的父母!

任何帮助将不胜感激这一个。

<script> 
     $(document).ready(function() { 
      $("button#publish").click(function() { 
      //alert($(this).attr("value")); 
      var id = $(this).attr("value"); 
      $.ajax({ 
       type: "POST", 
       url: "ajax/blogPublishUnpublish.php", 
       data: "id="+ id , 
       success:function(result){ 
        var button = this; 
        if (result == '0' || result == '1'){ 
         alert("in"); 
         $(button).toggleClass("red"); 

         if($(this).is('.green')) 
          $(this).text('publish'); 

         if($(this).is('.red')) 
          $(this).text('unpublish'); 
         alert("done"); 
        } 

       } 
      }); 
      // alert(index); 


     }); 
     }); 
     </script> 

回答

0

我会再次选择按钮,或者如果您担心切换ID,请创建一个变量。

$(document).ready(function() { 
     $("button#publish").click(function() { 
     var myID = "#" + (this).attr("id"); 
     var id = $(this).attr("value"); 
     $.ajax({ 
      type: "POST", 
      url: "ajax/blogPublishUnpublish.php", 
      data: "id="+ id , 
      success:function(result){ 

       if (result == '0' || result == '1'){ 
        alert("in"); 
        $(myID).toggleClass("red"); 

        if($(myID).is('.green')) 
         $(myID).text('publish'); 

        if($(myID).is('.red')) 
         $(myID).text('unpublish'); 
        alert("done"); 
       } 

      } 
     }); 
     // alert(index); 


    }); 
    }); 
+0

我没有设法做到这一点。 我不得不尝试别的东西。 Thanx – 2012-03-02 12:57:31

+0

究竟发生了什么?什么是失败? – tedski 2012-03-02 15:26:28

0

因为我没有设法做到这一点,所以我稍微改变了它。

我的按钮:

<button id="publish" 
        <?php 
         if ($singleBlog->isPublished()) 
          echo ' class="green small"'; 
         else 
          echo ' class="red small"'; 
        ?> 
        value="<?php echo $singleBlog->getBlogId(); ?>"><?php 
         if ($singleBlog->isPublished()) 
          echo 'published'; 
         else 
          echo 'unpublished'; 
        ?></button><img id="progress<?php echo $singleBlog->getBlogId(); ?>" src="includes/images/progress.gif" style="display:none" /></td> 

和M阿贾克斯

$(document).ready(function() { 
      $("button#publish").click(function() { 
       var id = $(this).attr("value"); 
       var progress = '#'+$(this).attr('progress'+id); 
       $('#progress'+id).show(); 
       if ($(this).text() == 'published') 
        $(this).text('unpublished'); 
       else 
        $(this).text('published'); 
       $(this).toggleClass('green'); 
       $(this).toggleClass('red'); 
       $.ajax({ 
         type: "POST", 
         url: "ajax/blogPublishUnpublish.php", 
         data: "id="+ id , 
         success:function(result){ 
          if (result == -1){ 
           // add X button in case if fails ! 
          } 
          $('#progress'+id).hide(); 
        } 
       }); 
     }); 
     }); 

不是最优化的解决方案,但它是我能想出一个页面来处理多个实例的唯一途径。