当值是初始值时在新行的末尾放置错误消息

Question

我有一个内联创建的表格，即你点击添加行，它打开你可以编辑的行，你可以放置数据，在可编辑的行中你有保存按钮。

当用户单击按钮保存按钮（'#btnsubmit'）时，我希望如果属性名称是初始的，则在表格行的右侧以红色添加错误消息，我不知道 怎么做，有什么想法吗？

td><input id="btnsubmit" type="submit" value="Create" class="btn btn-default" /></td><td></tr>';

        function addRow() {
            if ($('#btnsubmit').length == 0) {

                jQuery(html).prependTo('#data-table');

                $('#btnsubmit').click(function () {
                $('#checkBox1').attr('disabled', 'true');
                $('input').attr('readonly', true);
                $('input[type=checkbox]').attr('readonly', true);
                });

            }
        }


 var html = '<tr><td>@Html.TextBox("name")</td><td>@Html.CheckBox("checkBox1")</td>input id="btnsubmit" type="submit" value="Create" class="btn btn-default" /></td><td></tr>

更新

$('#btnsubmit').click(function () {

            $(".errmsg").remove();
            $(".err").removeClass('err');

            var row = $(this).parent();
            var nameval = document.getElementById('name');
            var val = nameval.value;
            if (val.trim().length < 1) {
                nameval.addClass('err');
                var err = $("<div class='errmsg'>field empty</div>");
                row.after(err);

在 nameval.addClass('err'); 行中我在检查元素中遇到错误 uncouget 错误：undefined 不是函数，知道吗？

Answer 1

这里或多或少是你想要的..

http://jsfiddle.net/GHw9q/3/

基本上我将您的 addnew-button 点击​​处理程序更新为：

 $('.addnew-button').click(function(){
        $(".errmsg").remove();
        $(".err").removeClass('err');            

        var _row = $(this).parent();
        var _input = _row.children('.data-category');
        if (_input.val().trim().length<1) {
            _input.addClass('err');
            var _err = $("<div class='errmsg'>field empty</div>");
            _row.after(_err);
        }
        else {
            $(this).remove();
            initRowEvents(jQuery(document));
        }

    });

并添加了一些 css.. 看看.. 如果您有任何问题，请告诉我

---

如果使用变量 html:

var html = '<tr><td>@Html.TextBox("name")</td><td>@Html.CheckBox("checkBox1")</td><td><input id="btnsubmit" type="submit" value="Create" class="btn btn-default" /></td></tr>';

首先请注意，我已经修复了您在变量中遇到的一些错误..

代码应该和上面一样，只是_input变量应该改为：

   var _input = _row.find('input').filter(":first");

** 这取决于您的“姓名”输入字段是 tr..中的第一个输入。