Jquery + ligne table jeditable modifier plusieurs champs

Question

J'essaie de comprendre la façon d'éditer une ligne de table par bouton avec jquery et jeditable. Mon but est d'avoir un bouton "modifier" qui va changer les cellules de la ligne désirée en mode édition.

Selon maintenant, j'ai:

$(document).ready(function() { 
    $("#addrowbutton").click(function() { 
     $("#addrow").show(); 
    }); 
    $("#canceladd").click(function() { 
     $("#addrow").hide(); 
    }); 
    $("#saveadd").click(function() { 
     $("#message").text("Added").fadeOut(4000, function() { 
      $(this).css('display','block').text(""); 
     }); 
     $("#addrow").hide(); 
    }); 
    $("#add_trade_form").submit(function() { 
     process_details(); 
     return false; 
    }); 
    function process_details() { 
     $("#add_trade_form").ajaxSubmit(); 
     return false; 
    } 
    $(".editlink").click(function() { 
     var datapos = $(this).parent().parent().prevAll().length; 
     var editpos = datapos + 1; 

     $("#trades_table tbody tr:eq(" + datapos + ")").hide(); 
     $("#trades_table tbody tr:eq(" + editpos + ")").show(); 
    }); 

    $(".cancellink").click(function() { 
     var editpos = $(this).parent().parent().prevAll().length; 
     var datapos = editpos - 1; 

     $("#trades_table tbody tr:eq(" + datapos + ")").show(); 
     $("#trades_table tbody tr:eq(" + editpos + ")").hide(); 
    }); 
    $(".savelink").click(function() { 
     var editpos = $(this).parent().parent().prevAll().length; 
     var datapos = editpos - 1; 

     $("#message").text("Saved...").fadeOut(4000, function() { 
      $(this).css('display','block').text(""); 
     }); 
     $("#trades_table tbody tr:eq(" + datapos + ")").show(); 
     $("#trades_table tbody tr:eq(" + editpos + ")").hide(); 
    }); 

}); 

Alors:

• ajoutant ligne apparaît et se cache avec un bouton

• d'affichage modifier la ligne et résilie comme il se doit avec des valeurs I veulent

Où je suis perdu maintenant:

• comment prendre les nouvelles valeurs des entrées et de les transmettre au contrôleur (plusieurs id, valeurs) ... J'utilise MVC. < = .savelink

• comment enregistrer la nouvelle ligne sans rafraîchir la page mais rafraîchir la table avec les nouvelles valeurs < = #saveadd

Un grand merci à l'avance pour toute l'aide.

Cheers,

/Jacek

Answer 1

Je recommande fortement d'utiliser jqGrid

Regardez les exemples de démonstration et les exemples d'édition.

Ils ont aussi un plugin for .NET