如何将Textbox和DropDownList放在GridView中进行编辑

时间:2016-10-21 06:52:02

标签: html asp.net gridview drop-down-menu textbox

对不起。我真的很陌生,但我真的很努力。 所以我真的需要帮助,如何将文本框和下拉列表放在gridview中进行编辑。

这是我的GridView代码

au FileType,BufRead c set ft=c.python
au FileType,BufRead python set ft=python.c

我尝试将<div id="id_tm1" runat="server" class="grid" style="border: 1px solid black; overflow: scroll; width: 94%; height: 103px" visible="true"> <asp:GridView ID="gvGroup" runat="server" AllowPaging="true" AllowSorting="True" AutoGenerateColumns="False" BorderColor="Silver" BorderWidth="1px" Height="77px" Width="98%"> <RowStyle Font-Names="Arial" Font-Size="9pt" HorizontalAlign="Center" /> <Columns> <asp:BoundField DataField="JOBTITLE" HeaderStyle-BackColor="#666666" HeaderText="Job Title" ItemStyle-Height="10px" ItemStyle-Width="50px"> <HeaderStyle BackColor="#666666" /> <ItemStyle Width="50px" /> </asp:BoundField> <asp:BoundField DataField="BUSINESS_UNIT" HeaderStyle-BackColor="#666666" HeaderText="Business Unit" ItemStyle-Height="10px" ItemStyle-Width="50px"> <HeaderStyle BackColor="#666666" /> <ItemStyle Width="50px" /> </asp:BoundField> <asp:BoundField DataField="DIVISION" HeaderStyle-BackColor="#666666" HeaderText="Division" ItemStyle-Height="10px" ItemStyle-Width="50px"> <HeaderStyle BackColor="#666666" /> <ItemStyle Width="50px" /> </asp:BoundField> <asp:BoundField DataField="SUB_DIVISION" HeaderStyle-BackColor="#666666" HeaderText="Sub-Division" ItemStyle-Height="10px" ItemStyle-Width="50px"> <HeaderStyle BackColor="#666666" /> <ItemStyle Width="50px" /> </asp:BoundField> <asp:BoundField DataField="CLASSIFICATION" HeaderStyle-BackColor="#666666" HeaderText="Classification" ItemStyle-Height="10px" ItemStyle-Width="50px"> <HeaderStyle BackColor="#666666" /> <ItemStyle Width="50px" /> </asp:BoundField> <asp:BoundField DataField="SUB_CLASSIFICATION" HeaderStyle-BackColor="#666666" HeaderText="Sub-Classification" ItemStyle-Height="10px" ItemStyle-Width="50px"> <HeaderStyle BackColor="#666666" /> <ItemStyle Width="50px" /> </asp:BoundField> </Columns> <PagerStyle Font-Size="9pt" HorizontalAlign="Right" /> <EmptyDataTemplate> <div style="width: 100%; font-size: 10pt; text-align: center; color: Red;"> No record found. </div> </EmptyDataTemplate> <HeaderStyle BackColor="DarkGray" Font-Bold="True" Font-Names="Arial" Font-Size="9pt" ForeColor="White" HorizontalAlign="Center" /> <AlternatingRowStyle BackColor="Gainsboro" /> </asp:GridView> </div> <asp:dropdownlist>放在一起,但我遇到了错误&#34; Type&#39; System.Web.UI.WebControls.BoundField&#39;没有名为&#39; TemplateField&#39;的公共财产。或者&#39; DropDownList&#39;

当我单击gridview项目列表中的“编辑”按钮并能够编辑它时,应显示文本框和下拉列表。 Output 谢谢。

2 个答案:

答案 0 :(得分:0)

<table border="1">

        <tr>
            <td>Job title</td>
            <td>
                Busines Unit
            </td>
            <td> Division </td>
            <td>Sub Division</td>
            <td>Classificcation</td>
                <td>Sub Classification</td>
        </tr>

        <tr>
            <td>Dir marketing</td>
            <td>
                <select><option value="0">Please select</option></select>
            </td>
            <td><select><option value="0">Please select</option></select></td>
            <td><select><option value="0">Please select</option></select></td>
            <td><select><option value="0">Please select</option></select></td>
            <td><select><option value="0">Please select</option></select></td>
            <td> <button>Save</button></td>
        </tr>

    </table>

您可以尝试这样

答案 1 :(得分:0)

使用 twitter-bootstrap 框架可以轻松完成。 看一下 Grid System
确保您的<head></head>中嵌入了类似这样的引导程序:

<head>

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

</head>

然后在你的身体里做这样的事情:

<body>
<div class="row">
    <div class="col-md-2">
        <label class="control-label">Job Title:</label>
        <span>Dir Marketing</span>
    </div>
    <div class="col-md-2">
        <label class="control-label">Business Unit:</label>
        <select>
            <option value="">--Please select--</option>
        </select>
    </div>
    <div class="col-md-2">
        <label class="control-label">Division:</label>
        <select>
            <option value="">--Please select--</option>
        </select>
    </div>
    <div class="col-md-2">
        <label class="control-label">Sub-Division</label>
        <select>
            <option value="">--Please select--</option>
        </select>
    </div>
    <div class="col-md-2">
        <label class="control-label">Classification:</label>
        <select>
            <option value="">--Please select--</option>
        </select>
    </div>
    <div class="col-md-2">
        <label class="control-label">Sub-Classification:</label>
        <select>
            <option value="">--Please select--</option>
        </select>
    </div>
    <button class="btn btn-primary">Save</button>
</div>
</body>

这一切都会给你这样的东西:
Bootstrap Table Grid-System