I have asp page with update progress control. I want to rebind grid view every 5 sec. so i am using timer control. but my problem is update progress bar showing every timer click event. how to resolve this.Please help me.
<asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="0" AssociatedUpdatePanelID="UpdatePanel">
<ProgressTemplate>
<asp:Panel ID="Panel1" CssClass="overlay" runat="server">
<asp:Panel ID="Panel2" CssClass="loader" runat="server">
<img src="../../images/bx_loader.gif" alt="" />
</asp:Panel>
</asp:Panel>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger EventName="SelectedIndexChanged ControlID="gvMessages" />
</Triggers>
<ContentTemplate>
<asp:Timer ID="timer1" runat="server" Interval="1000" OnTick="Timer1_Tick" ></asp:Timer>
<asp:GridView ID="gvMessages" Width="100%" CssClass="mail-block" runat="server">
</asp:GridView>
<asp:TextBox ID="txtWorkFlow" runat="server" > </asp:TextBox>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
Related
I want to validate only part of the page in the same form.
However it validates whole pages textboxes like below. Here is the details;
Code behind is;
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
.
.
.
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnLogin" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
// the section that i want to validate only below textbox using reset button however above one is validating too
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:TextBox ID="tbMailForgot" minlength="1" required="" runat="server" TextMode="Email" ValidateRequestMode="Enabled" ></asp:TextBox>
<asp:Button ID="btnReset" OnClientClick="return funcmail();" runat="server" Text="Reset" OnClick="btnReset_Click" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnReset" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</form>
How can i do it partly ?
You can use Validation groups. You have to set each validator to a validation group and then set the same validation group to the submit button. For instance:
<asp:TextBox ID="tbMailForgot" minlength="1" required="" runat="server" TextMode="Email" ValidateRequestMode="Enabled"></asp:TextBox>
<asp:requiredfieldvalidator id="RequiredFieldValidator2"
controltovalidate="tbMailForgot"
validationgroup="Forgot"
errormessage="Email required"
runat="Server">
</asp:requiredfieldvalidator>
<asp:Button ID="btnReset" OnClientClick="return funcmail();" runat="server" Text="Reset" OnClick="btnReset_Click" ValidationGroup="Forgot" />
I am handling a div click event with jquery- on div click, call asp.net button by ID.
$('#myDiv').on('click', (function(clickEvent) {
document.getElementById("Button1").click();
}))
Here is the ASP button markup:
<asp:Button ID="Button1" runat="server" OnClick="my_ClickEvent" Text="Button" CssClass="hide" />
Here is the code behind:
protected void my_ClickEvent(object sender, EventArgs e)
{
SqlDataSource1.UpdateParameters["OwnerName"].DefaultValue = "Some Name";
SqlDataSource1.Update();
Response.Redirect(Request.Url.AbsoluteUri);
}
Here is the div markup:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />
<asp:Timer ID="Timer1" runat="server" Interval="200000" OnTick="Timer1_Tick" Enabled="True" />
<div class="square" id="myDiv" runat="server">
<div class="content">
<div>
<p id="ImUnavailable">Unavailable for Dispatch</p>
<div class="table">
<div class="table-cell">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" DataSourceID="SqlDataSource1" CssClass="Grid" RowStyle-HorizontalAlign="Center" DataKeyNames="PhysicalAddress">
<Fields>
<asp:BoundField DataField="OwnerName" HeaderText="OwnerName" ShowHeader="False" SortExpression="OwnerName">
<ControlStyle BorderStyle="None" />
<ItemStyle BorderStyle="None" />
</asp:BoundField>
<asp:BoundField DataField="Building" HeaderText="Building" ShowHeader="False" SortExpression="Building" ItemStyle-CssClass="building">
<ControlStyle BorderStyle="None" />
<ItemStyle BorderStyle="None" />
</asp:BoundField>
<asp:BoundField DataField="TimeOn" HeaderText="TimeOn" ShowHeader="False" SortExpression="TimeOn">
<ControlStyle BorderStyle="None" />
<ItemStyle BorderStyle="None" />
</asp:BoundField>
<asp:BoundField DataField="IPAddress" HeaderText="IPAddress" ShowHeader="False" SortExpression="IPAddress" ItemStyle-CssClass="hide">
<ControlStyle BorderStyle="None" />
<ItemStyle BorderStyle="None" />
</asp:BoundField>
<asp:BoundField DataField="PhysicalAddress" HeaderText="PhysicalAddress" ShowHeader="False" ReadOnly="True" SortExpression="PhysicalAddress" ItemStyle-CssClass="hide">
<ItemStyle CssClass="hide" />
</asp:BoundField>
<asp:BoundField DataField="Available" HeaderText="Available" ShowHeader="False" SortExpression="Available" ItemStyle-CssClass="hide">
<ItemStyle CssClass="hide" />
</asp:BoundField>
</Fields>
<RowStyle HorizontalAlign="Center" />
</asp:DetailsView>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</div>
</div>
</div>
As you can see I have the DetailsView wrapped in an updatepanel, which updates on a Timer interval trigger. When the timer reaches it's interval, the updatepanelwill post back to the database and the DetailsView is kept up to date. This happens in the ajaxupdatepanel, so the page itself is not refreshed.
I am unsure how to achieve this with my div click. I am trying to click the div, call the ASP button, update the SqlDataSource, all without refreshing the entire page. The div click event works now, but it is not using ajax. I am becoming a bit confused when researching solutions for this like I am missing something simple.
Any advice appreciated. Thank you!
EDIT
So, I created a separate UpdatePanel and structured it like so... it still refreshes the whole page when I click Button1...
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"/>
<asp:UpdatePanel ID="UpdatePanel7" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ...
</asp:SqlDataSource>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="my_Click" />
<asp:Button ID="Button2" runat="server" Text="Button" OnClick="you_Click" />
</ContentTemplate>
</asp:UpdatePanel>
All I am trying to do is update a column in a SQL table when I click Button1. It works, but refreshes the page.
Thanks again
I looked at my event output posted above and answered my own question.
I changed my code-behind to:
protected void my_Click(object sender, EventArgs e) {SqlDataSource1.UpdateParameters["OwnerName"].DefaultValue = "My Name";SqlDataSource1.Update();}
...and of course I am no longer called the Response.Redirect. It is working as expected now.
Thank you!
I have update progress in master page which shows the loader whenever the content page is refreshed or on postback but on my content page everything is working fine execpt for the download button where the loader does not get disabled when clicked.
this is the master page:
<div class="container-fluid" id="body">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:ContentPlaceHolder ID="BodyContentPlaceHolder" runat="server">
</asp:ContentPlaceHolder>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="menuBar" />
<asp:AsyncPostBackTrigger ControlID="MenuCategories" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="progress" runat="server" DynamicLayout="true" DisplayAfter="0">
<ProgressTemplate>
<div class="ui-widget-overlay">
<div id="dvLoading">
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</div>
<script type="text/javascript">
var updateProgress = null;
function postbackButtonClick() {
updateProgress = $find("<%= progress.ClientID %>");
window.setTimeout("updateProgress.set_visible(true)", updateProgress.get_displayAfter());
return true;
}
</script>
this is my content page:
<asp:Content ID="Content2" ContentPlaceHolderID="BodyContentPlaceHolder" runat="Server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<table style="float: right;">
<tr>
<td class="Asplabel"><b>No of Records:</b></td>
<td>
<asp:Label ID="lblRecordsCount" runat="server" Text="" CssClass="Asplabel" Font-Bold="true"></asp:Label>
</td>
<td>
<asp:LinkButton ID="BtnDownload" ClientIDMode="Static" OnClientClick="return postbackButtonClick();" runat="server" Enabled="true" ToolTip="Download Files" CssClass="btn" style="color: #0089d0;" OnClick="BtnDownload_Click">
<i class="fa fa-download"></i>
</asp:LinkButton>
</td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="BtnDownload"/>
</Triggers>
</asp:UpdatePanel>
</asp:Content>
On page load loader is working fine and also for other controls where postback occurs except for the download button the loader shows up but does not fade away
How should i set the visibilty false for the download button after the pasotback occurs?
For postbacktrigger controls, update progress can be shown like
Show:
var updateprogress = document.getElementById('<%=((UpdateProgress)Master.FindControl("UpdateProgress1")).ClientID %>');
updateprogress.style.display = "inline-block";
Hide:
var updateprogress = document.getElementById('<%=((UpdateProgress)Master.FindControl("UpdateProgress1")).ClientID %>');
updateprogress.style.display = "none";
I am trying to use jquery for exporting grid view to excel. But I am not successful with the code.
code referred from : http://www.c-sharpcorner.com/blogs/export-to-excel-using-jquery1
My code:
<script type="text/javascript">
$("[id$=btnExcel]").click(function (e) {
alert("testing");
window.open('data:application/vnd.ms- excel,' + encodeURIComponent($('#grdCharges').html()));
e.preventDefault();
});
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div id="div_report" runat="server" visible="false">
<div id="grdCharges" runat="server" style="width: 90%; overflow: auto;">
<asp:GridView ID="GridView1"
runat="server"
CellPadding="3"
CellSpacing="2"
AutoGenerateColumns="true"
ShowFooter="true"
FooterStyle-HorizontalAlign="Left"
RowStyle-BorderColor="Black" HeaderStyle-BackColor="#0CA3D2">
<FooterStyle BackColor="#87CEFA" />
</asp:GridView>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<div class="div_labels">
<asp:Button ID="btnExcel" class="input-submit" ClientIDMode="Static" runat="server" Text="Excel" />
</div>
But when I press the btnExcel I could not get even the alert window. Why is it so?
I have an ajax modal popupextender which I would like to show using java script at the end of some processing in the code behind. I get the message
Error: Unable to get property 'show' of undefined or null reference.
<asp:Panel ID="panel1" runat="server" Visible="true" BorderColor="Black" Style="display: none">
<asp:UpdatePanel ID="uppanel1" runat="server">
<ContentTemplate>
<asp:Button ID="btn1" Text="Popup" Visible="true" runat="server" Style="display:none"/>
<ajaxToolKit:ModalPopupExtender ID="mpe1" runat="server" TargetControlID="btn1" PopupControlID="panel1" RepositionMode="None" PopupDragHandleControlID="drag1" BehaviorID="behave1"/>
<div id="div1" runat="server">
<asp:TextBox ID="txt1" runat="server" Text="Text" ></asp:TextBox>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
function ShowPopUp(mpid) {
var id1 = $find(mpid);
id1.show();
}
Try this
$find("<%= mpe1.ClientID %>").show();