首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > .NET > C# >

!动态加载文本框的有关问题

2013-09-07 
在线等!动态加载文本框的问题!先简单陈述一下需求:每次打开某条记录,点击button,只加载一个trtd文本框

在线等!动态加载文本框的问题!
先简单陈述一下需求:每次打开某条记录,点击button,只加载一个<tr><td>文本框</td></tr>,并给新加载的文本框赋值,保存;再次打开这条记录时,要显示出加载的所有文本框及内容(注:每条记录加载的文本框数量不等),并再次加载一个新的文本框,以此类推.
我自己的思路,有点繁琐,实现起来有点困难,陈述一下:隐藏几个<tr><td>文本框</td></tr>(在后台输出<tr>格式的方法我不会,只想到先隐藏后显示的笨办法),int i储存显示文本框的数量,再次打开记录时,读取i,显示出i个文本框,再点击button加载i+1个文本框,直到隐藏数量的文本框显示完毕.对于这个思路,加载的文本框越多,越复杂,我也觉得这样实现起来比较笨.向大家请教有什么好的方法来实现我这个需求? C# 动态加载文本框
[解决办法]

<input type="text" name="element" id="element" />
    <input type="button" value="Tilf?j" id="add" />
    <br />

    <span id="MCQ-textbox">&nbsp;
        <table id="tbl" border="1">
            <tbody>
            </tbody>
        </table>
    </span>



function createDynamicTable() 
{
    var tbody = $("#tbl");
    var rows = $('#element').val();
    var number_of_columns = 3;

    if (tbody == null 
[解决办法]
 tbody.length < 1) return;

    var tfirstrow = $("<tr>");
    $("<th>")
                .addClass("tableCell")
                .text("#")
    //               .data("col")
                .appendTo(tfirstrow);
    $("<th>")
                .addClass("tableCell")


                .text("Svarmulighed")
    //               .data("col")
                .appendTo(tfirstrow);
    $("<th>")
                .addClass("tableCell")
                .text("Hj?lpetekst")
    //               .data("col")
                .appendTo(tfirstrow);

    tfirstrow.appendTo(tbody);

    for (var i = 0; i < rows; i++) {

        var trow = $("<tr>");
        for (var c = 0; c < number_of_columns; c++) 
        {

            var td = $("<td>")
                    .addClass("tableCell")
                    .data("col", c)
                    .appendTo(trow);
            switch(c) {
                case 0:
                    $("<input type="text" id="MCQ_"+i+"__choice_number" name="MCQ["+i+"].choice_number"/>").appendTo(td);
                    break;
                case 1:
                    $("<input type="text" id="MCQ_"+i+"__choice_wording" name="MCQ["+i+"].choice_wording"/>").appendTo(td);
                    break;


                case 2:
                    $("<input type="text" id="MCQ_"+i+"__help_text" name="MCQ["+i+"].help_text"/>").appendTo(td);
                    break;
                    
            }
        }
        trow.appendTo(tbody);
    }

}


$(document).ready(function () {
    $('#add').click(function () {
        createDynamicTable();
    });
});

热点排行