form validates whole page in ASP.NET - javascript

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" />

Related

Close Modal Pop up after submit message in server side

I have a bootstrap modal pop up. Inside that there are many controls and submit button. So after successfully submitting I want to close that pop up. Below is the code which shows the message as Record Saved successfully.
if (strMessage == "Success" && strSaveSubmit == "Draft")
{
ClientScript.RegisterStartupScript(Page.GetType(), "erroralert", "alert('Record Saved as Draft Successfully');", true);
}
But with this, I want to close the modal popup which I am unable to. here is that div
<div class="modals">
<form id="frmFileUpload" runat="server">
<div class="col-sm-6">
<asp:HiddenField ID="hdnFileInfo" runat="server" />
<asp:HiddenField ID="hdnClose" runat="server" />
<label>Sap ID</label>
<asp:Label ID="lblSapId" Text="" runat="server" />
</div>
<div class="col-sm-6">
<label>Candidate ID</label>
<asp:Label ID="lblCandidateId" Text="" runat="server" />
</div>
<div class="col-sm-6">
<label>Technical Feasible</label>
<div class="selectWraper">
<asp:DropDownList ID="ddlTechFeasible" runat="server">
<asp:ListItem Text="Select" Value="Select" />
<asp:ListItem Text="YES" Value="YES" />
<asp:ListItem Text="NO" Value="NO" />
</asp:DropDownList>
</div>
</div>
<div class="col-sm-6">
<div class="upload">
<label>Upload Document</label>
<asp:HiddenField ID="hdnGetFileName" runat="server" />
<div id="dvFileUpload">
<asp:FileUpload runat="server" ID="flufileUpload" AllowMultiple="true" CssClass="chooseFile" />
</div>
</div>
</div>
<div class="col-sm-6">
<label>Remarks</label>
<asp:TextBox ID="txtRemarks" runat="server" TextMode="MultiLine" />
</div>
<div class="col-sm-6" style="overflow: auto; height: 100px;">
<asp:GridView ID="grdFilesInfo" runat="server" AutoGenerateColumns="false" EmptyDataText="No files uploaded">
<Columns>
<asp:BoundField DataField="Text" HeaderText="Uploaded Files" />
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="lnkDownload" ToolTip="download files" CssClass="fa fa-download" CommandArgument='<%# Eval("Value") %>' runat="server" OnClick="lnkDownload_Click"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="lnkDelete" ToolTip="delete files" CssClass="fa fa-trash-o" CommandArgument='<%# Eval("Value") %>' runat="server" OnClientClick="if (!confirm('Are you sure you want delete the file?')) return false;" OnClick="lnkDelete_Click" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div class="clearfix"></div>
<div class="modalButton">
<asp:Button ID="btnSaveDraft" runat="server" Text="Save as Draft" OnClick="btnSaveDraft_Click" CssClass="button" OnClientClick="return SaveOrDraft('Draft');" />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" data-dismiss="modal" OnClick="btnSubmit_Click" CssClass="button" OnClientClick="return SaveOrDraft('Draft');" />
</div>
</form>
</div>
JQuery and Ajax are your friend here.
You could just add this inside a document.ready...
$(document).ready(function() {
$('#<%= btnSubmit.ClientID %>').on('click', function () {
$('.modals').hide(); // hides anything with 'modals' as the class
}
}
You could also just give the modal an ID and use $('#ModalID').hide();
You could assign a static id to the submit button, but the <%= btnSubmit.ClientID %> will pull out the ID for you.
Is this an ajax operation? From the code you have there it looks like it would perform a postback and reload the page anyway.
if (strMessage == "Success" && strSaveSubmit == "Draft")
{
ClientScript.RegisterStartupScript(Page.GetType(), "erroralert", "alert('Record Saved as Draft Successfully');", true);
ScriptManager.RegisterStartupScript(this, this.GetType(), "Popup", "closePopUP();", true);
}
function closePopUP(){
$(".modals").modal('hide');
}

ASP SqlDataSource UPDATE - AJAX for partial page post back?

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!

How to stop update progress bar for every timer click event

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>

ModalPopupExtender show method does not work from code-behind javascript

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();

jQuery UI dialog won't let me do AutoPostback

When I click on a RadioButton I need to do a postback so that It can run my RadioButton code.(AutoPostback="true"). I have my Radio button in a jQuery UI dialog and when I click on the button nothing happens and I get an error :
Uncaught Sys.WebForms.PageRequestManagerServerErrorException: Sys.WebForms.PageRequestManagerServerErrorException: An unknown error occurred while processing the request on the server. The status code returned from the server was: 404
I read somewehre that the dialog actually places itself outside the form?
I added this to my Javascript function to prevent it:
function getFiles(canDo) {
//create Popup with content from div
$('#file').dialog({//file is the div where my controls are
autoOpen: true,
height: 'auto',
width: 'auto',
modal: true,
buttons: {
"Ok": function () {
debugger;
},
Cancel: function () {
$(this).dialog('close');
}
}
});
$('#file').appendTo($("form:first"));
}
Any ideas on why It won't successfully do a postback? or why I get that error?
My CONTROLS:
<ajaxToolkit:ToolkitScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
<ContentTemplate>
<div id="casefiles">
<%--<div id="rbfileByHolder" runat="server">--%>
<label>
Sort By</label>
<span>
<asp:RadioButton class="aspRBs" GroupName="rbfileByNameOrID" ID="rbMyFiles" Text="My Files"
Checked="true" runat="server" AutoPostBack="True" OnCheckedChanged="rbMyFiles_CheckedChanged" /></span>
<span>
<asp:RadioButton class="aspRBs" GroupName="rbfileByNameOrID" ID="rbByFileID" Text="By File ID"
runat="server" AutoPostBack="True" OnCheckedChanged="rbByFileID_CheckedChanged" /></span>
<span>
<asp:RadioButton class="aspRBs" GroupName="rbfileByNameOrID" ID="rbByFileName" Text="By File Name"
runat="server" AutoPostBack="True" OnCheckedChanged="rbByFileName_CheckedChanged" /></span>
<%-- </div>--%>
<br />
<label>
Select New CaseFile</label>
<asp:DropDownList runat="server" ID="ddlCaseFiles" DataSourceID="dsMyCaseFiles" DataTextField="Display"
DataValueField="FileID" OnPreRender="ddl_PreRender" Width="524px"
/>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="ddlCaseFiles"
ToolTip="Casefile Required" InitialValue="-1" Text="*" Display="Dynamic" />
<ajaxToolkit:ListSearchExtender ID="ddlExtCaseFiles" runat="server" PromptCssClass="ListSearchExtenderPrompt"
TargetControlID="ddlCaseFiles" BehaviorID="ddlExtCaseFiles" Enabled="True" />
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="rbByFileName" EventName="CheckedChanged" />
<asp:AsyncPostBackTrigger ControlID="rbByFileID" EventName="CheckedChanged" />
<asp:AsyncPostBackTrigger ControlID="rbMyFiles" EventName="CheckedChanged" />
</Triggers>
</asp:UpdatePanel>
<%--<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
</ContentTemplate>
</asp:UpdatePanel>--%>
<asp:SqlDataSource ID="dsCaseFiles" runat="server" ConnectionString="<%$ ConnectionStrings:OSCIDConnectionString %>" ProviderName="System.Data.SqlClient" SelectCommand="p_CaseFiles_ListActiveCaseFiles" SelectCommandType="StoredProcedure">
<SelectParameters>
<asp:SessionParameter Name="InvestigatorID" SessionField="InvestigatorID" />
</SelectParameters>
</asp:SqlDataSource>
<asp:SqlDataSource ID="dsCaseFilesReverse" runat="server" ConnectionString="<%$ ConnectionStrings:OSCIDConnectionString %>" ProviderName="System.Data.SqlClient" SelectCommand="p_CaseFiles_ListActiveCaseFilesReverse" SelectCommandType="StoredProcedure">
<SelectParameters>
<asp:SessionParameter Name="InvestigatorID" SessionField="InvestigatorID" />
</SelectParameters>
</asp:SqlDataSource>
<asp:SqlDataSource ID="dsMyCaseFiles" runat="server" ConnectionString="<%$ ConnectionStrings:OSCIDConnectionString %>" ProviderName="System.Data.SqlClient" SelectCommand="p_CaseFiles_ListActiveCaseFilesAssignedTo" SelectCommandType="StoredProcedure">
<SelectParameters>
<asp:SessionParameter Name="InvestigatorID" SessionField="InvestigatorID" />
<asp:SessionParameter Name="AssignedTo" SessionField="InvestigatorID" />
</SelectParameters>
</asp:SqlDataSource>
</form>

Categories

Resources