多jQuery的用户界面的对话框工作

我有一个表像这样大量的文本输入： alt text http://img380.imageshack.us/img380/6697/snapsh.png 多jQuery的用户界面的对话框工作

（他们的测试标记几个学生）。

每个字段都有添加评论相关的图标，所以点击图标时，必须用一个文本显示一个对话框，然后将其值保存到一个隐藏的输入。

标记字段的示例：

<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以将注释保存到其隐藏的输入中。

在此先感谢和抱歉，对于这些修改，我的英语

来源

2009-10-15 rafabayona

测试：

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-15 20:01:19

感谢您的想法，所需的变量是全球性的。但是$（“＃obser_” + id）的部分不工作，但是工作的document.getElementById OK ......似乎jQuery的不喜欢的用方括号 – rafabayona 2009-10-16 09:55:17

好ID，因为括号内是HTTP的一部分：// docs.jquery.com/Selectors，现在我改变它，看看它的工作原理 – 2009-10-16 12:17:50

遗憾，但我写的例子，不使用支架，所以我使用变量“ID”，让jQuery将发现它好。后来我看到它textarea的创建。 – 2009-10-16 12:27:23

我想我已经知道了，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-16 12:17:34 rafabayona

多jQuery的用户界面的对话框工作

回答

相关问题