0

我有一张包含大量文本输入的表格，例如： alt text http://img380.imageshack.us/img380/6697/snapsh.png

（它们是少数学生的考试成绩）。

每个字段都有一个用于添加注释的关联图标，因此当单击该图标时，必须显示一个带有文本区域的对话框，然后将其值保存到隐藏的输入中。

标记字段的示例：

<input class="num" type="text" size="2" value="5.69" name="calif[57][6]"/>
<a id="57_6" class="addObs" title="Add comment" href="#">
<img alt="Add" src="http://localhost/xxx/assets/img/comment.png"/>
</a>

每个链接都用 studentID_itemID 标识

这是我编码的，但它根本不起作用。

var opciones = {
        title: 'Add comment',
        modal: true,
        buttons: {
            OK: function() {
                $(this).dialog('close');
                x = $('#obserText').val();
                $('#obser' + id).val(x);

            }
        }
    };

    $('.addObs').click(function(){
        x = this.id.split('_');
        y = '[' + x[0] + '][' + x[1] + ']';

        // If the hidden file exists, show its value
        // It should show the dialog again to allow edit the comment, but I'll leave it until later
        if (document.getElementById('obser' + y))
        {
            alert ($('#obser' + y).val());
        }
        //If not...
        else
        {
            //Create it
            $(this).parent().prepend('<input type="hidden" id="obser' + y + '"/>');

            //Show the dialog
            dialog = $('<div></div>')
                .html('<textarea id="obserText"></textarea>')
                .dialog(opciones);


        }

我不知道如何传递 ID 以将评论保存到其隐藏的输入中。

提前感谢，对不起我的英语

4

2 回答 2

1

使用这些修改进行测试：

var opciones = {
        title: 'Add comment',
        modal: true,
        buttons: {
            OK: function() {
                $(this).dialog('close');
                x = $('#obserText').val();
                $('#obser' + id).val(x);
            }
        }
};

$('.addObs').click(function(){

  var id = this.attr("id");
  var x = id.split('_');
  var y = '[' + x[0] + '][' + x[1] + ']';

  // If the hidden file exists, show its value
  // It should show the dialog again to allow edit the comment, but I'll leave it until later
  if ($('#obser_' + id).length>0)
  {
    alert($('#obser_' + id).val());
  }
  else  //If not...
  {
    //Create it
    $(this).parent().prepend("<input type=\"hidden\" id=\"obser_" + id + "\" />");

    //Show the dialog
    if ($("#obserText").length>0)
      $("#obserText").remove();     

    var xdialog = $("<div></div>").html("<textarea id=\"obserText\"></textarea>");
    xdialog.dialog(opciones);
  }
}
于 2009-10-15T20:01:19.397 回答
0

我想我明白了，带括号的 id 是个坏主意。我已经正确重命名了 x 和 y ：D

var raw_id, split_id;

    var options = {
        title: 'Add comment',
        modal: true,
        buttons: {
            OK: function() {
                $(this).dialog('close');
                valor = $('#otext' + raw_id).val();
                $('#obser' + raw_id).val(valor);
                //console.log($('#obser' + raw_id).val());
                if (valor)
                {
                    $('a#' + raw_id).find('img').attr('src', base_url + 'assets/img/observacion_on.png');
                }
                else
                {
                    $('a#' + raw_id).find('img').attr('src', base_url + 'assets/img/observacion.png');
                }

            },
            Cancel: function() {
                $(this).dialog('close');
            }
        }
    };    

    $('.addObs').click(function(){

        raw_id = this.id;
        split_id = raw_id.split('_');
        prep_id = '[' + split_id[0] + '][' + split_id[1] + ']';


        if ($('#obser' + raw_id).length > 0)
        {
            //console.log($('#obser' + raw_id).val());
            var dlg = $('<div></div>').html('<textarea id="otext' + raw_id + '">' + $('#obser' + raw_id).val() + '</textarea>');
            dlg.dialog(options);

        }
        else
        {
            $(this).parent().prepend('<input type="hidden" id="obser' + raw_id + '" name="obser' + prep_id +'" />');

            var dlg = $('<div></div>').html('<textarea id="otext' + raw_id + '"></textarea>');
            dlg.dialog(options);
        }
    });

但是现在编辑评论不起作用

于 2009-10-16T12:17:34.150 回答