Javascript for a popup. Asp.net for Visual Studio 2005 - c#

What JavaScript has to be written for a popup when a link is clicked? Correct me if there is anything else to be done.
Link is written like this.
<div style="float:left; padding-left:9px;">
<asp:LinkButton ID="lnkActiveInactive" runat="server" OnClick="lnkActiveInactive_Click"
CssClass="linkclass" Font-Underline="True">Cancel My Account</asp:LinkButton>
</div>
And popup extender is like this.
<cc1:ConfirmButtonExtender DisplayModalPopupID="ModalPopupExtender2" ID="ConfirmButtonExtender2"
runat="server" TargetControlID="lnkActiveInactive">
</cc1:ConfirmButtonExtender>
<cc1:ModalPopupExtender ID="ModalPopupExtender2" OkControlID="btnYesCancel" CancelControlID="btnNoCancel"
BackgroundCssClass="modalBackground" PopupControlID="pnlCancelPopup" TargetControlID="lnkActiveInactive"
runat="server">
</cc1:ModalPopupExtender>
<asp:Panel CssClass="modalPopup" ID="pnlCancelPopup" runat="server">
<!-- Common Popup Control Begin -->
<table class="tblCommonPopup" width="690px" cellpadding="0" cellspacing="0">
<tr>
<td class="topLeft">
</td>
<td class="topMiddle">
</td>
<td class="topRight">
</td>
</tr>
<tr>
<td colspan="3" class="middle" align="center">
<!-- Content Area Begin -->
<table>
<tr>
<td>
</td>
<td colspan="2" style="padding-top: 10px;">
<table width="100%">
<tr>
<td align="center">
Feel free to change your package to Basic, there is no charge for this Package.<br /><br />If you still wish to cancel,
your account will become inactive within DealTown and any further billing will <br />discontinue.
We will keep you account in our system for some time if you wish to active it again.<br /><br />Are you sure you
wish to cancel your account?
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" colspan="4">
<input id="btnYesCancel" type="button" value="YES" class="popupButton" />
<input id="btnNoCancel" type="button" value="NO" class="popupButton" />
</td>
</tr>
</table>
<!-- Content Area Ends -->
</td>
</tr>
<tr>
<td class="bottomLeft">
</td>
<td class="bottomMiddle">
</td>
<td class="bottomRight">
</td>
</tr>
</table>
<!-- Common Popup Control End -->
</asp:Panel>

Im not sure if I understood your question clearly, but this is how to pop up in JS
<script type="text/javascript">
<!--
function Confirmation() {
var answer = confirm("Are you sure you want to Cancel your Account?")
if (answer){
alert("Goodbye!")
}
else{
alert("Thanks for not Cancelling")
}
}
//-->
</script>
<div style="float:left; padding-left:9px;">
<asp:LinkButton ID="lnkActiveInactive" onclick="Confirmation();">Cancel My Account</asp:LinkButton>
</div>
This code is used is you run on the client side. If you want it to run on server side you have to do it on the codebehind like such
if (!IsPostBack) {
this.lnkActiveInactive.Attributes.Add("onclick", "javascript:Confirmation()");
}

If you just want a confirmation dialog for the 'cancel my account' you can simply place some javascript in your aspx page.
Something like:
onclick="javascript:confirm()"
Hope this helps!

I think the other responders have missed that you are using the ASP.NET Ajax Toolkit ModalPopupExtender.
The answer to your question is, no, no Javascript is required. Setting the TargetControlID of the ModalPopupExtender to your LinkButton should be sufficient to get the pop-up to appear. If that's not happening, something else is wrong.
One thing I notice is that you have an OnClick handler on the LinkButton. This shouldn't be necessary if the only function of the link button is to pop up the dialog.

Related

ASP.NET Web Form wants to display file directory

