MVC Deletemodal使用jQuery的額外選項

Question

在MVC中，我做了一個jQuery模態，詢問我是否確定要刪除它，然後用$.post進行回發我在所有'索引視圖'中都使用它，它相當多。

對於大多數的意見，當我刪除的東西，從表中的行還與hide()

現在，對於一些意見，事情並沒有真正被刪除刪除，但他們得到「無效」。因此，在這種情況下，我不想從表中刪除他們，我寧願只是給他們的類「rowinactive」

所以這就是我的了：

的Index.aspx

<script type="text/javascript"> 
    $(document).ready(function() { 

     $(".delbtn").click(function() { 
      var msg = "deelnemer \"" + $(this).parent().parent().find(".dlnVoornaam").text() + " "+$(this).parent().parent().find(".dlnNaam").text()+"\" "; 
      deleteConfirmation(msg, this, true); 
      return false; 
     }); 
    }); 
</script> 

的HTML表

  <th> 
      </th> 
      <th> 
       Aanspreking 
      </th> 
      <th> 
       Naam 
      </th> 
      <th> 
       Voornaam 
      </th> 

      <th> 
       Functie 
      </th> 
      <th> 
       Creatiedatum 
      </th> 
      <th> 
       Annulatiedatum 
      </th> 
      <th> 

       Update 
      </th> 
      <th> 
       Email 
      </th> 
      <th> 
       Username 
      </th> 
     </tr> 

     <tr class="rowinactive"> 

      <td> 

      </td> 
      <td> 
       De heer 
      </td> 
      <td class="dlnNaam"> 
       Van der Straeten                                                            
      </td> 
      <td class="dlnVoornaam"> 
       Stefan                                                               
      </td> 

      <td> 
       Webdev                        
      </td> 
      <td> 
       29/09/2010 
      </td> 
      <td> 
       29/09/2010 
      </td> 
      <td> 


      </td> 
      <td> 
       xxx                                                          
      </td> 
      <td> 
       Stefan.Van der Stra 
      </td> 
     </tr> 

     <tr class=""> 
      <td> 


<a href='/2011-2012/Deelnemer/Edit/5?instID=3562'> 
    <img src="/img/pencil.png" alt="Edit" width="16" /></a> 

<a href='/2011-2012/Deelnemer/Details/5?instID=3562'> 
    <img src="/img/application_view_detail.png" alt="Details" 
     width="16" /></a> 

<a class="delbtn" href='/2011-2012/Deelnemer/Delete/5?instID=3562'> 
    <img src="/img/cancel.png" alt="Delete" width="16" /></a> 

      </td> 
      <td> 

       De heer 
      </td> 
      <td class="dlnNaam"> 
       Van der Straeten                                                            
      </td> 
      <td class="dlnVoornaam"> 
       Stefan                                                               
      </td> 
      <td> 
       Webdev                        
      </td> 

      <td> 
       29/09/2010 
      </td> 
      <td> 

      </td> 
      <td> 

      </td> 
      <td> 
       xxx                                                          
      </td> 

      <td> 
       Stefan.VanderStraet 
      </td> 
     </tr> 

     <tr class="rowinactive"> 
      <td> 

      </td> 
      <td> 
       De heer 
      </td> 

      <td class="dlnNaam"> 
       Van der Straeten                                                            
      </td> 
      <td class="dlnVoornaam"> 
       Stefan                                                               
      </td> 
      <td> 
       Webdev                        
      </td> 
      <td> 

       29/09/2010 
      </td> 
      <td> 
       29/09/2010 
      </td> 
      <td> 

      </td> 
      <td> 
       xxx                                                          
      </td> 

      <td> 
       Stefan.VanderStraet1 
      </td> 
     </tr> 

     <tr class=""> 
      <td> 

<a href='/2011-2012/Deelnemer/Edit/7?instID=3562'> 
    <img src="/img/pencil.png" alt="Edit" width="16" /></a> 

<a href='/2011-2012/Deelnemer/Details/7?instID=3562'> 

    <img src="/img/application_view_detail.png" alt="Details" 
     width="16" /></a> 

<a class="delbtn" href='/2011-2012/Deelnemer/Delete/7?instID=3562'> 
    <img src="/img/cancel.png" alt="Delete" width="16" /></a> 

      </td> 
      <td> 
       De heer 
      </td> 
      <td class="dlnNaam"> 
       Van der Straeten                                                            
      </td> 

      <td class="dlnVoornaam"> 
       Stefan                                                               
      </td> 
      <td> 
       Webdev                        
      </td> 
      <td> 
       29/09/2010 
      </td> 
      <td> 


      </td> 
      <td> 

      </td> 
      <td> 
       xxx                                                          
      </td> 
      <td> 
       Stefan.VanderStraet2 
      </td> 
     </tr> 


    </table> 

個外部JS文件

function deleteConfirmation(msg, handler) { 
    deleteConfirmation(msg, handler, false); 
} 

function deleteConfirmation(msg, handler, inactive) { 
    var showIt = function (hash) { 
     hash.w.find("#modaltekst").text(msg); 
     $("#btnJa").data('handler', $(handler)); 
     $("#btnJa").data('inactive', inactive); 
     $("#delmodal").show(); 
     return false; 
    }; 

    $("#delmodal").jqm({ onShow: showIt }).jqmShow(); 

} 

$(document).ready(function() { 
    $("#btnJa").click(function() { 
     $("#delmodal").jqmHide(); 
     setHighlight("Verwijderen..."); 
     $.post($(this).data('handler').attr('href'), null, function (data) { 
      if (data.succes) { 
       setHighlightOK("Verwijderd"); 
       if ($("#btnJa").data('inactive')==false) { 
        $("#btnJa").data('handler').parent().parent().fadeOut("slow"); 
       } else { 
        $("#btnJa").data('handler').parent().parent().addClass("rowinactive"); 
       } 
      } else { 
       if (data.error != "") { 
        setError(data.error); 
       } else { 
        setError("Verwijderen mislukt."); 
       } 
      } 
     }, "json"); 
    }); 

    $("#btnNee").click(function() { 
     $("#delmodal").jqmHide(); 
    }); 
}); 

因此，爲了使有可能使該行不活動的，而不是隱藏它，我加了一個boolean的var inactive。

現在，我不想添加inactive var，我想在我的Index.aspx中調用deleteConfirmation發送function。該函數將包含需要在回發的成功執行的代碼。我想要這個，因爲我想隱藏不活動行的按鈕，儘管我可能可以通過live()來完成，但這對我來說看起來並不乾淨。

附加問題是：您將如何優化此代碼？從別人

Answer 1

我從我們的代碼假設，就是你想兩件事情

1區分非活動行 2，禁用刪除和編輯鏈接

U可以做到這一點通過編寫一些CSS和jQuery。 ü可以寫爲不活動的行

.inactive 
{ 
    background-color:gray; 

} 

$("tr.inactive a").live("click",function(){ 
    return false; 
}); 

和當u使用Ajax調用滅活烏爾行U可以只添加類「不活躍」，以相應的TR和關閉相應的刪除按鈕，像

$("tr.inactive .delBtn").attr("disabled","disabled");