带中继器的模式弹出窗口 [英] Modal Popup with Repeater

查看:103
本文介绍了带中继器的模式弹出窗口的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Repeater控件,并且在其中使用图像按钮.当我单击按钮时,它会打开一个带有某些文本字段的模式弹出窗口.我想知道如何制作模式弹出窗口来编辑转发器的记录,即当我打开模式弹出窗口时,其中的文本字段显示选定的转发器行的记录.
转发器的代码为:

I am using Repeater control and inside it I am using an image button. When I click on button, it opens a modal popup with some textfields. I want to know how can I make modal popup to edit a record of the repeater, i.e. when I open the modal popup, the text fields in it display the record of selected row of repeater.
The code of repeater is:

<asp:Repeater ID="rptuser" runat="server" DataSourceID="ObjectDataSource1">
  <HeaderTemplate>
    <table>
      <tr>
      <td class="GridHeader"></td>
      <td  class="GridHeader">UserID:</td>
      <td class="GridHeader">FirstName:</td>
      <td class="GridHeader">LastName:</td>
      <td class="GridHeader">Designation:</td>
      <td  class="GridHeader">UserName:</td>
      <td class="GridHeader"></td>
      </tr>
  </HeaderTemplate>
  <ItemTemplate>
    <tr>
      <td class="GridItems"><asp:ImageButton runat="server" ID="delbtn" ImageUrl="~/images/delete.gif" CommandName="del" CommandArgument='<%# Eval("UserId") %>'  ValidationGroup="ab" ToolTip="Delete User"  /></td>
       <td class="GridItems"><%# DataBinder.Eval(Container.DataItem,"UserId") %>'</td>
       <td class="GridItems"><%# DataBinder.Eval(Container.DataItem,"FirstName") %>'></td>
       <td class="GridItems"><%# DataBinder.Eval(Container.DataItem,"LastName") %></td>
       <td class="GridItems"><%# DataBinder.Eval(Container.DataItem,"Designation") %></td>
       <td class="GridItems"><%# DataBinder.Eval(Container.DataItem,"Username") %></td>
       <td class="GridItems"><asp:ImageButton ID="updbtn"  ValidationGroup="Av" runat="server" ImageUrl="~/images/update.jpg"   CommandName="upd" CommandArgument='<%# DataBinder.Eval(Container.DataItem,"UserId") %>' /><ajx:ModalPopupExtender ID="mpe" runat="server"

 TargetControlId="updbtn" PopupControlID="ModalPanel" OkControlID="OKButton" BackgroundCssClass="mdl" /></td>
      </tr>
    </ItemTemplate>
  <FooterTemplate>
    </table>
  </FooterTemplate>
</asp:Repeater>


以及模式弹出窗口中的内容代码:


And code of content inside modal popup:

<asp:Panel ID="ModalPanel" runat="server" Width="500px" CssClass="ModalWindow">
 <table>
 <tr>
 <td>FirstName:</td>
 <td><asp:TextBox ID="txteditfname" runat="server" CssClass="tx_box"></asp:TextBox></td>
 </tr>
 <tr>
 <td>LastName:</td>
 <td><asp:TextBox ID="txteditlname" runat="server" CssClass="tx_box"></asp:TextBox></td>
 </tr>
 <tr>
 <td>Designation:</td>
 <td><asp:TextBox ID="txteditdesig" runat="server" CssClass="tx_box"></asp:TextBox></td>
 </tr>
 <tr>
 <td>UserName:</td>
 <td><asp:TextBox ID="txtedituname" runat="server" CssClass="tx_box"></asp:TextBox></td>
 </tr>
 </table>
 <asp:Button ID="OKButton" runat="server" ValidationGroup="abv" Text="Close" />
</asp:Panel>

推荐答案

一种非常简单的方法:

在按钮上,您可以具有两个属性:

A very simple approach :

On the button you can have two properties :

1. commandArgument //commandArgumsnt=<%#Eval("ID")%>
2. commandName  //commandName="Edit"



现在,在转发器的RowCommand事件中,您可以检查e.CommandName ="Edit"

然后,



Now, at the RowCommand event of the repeater, you can check if e.CommandName="Edit"

then,

Int32 ID=e.CommandArgument.ToInt32();




现在,在打开模型时,您可以通过使用此ID从数据库中获取数据来填充文本框,并对其进行更新.

注意:我编写的所有代码都未经检查,因此可能包含语法错误,因为这是我的头等大事.

希望这能解决您的问题.随时提出任何问题.

Anurag




Now, on opening the model-up, you can fill the textboxes by fetching the data from database using this id, and update it too.

Note: I have written all the code without checking, so I may contain syntactical mistakes as this was top on my head.

Hope this would solve your problem. Feel free to ask for any issue.

Anurag


我认为使用网格会更容易,因此可能会引起人们的兴趣:
I would think that using a grid would be easier, so maybe this will be of interest: http://blog.flexmp.com/2007/12/12/datagrid-popup-as-itemeditor/[^].

Anyway, it shows a way to perform the data editing using a popup.

Regards
Espen Harlinn


这篇关于带中继器的模式弹出窗口的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