<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function BeginRequestHandler(sender, args) {
var elem = args.get_postBackElement();
ActivateAlertDiv('visible', 'AlertDiv', elem.value + ' processing...');
}
function EndRequestHandler(sender, args) {
ActivateAlertDiv('hidden', 'AlertDiv', '');
}
function ActivateAlertDiv(visstring, elem, msg) {
var adiv = $get(elem);
adiv.style.visibility = visstring;
adiv.innerHTML = msg;
}
</script>
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="Server">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel">
Last update:
<%= DateTime.Now.ToString()%>.
<br />
<asp:CheckBox runat="server" Text="Checkbox1" />
<asp:Button runat="server" ID="Button1" Text="Process 1" OnClick="ProcessClick_Handler" />
<asp:Button runat="server" ID="Button2" Text="Process 2" OnClick="ProcessClick_Handler" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<div id="AlertDiv" class="AlertStyle">
</div>
</div>
</form>
Button1 and Button2 fired the beginRequest event but Checkbox1 didn't.
You need to set the AutoPostback to true in the checkbox:
<asp:CheckBox ID="CheckBox1" runat="server" Text="Checkbox1" AutoPostBack="true"/>
You must to to set AutoPostBack property of CheckBox to True
Add AutoPostBack="true" and add event oncheckedchanged="Checkbox1_CheckedChanged1"
<asp:CheckBox runat="server" Text="Checkbox1" AutoPostBack="true"
oncheckedchanged="Checkbox1_CheckedChanged1"/>
Related
I have simple code that is a dropdown list and Two buttons (named enable and disable)i want to enable and disable the dropdown list by javascript function and after button click
asp.net HTML code:
<asp:DropDownList ID="DropDownList1" runat="server">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
<br />
<asp:DropDownList ID="DropDownList2" runat="server">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
<asp:Button ID="Button1" runat="server" OnClientClick="return enable();" Text="enable" />
<asp:Button ID="Button2" runat="server" OnClientClick="return disable2();" Text="disable" />
javascript function :
function enable() {
document.getElementById("DropDownList1").disabled = false;
document.getElementById("DropDownList2").disabled = false;
return;
}
function disable() {
document.getElementById("DropDownList1").disabled = true;
document.getElementById("DropDownList2").disabled = true;
}
and pageloadlogic:public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
but i tried this many times and not getting the expected output please let me known the solution
<!DOCTYPE html>
<html>
<head>
<script>
function disable() {
document.getElementById("mySelect").disabled=true;
}
function enable() {
document.getElementById("mySelect").disabled=false;
}
</script>
</head>
<body>
<form>
<select id="mySelect">
<option>Apple</option>
<option>Pear</option>
<option>Banana</option>
<option>Orange</option>
</select>
<br><br>
<input type="button" onclick="disable()" value="Disable list">
<input type="button" onclick="enable()" value="Enable list">
</form>
</body>
</html>
you use this code.
Try the below, add return keyword before function call and return false in function to prevent the server postback Which made the dropdown enabled
<head runat="server">
<title></title>
<script type="text/javascript">
function enable() {
document.getElementById("DropDownList1").disabled = false;
document.getElementById("DropDownList2").disabled = false;
return false;
}
function disable() {
document.getElementById("DropDownList1").disabled = true;
document.getElementById("DropDownList2").disabled = true;
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="DropDownList1" runat="server">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
<br />
<asp:DropDownList ID="DropDownList2" runat="server">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
<asp:Button ID="Button1" runat="server" OnClientClick="return enable();" Text="enable" />
<asp:Button ID="Button2" runat="server" OnClientClick="return disable();" Text="disable" />
</div>
</form>
</body>
</html>
The obvious solution is ClientIDMode="Static" and return false; in javascript
<div>
<asp:DropDownList ID="DropDownList1" runat="server" ClientIDMode="Static">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
<br />
<asp:DropDownList ID="DropDownList2" runat="server" ClientIDMode="Static">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
<asp:Button ID="Button1" runat="server" OnClientClick="return enable();" Text="enable" />
<asp:Button ID="Button2" runat="server" OnClientClick="return disable();" Text="disable" />
</div>
<script>
function enable() {
document.getElementById("DropDownList1").disabled = false;
document.getElementById("DropDownList2").disabled = false;
return false;
}
function disable() {
document.getElementById("DropDownList1").disabled = true;
document.getElementById("DropDownList2").disabled = true;
return false;
}
</script>
I have a aspx is like shown below
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />
<asp:UpdatePanel runat="server" ID="panel">
<ContentTemplate>
<asp:Button runat="server" id="bt" text="partial postback" OnClick="E" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:Button ID="Button1" runat="server" text="full postback" OnClick="J" />
<asp:UpdateProgress runat="server" ID="progress" DynamicLayout="true" AssociatedUpdatePanelID="panel">
<ProgressTemplate>
<div class="divWaiting">
<asp:Label ID="lbl" runat="server" Text="OK" />
<asp:Image ID="imgWait" runat="server" ImageAlign="Middle" ImageUrl="images/indicator.gif" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
On Code Behind I have a function to update my label after making the thread sleep for 3 seconds
public void E(Object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label lbl = (Label)progress.FindControl("lbl");
if (lbl.ToString()!= null)
{
lbl.Text = "SomeThing";
}
update = true;
}
I am sorry I am repeating this question. Rather, I am having to repeat it. The last time I posted this, I dint get an answer. I have googled for more than 3 hrs, dint find an answer. Heres the html for the linkbutton and the modal popup. The link button is inside/on a tab panel and auto postback is set to true.
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClick="lnkAddNewAddress_Click">Click Here To Add New Address</asp:LinkButton>
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled" >
</asp:ModalPopupExtender>
I want the clickevent of the linkbutton to fire which is not happening. However clicking on the link does open the modal popup extender (which is also something I want)... How do I get into the click event. I know that a postback is being avoided here because of the modal popup probably...but I dont the solution for it....
The code on save button:
if(hdnfld.Value.ToString()!=null)
{
if(hdnfld.Value.ToString()=="Save")
{
SaveNewAddress();
}
else
{
UpdateAddress();
}
<%# Page StylesheetTheme="" Title="" Language="C#" MasterPageFile="~/Site.Master"
AutoEventWireup="true" CodeBehind="frmMyAccountMyProfile.aspx.cs" Inherits="WebApplication1.frmMyAccountMyProfile" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
function CheckType(type)
{
document.getElementById("hdnfld").value = type;
alert(document.getElementById("hdnfld").value);
return false;
}
</script>
<link href="Styles/myStyleSheet.css" rel="stylesheet" type="text/css" />
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div class="divwrap">
<table style="width: 100%; margin-right: 0px;">
<tr>.........
<td>
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('Save');">Click Here To Add New Address</asp:LinkButton>
<asp:HiddenField ID="hdnfld" runat="server" />
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground" DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled">
</asp:ModalPopupExtender>
...........
<asp:Button ID="btnEdit" runat="server" CssClass="roundcorner btn" OnClick="btnEdit_Click" OnClientClick="return CheckType('Edit');" Text="Edit" />
<asp:Panel ID="pnlMyAddressBook" runat="server" BackColor="White" CssClass="roundcorner">
you can use hidden field instead of viewstate, if you really want to retain some value at code behind. You can access hidden field at client side as well as in code behind too.
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('save');">Click Here To Add New Address</asp:LinkButton>
<asp:HiddenField ID="hdf_type" runat="server" />
Javascript code
function CheckType(type) {
document.getElementById("hdf_type").value = type;
return false;
}
Access value in code behind when clicked on save button, and perform your action save or update according to value in hidden field.
hdf_type.Value.ToString();
MORE HELP FOR YOU
HTML FILE SHOULD LOOK LIKE THIS
below i'm posting the whole code which is working fine for me.
<head runat="server">
<title></title>
<script type="text/javascript">
function CheckType(type) {
document.getElementById("hdf_type").value = type;
alert(document.getElementById("hdf_type").value);
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('save');">Click Here To Add New Address</asp:LinkButton>
<asp:Button ID="btn" runat="server" OnClientClick="return CheckType('edit');" Text="Click Here To Add New Address" />
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled">
</asp:ModalPopupExtender>
<div id="pnlMyAddressBook" style="height: 100px; width: 100px; display: none; background-color: Gray">
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /><br />
</div>
<asp:HiddenField ID="hdf_type" runat="server" />
</div>
</form>
getting value at code behind:
Try this:
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClick="lnkAddNewAddress_Click">Click Here To Add New Address</asp:LinkButton>
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="btnHidden">
</asp:ModalPopupExtender>
<asp:Button ID="btnHidden" runat="server" style="Display:none;" Text="Button"/>
In Code behind:
protected void lnkAddNewAddress_Click(object sender, EventArgs e)
{
lnkAddNewAddress_ModalPopupExtender.Show();
}
I have a button setup to export my gridviews to word. Everything works fine, except I cannot find a way to launch/cancel my modalpopupextender I use to show that processing is happening. If I add it the button click:
btnExportToWord.Attributes.Add("onclick", "StartProgressBarNoValid()") it does not canel the modalpopupextender
Here is the update panel and the javascript function I use.
function StartProgressBarNoValid() {
var myExtender = $find('ProgressBarModalPopupExtender');
ProgressImg = document.getElementById('MyImage');
setTimeout("ProgressImg.src = ProgressImg.src", 10);
myExtender.show();
return true;
}
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div>
<cc1:ModalPopupExtender ID="ProgressBarModalPopupExtender" runat="server"
backgroundCssClass="ModalBackground" behaviorID="ProgressBarModalPopupExtender"
TargetControlID="hiddenField1" PopupControlID="Panel1" />
<asp:Panel ID="Panel1" runat="server" Style="display: none; background-color: #C0C0C0;">
<img id="MyImage" src="../Images/Vista_Searching_Bar.gif" alt="" />
<div id="processMessage" style="width:200px;" ><br /><br /> Loading...<br /><br />
</div>
</asp:Panel>
<asp:HiddenField ID="HiddenField1" runat="server" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
what is wrong with ProgressBarModalPopupExtender.Show() and ProgressBarModalPopupExtender.Hide() from the codebehind?
I use a timer and updatepanel to show clock in my page (Just an example).
Using this codes in my aspx:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script type="text/javascript">
</script>
<script runat="server">
protected void btnClick(object sender, EventArgs e)
{
for (int i = 0; i < 100000000; i++)
{
txt.Text = "Denis Storti";
}
}
protected void TimerTick(object sender, EventArgs e)
{
DropDownList1.Focus();
ScriptManager1.SetFocus(DropDownList1);
for (int i = 0; i < 100000000; i++)
{
txt.Text = "Timer Tick";
//upnBusca.Update();
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<script type="text/javascript">
function Cancel() {
Sys.WebForms.PageRequestManager.getInstance().abortPostBack();
}
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
var postBackElement;
function InitializeRequest(sender, args) {
postBackElement = args.get_postBackElement();
if (postBackElement.id == 'Timer1') {
$get('UpdateProgress1').style.display = "block";
}
}
function EndRequest(sender, args) {
if (postBackElement.id == 'Timer1') {
$get('UpdateProgress1').style.display = "none";
}
}
</script>
<div style="padding-left: 20%; padding-top: 10%">
<p>
<asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="TimerTick">
</asp:Timer>
<asp:UpdatePanel ID="upnBusca" UpdateMode="Conditional" ChildrenAsTriggers="false"
runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnBusca" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:TextBox ID="txt" runat="server">
</asp:TextBox>
<asp:Button ID="btnBusca" runat="server" OnClick="btnClick" Text="Busca Nome" />
<%=DateTime.Now.ToString() %>
<asp:UpdatePanel ID="upnDate" UpdateMode="Conditional" ChildrenAsTriggers="false"
runat="server">
<ContentTemplate>
<%=DateTime.Now.ToString() %>
<br />
<asp:DropDownList ID="DropDownList1" runat="server"
Width="110px">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
<asp:ListItem>6</asp:ListItem>
<asp:ListItem></asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
<asp:AsyncPostBackTrigger ControlID="DropDownList1" />
</Triggers>
</asp:UpdatePanel>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress DisplayAfter="0" ID="UpdateProgress1" runat="server" DynamicLayout="False">
<ProgressTemplate>
<span style="font-size: large">Processing...</span>
<asp:LinkButton ID="LinkButton1" runat="server" OnClientClick="Cancel(); return false;"
Text="Cancel" />
</ProgressTemplate>
</asp:UpdateProgress>
</p>
</div>
</form>
</body>
</html>
I choose a dropdownlist this ajax code cause the dropdownlist unfocused and close.
how can I maintain focus on this dropdownlist.
any help would be appreciated. Thanks