Comment ajouter dynamiquement des lignes à des données d'arbres imbriqués dans le tabulateur ?

Question

Dans le cadre de mon projet, j'ai besoin d'ajouter de nouvelles lignes enfant aux lignes parent dans un arbre de données en fonction des données de formulaire soumises par l'utilisateur. Je n'ai pas trouvé d'exemple de cette opération dans la documentation. Est-il possible d'utiliser la fonction addRow({...}) ? Comment puis-je déclarer quel parent doit ajouter la ligne enfant ? Ou dois-je créer une fonction personnalisée qui insère la nouvelle ligne dans l'objet JSON du tableau et redessine le tableau ?

Merci pour votre aide !

Answer 1

La solution que j'ai utilisée consiste à ajouter de nouveaux objets de rangée à une copie du tableau _children de la rangée parente, puis à envoyer une mise à jour à la rangée parente. Pour ce faire, vous devez trouver la rangée parent, récupérer ses données (qui incluront le tableau _children des objets de rangée enfant), ajouter la nouvelle rangée de données à _children, et mettre à jour les données de la rangée parent dans la table de données.

$("#add-child-row").click(function(){
    //Get values for child row form fields
    var childFields = $("#child-form").serializeArray().reduce(function(obj, item) {
        obj[item.name] = item.value;
        return obj;
    }, {});

    var newRow = {
        name: childFields.name,
        location: childFields.location,
        gender: childFields.gender,
        col: childFields.color,
        dob: childFields.dob,
    };

    //Find row to add child
    //searchRows() returns array
    //In my case, I am only expecting one matching row so use index 0
    var parentRow = table.searchRows("name","=","Oli Bob");

    //Get data for the parent row so we can update it's _children array
    var tempParentRowData = parentRow[0].getData();

    //Add new row to children array
    tempParentRowData._children.push(newRow);

    //Update data table row with new children array
    parentRow[0].update({_children:tempParentRowData._children});
});

Je ne sais pas si cela fonctionnerait bien si vous prévoyez d'avoir un grand nombre de rangs d'enfants. Si la solution ci-dessus présente un défaut ou s'il existe une meilleure solution, je serais ravi de la connaître.