I'm currently attempting to modify this tutorial's code such that I can create an ASP.NET web form which will allow users to view information on and download my selected portfolio works. However, when the page loads, it gets treated as though I want to browse through the part of the server which hosts the files (~/SelectedWorks) and, since my Web.config isn't configured to allow directory browsing at that location - or any location - I get an error.
Below is the ASP.NET code behind the page. The C# code behind the page is, aside from differently-named classes, identical to that of the tutorial's. I've also been using exclusively Visual Studio 2013 Ultimate (and thus its bundled version of IIS Express) to test the page. If someone could help me figure out what's going on, I'd greatly appreciate it!
<%# Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="SelectedWorks.aspx.cs" Inherits="ConflictingGenius_ASP.SelectedWorks" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<section>
<div>
<hgroup>
<h2><%: Page.Title %></h2>
</hgroup>
<asp:ListView ID="productList" runat="server"
DataKeyNames="WorkID" GroupItemCount="4"
ItemType="ConflictingGenius_ASP.Models.SelectedWork" SelectMethod="GetProducts">
<EmptyDataTemplate>
<table >
<tr>
<td>No data was returned.</td>
</tr>
</table>
</EmptyDataTemplate>
<EmptyItemTemplate>
<td/>
</EmptyItemTemplate>
<GroupTemplate>
<tr id="itemPlaceholderContainer" runat="server">
<td id="itemPlaceholder" runat="server"></td>
</tr>
</GroupTemplate>
<ItemTemplate>
<td runat="server">
<table>
<tr>
<td>
<a href="WorkDetails.aspx?WorkID=<%#:Item.WorkID%>">
<img src="<%#:Item.ImagePath%>"
width="100" height="75" style="border: solid" /></a>
</td>
</tr>
<tr>
<td>
<a href="WorkDetails.aspx?WorkID=<%#:Item.WorkID%>">
<span>
<%#:Item.Title%>
</span>
</a>
<br />
<%-- <span>
Download
</span>--%>
<br />
</td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</p>
</td>
</ItemTemplate>
<LayoutTemplate>
<table style="width:100%;">
<tbody>
<tr>
<td>
<table id="groupPlaceholderContainer" runat="server" style="width:100%">
<tr id="groupPlaceholder"></tr>
</table>
</td>
</tr>
<tr>
<td></td>
</tr>
<tr></tr>
</tbody>
</table>
</LayoutTemplate>
</asp:ListView>
</div>
</section>
</asp:Content>
Add this code to your .cs file.
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
string[] filePaths = Directory.GetFiles(Server.MapPath("~/Uploads/"));
List<ListItem> files = new List<ListItem>();
foreach (string filePath in filePaths)
{
files.Add(new ListItem(Path.GetFileName(filePath), filePath));
}
productList.DataSource = files;
}
}
Add this code in your ListView in .aspx file
<ItemTemplete>
<asp:LinkButton runat="server" PostBackUrl='<%#Eval("Value") %>' ><%#Eval("Text") %></asp:LinkButton>
</ItemTemplate>

when I click on the submit button of contact us form . it automatically goes to top of the page . but i want to reload specific part of page

