单击一个大表中的一个单元格,并将该单元格的内容插入表单域

问题描述:

我有一个包含多个用户可填写字段的表单。用户需要在包含大量数据表的弹出窗口中选择的那些字段中输入一个数字。单击一个大表中的一个单元格,并将该单元格的内容插入表单域

例如,一个字段可能会显示“税率”。用户将(最好)点击(空)“税率”输入字段,这会产生大量的数据表。用户可以(最好)单击该表中的一个值,然后关闭该表并使用该值填充输入字段。

我希望(reaaallllyy希望)是我不必为表中的每个单元格创建某种特殊的ID为了将数字传递回表单字段,因为表是巨大的,我希望以普通的旧格式<tr><td>1.234</td></tr>创建它们。

我嗅到jQuery,但我并不熟悉如何实现它。任何帮助将不胜感激。

下面是使用jQueryUI的对话框一个非常基本的演示,可能让你开始:

HTML:

Rate:<input type="text" id="rate_input" /> 
<div id="dialog" title="Click a value to fill input and close dialog"> 
    <table id="rates" border="1" width="100%"> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
      <td>Value 3</td> 
     </tr> 
    </table> 
</div> 

的jQuery:

$(function(){  
    $('#dialog').dialog({ 
     autoOpen: false, 
     width: 400 
    }); 

    $('#rate_input').click(function() { 
     $('#dialog').dialog('open'); 
    }); 

    $('#rates td').click(function() { 
     $('#rate_input').val($(this).text()); 
     $('#dialog').dialog('close'); 
    }); 
}); 

DEMO:http://jsfiddle.net/5jMqJ/

+0

哇。这是杀手。谢谢!我希望我能给你买一杯啤酒。 – user1596165 2013-02-12 01:44:07