selektor + appendRow in a datagrid => only allow static content...

[paule32]

Hello,

I try to make the static HTML structure a little bit dynamically.
So, I had tried the "appendRow" Function to append a row, and
fill the datagrid with text.

The getting of the text from the INPUT fields of a FORM placed
on a dialog, is not the problem.

The problem is, that easyui do not parse the function body of
embeeded code in the function call of "appendRow".

The Question is now:
How can I use variables, instead static code ?

// this function works !

function appendTableData(dg)
{
    alert('apppend');

    let t1 = 'firstnamedg'+dg;
    let t2 = 'lastnamedg' +dg;
    let t3 = 'phonedg'    +dg;
    let t4 = 'emaildg'    +dg;

    let s1 = $('#'+t1).textbox('getText').replace(/ $/g,"");
    let s2 = $('#'+t2).textbox('getText').replace(/ $/g,"");
    let s3 = $('#'+t3).textbox('getText').replace(/ $/g,"");
    let s4 = $('#'+t4).textbox('getText').replace(/ $/g,"");

    if (s1.length > 0)
        if (s2.length > 0)
            if (s3.length > 0)
                if (s4.length > 0)
                    $("#dg" + dg).datagrid('appendRow',{
                        'firstnamedg1': s1,
                        'lastnamedg1' : s2,
                        'phonedg1'    : s3,
                        'emaildg1'    : s4
                    });
}


// the following function content *do not* work !

function appendTableData(dg)
{
    alert('apppend');

    let t1 = 'firstnamedg'+dg;
    let t2 = 'lastnamedg' +dg;
    let t3 = 'phonedg'    +dg;
    let t4 = 'emaildg'    +dg;

    let s1 = $('#'+t1).textbox('getText').replace(/ $/g,"");
    let s2 = $('#'+t2).textbox('getText').replace(/ $/g,"");
    let s3 = $('#'+t3).textbox('getText').replace(/ $/g,"");
    let s4 = $('#'+t4).textbox('getText').replace(/ $/g,"");

    if (s1.length > 0)
        if (s2.length > 0)
            if (s3.length > 0)
                if (s4.length > 0)
                    $("#dg" + dg).datagrid('appendRow',{
                        'firstnamedg' + dg: s1,
                        'lastnamedg' + dg: s2,
                        'phonedg'     + dg: s3,
                        'emaildg'      + dg: s4
                    });
}


// this is an other coding style, that does not work with easyui !

function appendTableData(dg)
{
    alert('apppend');

    let t1 = 'firstnamedg'+dg;
    let t2 = 'lastnamedg' +dg;
    let t3 = 'phonedg'    +dg;
    let t4 = 'emaildg'    +dg;

    let s1 = $('#'+t1).textbox('getText').replace(/ $/g,"");
    let s2 = $('#'+t2).textbox('getText').replace(/ $/g,"");
    let s3 = $('#'+t3).textbox('getText').replace(/ $/g,"");
    let s4 = $('#'+t4).textbox('getText').replace(/ $/g,"");

    if (s1.length > 0)
        if (s2.length > 0)
            if (s3.length > 0)
                if (s4.length > 0)
                    $("#dg" + dg).datagrid('appendRow',{
                        t1: s1,
                        t2: s2,
                        t3: s3,
                        t4: s4
                    });
}


take a look to the three functions.
You can see, that the second, and third function differ from the first,
if You view the important "appendRow" part.

In a dynamically webproject, it is not possible to use variables and/or
placeholders.
Or did I something wrong?

I have tried these three functions, and do not come to a expected senario.

Thanks for helping Hands

[jarry]

Please call this code instead in your third function.

Code:

$("#dg" + dg).datagrid('appendRow',{
    [t1]: s1,
    [t2]: s2,
    [t3]: s3,
    [t4]: s4
});