I am developing single page website using asp.net , at bottom of my page I have created contact us form. problem is that when I click on the submit button of contact us form . it automatically goes to top of the page html code is here `
<form id="form1" runat="server">
<div>
<h2>Contact Us</h2>
<br />
<table>
<!-- Name -->
<tr>
<td align="center">
Name:</td>
<td>
<asp:TextBox ID="txtName"
runat="server" BackColor="Transparent"
Columns="50"></asp:TextBox>
</td>
</tr>
<!-- Subject -->
<tr>
<td align="center">
Subject:
</td>
<td>
<asp:TextBox ID="ddlSubject" runat="server"></asp:TextBox>
</td>
</tr>
<!-- Message -->
<tr>
<td align="center">
Message:
</td>
<td>
<asp:TextBox ID="txtMessage"
runat="server"
Columns="40"
Rows="6"
TextMode="MultiLine"></asp:TextBox>
</td>
</tr>
<!-- Submit -->
<tr align="center">
<td colspan="2">
<a href="#btnSubmit">
<asp:Button ID="btnSubmit" runat="server" Text="Submit"
onclick="btnSubmit_Click" /></a>
</td>
</tr>
<!-- Results -->
<tr align="center">
<td colspan="2">
<asp:Label ID="lblResult" runat="server"></asp:Label>
</td>
</tr>
</table>
</div>
</form>`
Use UpdatePanel or if you really want to do a SPA please consider using AJAX for the development of the site and just write the webservices.
Set this in your Page_Load function:
Page.MaintainScrollPositionOnPostBack = true;
If you wish to return to the same scroll location on the page after the button is clicked.
You need to add MaintainScrollPositionOnPostback="true" to the "<%# Page" tag, you can also set it in code-behind or web.config:
http://blogs.msdn.com/b/webdevelopertips/archive/2009/06/08/tip-75-did-you-know-how-to-maintain-scrollposition-after-post-back.aspx

html input of type File wrapped inside ASP: Panel is not disabled when panel is disabled

I have wrapped HTML Input control of type File inside ASP:Panel control(which is wrapped inside update panel).
When I disable ASP:Panel control, input control is still enable. Please helpme out
ASPX Code :
<asp:Panel ID="pnlBrowseCSV" runat="server" Enabled="true">
<table>
<tr>
<td align="left" valign="top" style="height: 30px; width: 160px;">
<strong>CSV File:</strong>
</td>
<td style="height: 30px">
<input type="file" id="csvFile" runat="server"
onkeydown="return false" style="width: 350px; background-color:white"/>
<strong>(*.csv)</strong>
</td>
<td style="height: 30px">
<ASP:Button ID="btnValidate" Text="Validate" runat="server"
OnClick="btnValidate_Click" />
</td>
</tr>
</table>
</asp:Panel>
Using visible attribute instead of Enabled.
<asp:Panel ID="pnlBrowseCSV" runat="server" Visible="False">
This issue is by design. What you can do rather is write one extra line of code to disable File upload where you disable the panel.
pnlBrowseCSV.Enabled = false;
csvFile.Enabled=false;

How to get Dynamic Span id in jquery?

