Ajax toolkit provides modal popup which can be used in insertin and updating options
Here is an example forinserting some fields using a ajax modalpopup.
Write the following code in your .aspx page.
<asp:Button ID="btndummy" runat="server" Style="display: none;" />
<cc1:ModalPopupExtender ID="mpe" EnableViewState="true" runat="server" BackgroundCssClass="modalBackground"
TargetControlID="btndummy" PopupControlID="pnlpopup" CancelControlID="btnfrmInsertCancel">
</cc1:ModalPopupExtender>
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="upInsert">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddlClubNameInsert" EventName="SelectedIndexChanged" />
<asp:PostBackTrigger ControlID="btnInsertPopUp" />
<asp:PostBackTrigger ControlID="btnfrmInsertCancel" />
</Triggers>
<ContentTemplate>
<asp:Panel ID="pnlpopup" runat="server" Style="position: fixed; z-index: 100001;
left: 360px; top: 43.5px; height: 255px; width: 29%;" CssClass="modalPanel">
<div style="background-color: White; border: 1px solid Black; height: 252px; padding: 10px;
text-align: left;">
<table>
<tr>
<td>
FromDate:
</td>
<td>
<asp:TextBox ID="txtFromDate" runat="server" />
<cc1:CalendarExtender ID="calFromDate" runat="server" TargetControlID="txtFromDate"
Format="dd-MMM-yy">
</cc1:CalendarExtender>
</td>
</tr>
<tr>
<td>
ToDate:
</td>
<td>
<asp:TextBox ID="txtToDate" runat="server" />
<cc1:CalendarExtender ID="calToDate" runat="server" TargetControlID="txtToDate" Format="dd-MMM-yy">
</cc1:CalendarExtender>
</td>
</tr>
<tr>
<td>
IsDeleted:
</td>
<td>
<asp:CheckBox ID="chkIsDeleted" runat="server" />
</td>
</tr>
<tr>
<td>
IsActive:
</td>
<td>
<asp:CheckBox ID="chkIsActive" runat="server" />
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnInsertPopUp" runat="server" CausesValidation="True" CommandName="Insert"
Text="Submit" OnClick="btnInsertPopUp_Click" />
</td>
<td>
<asp:Button ID="btnfrmInsertCancel" runat="server" CausesValidation="False" CommandName="Cancel"
Text="Cancel" />
</td>
</tr>
</table>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
When you want to open the above modal popup when you click on a link or a button then on that button click you can write the following code.
protected void btnInsert_Click(object sender, EventArgs e)
{
txtFromDate.Text = "";
txtToDate.Text = "";
chkIsActive.Checked = false;
chkIsDeleted.Checked = false;
upInsert.Update();
mpe.Show();
}
The above code will empty all the fields and will open the modal popup.
After inserting all the fields when you click on insert button then the following code will be used.
protected void btnInsertPopUp_Click(object sender, EventArgs e)
{
ClubYear obj = new ClubYear();
obj.FromDate = Convert.ToDateTime(txtFromDate.Text);
obj.ToDate = Convert.ToDateTime(txtToDate.Text);
obj.IsDeleted = chkIsDeleted.Checked;
obj.IsActive = chkIsActive.Checked;
new ClubYearBO().InsertClubYear(obj);
upGrid.Update();
BindData();
}
Here the inserted items will be taken and can save it in the database.
To learn more such things visit us
http://www.bestdotnettraining.com/Online/Training/ASP-NET/AJAX-NET/61
Vijayar, if this helps please login to Mark As Answer. | Alert Moderator