如何製作表格可填充？

Question

我試圖做一個良好的用戶界面，通過使表格單元格更新，只需雙擊單元格，使單擊的單元格輸入類型的值=現有的單元格值。

到目前爲止，我已經設法通過在表格單元內集成輸入類型來實現這一點。

<td class=""><input type="text" ng-model=""></td> 

我在想，如果我在正確的軌道上，因爲我的目標是用最好良好UX良好的UI了。我正在使用Laravel和AngularJS。

如果我是如何使輸入框邊框填充整個單元格？

Answer 1

CSS的一些明智的應用程序可以得到你想要的佈局：

td { 
 
    background-color:#f0f; /* highlight problems */ 
 
    padding:0; 
 
} 
 
input { 
 
    display:block; 
 
    width:100%; 
 
}

<table style="width:100%"> 
 
<tr> 
 
    <td class=""><input type="text" ng-model=""></td> 
 
</tr> 
 
</table>

至於是否走在正確的軌道上，這是由你來決定。如前所述，已經有很多框架已經這樣做了。如果你正在努力學習如何做這種事情，請繼續前進。否則，請使用existing framework。