Iam using jquery in asp.net
I have one user control in which i have div and in div table and in table tr and in tr td and in td i have lables.
ASCX :
<div ID="Container" runat="server" class="dvContainer">
<table ID="Table" class = "Tablecs">
<thead><tr>
<td colspan="2">
<asp:Label ID="lbl1" Text="Swiss" runat="server" /></td>
</tr>
</thead>
<tr>
<td>ABC</td>
<td>DEF</td>
</tr>
<tr>
<td><asp:Label ID="lblPA" Text="SUN 12/21 05:04" runat="server" /></td>
<td ><asp:Label ID="lblPD" Text="SUN 12/21 19:00" runat="server" /></td>
</tr>
<tr>
<td><asp:Label ID="lblAA" Text="SUN 12/21 05:04" runat="server" /></td>
<td ><asp:Label ID="lblAD" Text="SUN 12/21 19:00" runat="server" /></td>
</tr>
</table>
i want to bind data dynamically to these user control. i.e., binding data to lables in user contol.
my Jquery
$div.find(".Table").text(oPorts[iCount].Name); // my result is an array of oPorts and i have filed as Name
But this is not working fine.
when i checked into code dynamically its generating SPAN for each and every lable
How to find that SPAN id dynamiccaly in a loop and bind data to lables??
Any help is appreciated. Thanks in Advance.
suppose you have a usercontrol with a markup like given below
<%# Control Language="C#" AutoEventWireup="true"
CodeBehind="WebUserControl1.ascx.cs" Inherits="DOTNET_FORMS.WebUserControl1" %>
<div id="Container" runat="server" class="dvContainer">
<table id="Table" class="Tablecs">
<tr>
<td>
<asp:Label ID="lblPA" Text="SUN 12/21 05:04" runat="server" />
</td>
<td>
<asp:Label ID="lblPD" Text="SUN 12/21 19:00" runat="server" />
</td>
</tr>
</table>
</div>
and you have registered this usercontrol on your .aspx page like this:
<%# Register TagPrefix="UC" TagName="Test" Src="~/WebUserControl1.ascx" %>
and used it like this:
<UC:Test ID="uc1" runat="server" />
then, when you run your page, your elements get rendered something like
<div id="uc1_Container" class="dvContainer">
<table id="Table" class="Tablecs">
<tr>
<td>
<span id="uc1_lblPA">SUN 12/21 05:04</span>
</td>
<td>
<span id="uc1_lblPD">SUN 12/21 19:00</span>
</td>
</tr>
<tr>
<td>
<span id="uc1_lblAA">SUN 12/21 05:04</span>
</td>
<td>
<span id="uc1_lblAD">SUN 12/21 19:00</span>
</td>
</tr>
</table>
</div>
see how ids of your labels and other elements (elements with runat="server" attribute ) got changed i.e.
lblPA > uc1_lblPA
lblPD > uc1_lblPD
Container > uc1_Container
so, you have to look out for these changes, because only then you can grab these elements using jQuery, cause jQuery is a client side language, it executes, after the server side code (runat="server") has executed.
However, if you do not want to look out for modified id, you can do following
remove runat="server" attribute, and make sure your ids are unique, all of them
let the runat="server" attribute be their, place an attribute clientidmode="static" on all of your server side controls. and Ids wont change.
use ClientId i.e. in your jQuery selector, grab an element like this: $('#"+'<%= lblPA.ClientID %>');
now, since your IDs are unique, you don't need to find, directly grab the elements like this:
$('#lblPA').text();
or if you want to loop through all the tds of your table with class Tablecs, do this:
$('.Tablecs tr td').each(function(index, item){
alert($(item).text());
});

Yes No Cancel (3 buttons) for AJAX Modalpopupextender

Does Ajax ModalPopupExtender has an option to create 3 buttons? Yes, No and Cancel? for ASP.NET WebForms, C#
I could not come up with a solution. I can just find OKControlID and CancelControlID.
<table id="pnlPopupMerchantUpdate" runat="server" style="display:none">
<tr>
<td>
<asp:Panel runat="server" CssClass="modalPopup">
<table width="350" height="80" class="warningPopup">
<tr>
<td>
<!-- <img src="images/warning_blue.gif" alt="Warning" /> -->
</td>
<td colspan="2" align="left" style="padding-left: 75px; padding-top: 10px;">
Do you wish to update the Location Information as well.
</td>
</tr>
<tr>
<td align="center" colspan="4">
<input id="btnYesMerchant" type="button" value="Yes" class="popupButton" causesvalidation="true" onclick="btnYessave_Click"/>
<input id="btnNoMerchant" type="button" value="No" class="popupButton" causesvalidation="true" onclick="btnNosave_Click" />
<input id="btnCancel" type="button" value="Cancel" class="popupButton"/>
</tr>
</table>
</asp:Panel>
</td>
</tr>
Here, I do want to call different functions for Yes and No.
Instead of OKontrolID, you can use extender's client side API to hide it on button's on-click event. See this article that shows multiple cancel button - your scenario is similar, you just need to return true from your button's onclick event handler.
<ajaxToolkit:ModalPopupExtender runat="server" BehaviorID="myPopup" ...
and
<input id="btnYesMerchant" type="button" onclick="$find('myPopup').hide(); return true;" ...
Thought i found it to be so tough, it is simple to handle this problem. We just got to add return true for each asp button.
ANd remove the OKCOntrolID from ModalPopupExtender. It solved my problem. Thanks all who gave it a try reading.

Categories

Resources