How can I handle novalidate on client side, with having access to behind code
<form runat="server">
<form novalidate>
<label>Old Password</label>
<input type="password" class="form-control" required placeholder="Old Password" data-validation-required-message="This old password field is required">
</div>
<asp:Button ID="btnSave1" runat="server" Text="Save 1" OnClick="btnSave1Click" />
</form>
<form novalidate>
<label>name</label>
<input type="text" class="form-control" required placeholder="Name" data-validation-required-message="Name is required">
</div>
<asp:Button ID="btnSave2" runat="server" Text="Save 2" OnClick="btnSave2Click" />
</form>
</form>
For now button click doesn't work. I try to provide some change on buttons, so:
<asp:Button ID="btnSave1" style="display:none" runat="server" Text="Save 1" OnClick="btnSave1Click" />
<input type='button' class="button" value='ثبت تغییرات' style="cursor: pointer; width: 150px" onclick='save1();'/>
<script>
function save1() {
document.getElementById("btnSave1").click();
}
</script>
On this case only "PostBack" works and "btnSave1Click" event doesn't work.
Related
Here my page :
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<%# Register Assembly="Microsoft.ReportViewer.WebForms" Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>
<asp:HiddenField ID="hdnfromDate" Value="" runat="server" />
<asp:HiddenField ID="hdntoDate" Value="" runat="server" />
<div id="myModal1" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Issue Invoice</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<form id="reused_form" runat="server">
<p>
Send invoice to...
</p>
<div class="form-group">
<label for="name">
To:</label>
<input type="text" class="form-control"
id="name" name="name" readonly maxlength="50" runat="server">
</div>
<div class="form-group">
<label for="email">
CC:</label>
<input type="email" ID="cc" class="form-control" runat="server" multiple>
</div>
<div class="form-group">
<strong><i>Note:</i><small> <i>The invoice can not be edited after issuing.</i></small></strong>
</div>
<asp:LinkButton CssClass="btn btn-warning m-btn btn-block btn-lg m-btn--custom m-btn--icon m-btn--air " OnClick="Onbtn3_Click" Text="Issue Invoice " ID="LinkButton3" runat="server"></asp:LinkButton>
</form>
<div id="success_message" style="width: 100%; height: 100%; display: none;">
<h3>Sent your message successfully!</h3>
</div>
<div id="error_message"
style="width: 100%; height: 100%; display: none;">
<h3>Error</h3>
Sorry there was an error sending your form.
</div>
</div>
</div>
</div>
</div>
In cs File i am trying to access email value using cc.Value as for email textbox id is cc. But it always gets empty string. In my default master page i have a form tag which runs at server so if i keep this modal in a form runat server then gives me error saying page can have only one form tag. Please can anyone help me out. Thanks in advance
This may help
There is Text property available, so you can use textBox.Text to get textbox contian. In your case cc.Text.
Try textBox.text(). Should work.
As Html 5 type=“email” control is not available using runat attribute, you can access TextBox like below:
<asp:TextBox ID="txtBoxCc" runat="server" TextMode="Email"></asp:TextBox>
Now in codebehind you can access it like txtBoxCc.Text
Also, you have to put it like below:
if(!Page.IsPostBack) {
string cc = txtBoxCc.Text;
}
I am trying to create a Login Page.Whenever, I click on login button username textbox's text becomes empty.
I have tried :
Using Updatepanel didnt work
OnClientClick- it doesnt fires OnClick event
I tried getting value by string usrnm=Page.Request.Form["username"].ToString(); but it gave null value
I tried putting AutoPostBack="true" on textbox
Heres by markUp:
<label for="username">Username</label>
<%--<input type="text" name="Uname" id="username"/>--%>
<asp:TextBox ID="txtusrnm" runat="server" AutoPostBack="true"/>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" name="Pname" id="password">
</div>
<div class="form-group">Forgot password?</div>
<hr class="hr-sm hr-stroke" />
<div class="form-group">
<%--<input id="btnlogin" type="button" class="btn btn-primary btn-wide" value="Login" runat="server" onserverclick="btnlogin_ServerClick" >--%>
<asp:Button ID="btnLogin" runat="server" Text="Login" class="btn btn-primary btn-wide" OnClick="btnLogin_Click" UseSubmitBehavior="false" EnableViewState="true" />
I am able to resolve my issue , i was having AutoPostBack='true' in textbox so just removed and also replace UseSubmitBehavior="false" EnableViewState="true" with CausesValidation="False" , works fine now.
Textbox:
<asp:TextBox ID="txtusrnm" runat="server"/>
and button :
<asp:Button ID="btnLogin" runat="server" Text="Login" class="btn btn-primary btn-wide" OnClick="btnLogin_Click" CausesValidation="False"/>
Thanks
Before adding the ScriptManager when I was clicking on the login button it was showing the required field warning without page postback but after that it has started to do postback first and then validate fields.
It's required to add a ScriptManager when there is an UpdatePanel on the page.
How can I fix this so it doesn't postback on RequiredFieldValidator?
Login Page
<form id="signinform" runat="server" defaultfocus="username" defaultbutton="LogInBtn">
<asp:scriptmanager id="FormScriptManager" runat="server"></asp:scriptmanager>
<div class="form-signup">
<div class="form-group form-group-info">
<div class="append-icon m-b-30">
<asp:textbox id="username" runat="server" cssclass="form-control c-white form-control-success" placeholder="Username" />
<i class="mdi-action-perm-identity c-light"></i>
<asp:requiredfieldvalidator runat="server" id="UserNameValidator" controltovalidate="username" display="Dynamic" validationgroup="LoginVAL" setfocusonerror="true" cssclass=" f-11 c-red m-b-0" errormessage="The username is required." />
</div>
</div>
<div class="form-group form-group-info">
<div class="append-icon m-b-30">
<asp:textbox id="Password" textmode="Password" runat="server" cssclass="form-control c-white form-control-success" placeholder="Password" />
<i class=" mdi-action-lock-outline c-light"></i>
<asp:requiredfieldvalidator runat="server" id="PasswordValidator" controltovalidate="Password" display="Dynamic" setfocusonerror="true" validationgroup="LoginVAL" cssclass="f-11 c-red m-b-0" errormessage="The password is required." />
</div>
</div>
<div class="togglebutton togglebutton-info">
<label class="c-light normal f-11 m-b-15">
<input type="checkbox" runat="server" name="RememberMe" id="RememberMe" class="md-checkbox">
Remember me?
</label>
</div>
</div>
<asp:placeholder runat="server" id="ErrorMessage" visible="false" viewstatemode="Disabled">
<p id="ErrorMessageContainer" runat="server" class="badge badge-danger m-b-5 f-11">
<asp:Literal runat="server" ID="FailureText" ViewStateMode="Disabled" />
</p>
</asp:placeholder>
<div class="progress-demo">
<asp:linkbutton id="LogInBtn" runat="server" onclick="LogIn" text="Login" cssclass="btn btn-material-indigo btn-block btn-embossed ladda-button" validationgroup="LoginVAL" data-style="zoom-in"></asp:linkbutton>
</div>
<p>
<%-- Enable this once you have account confirmation enabled for password reset functionality--%>
<asp:hyperlink runat="server" id="ForgotPasswordHyperLink" viewstatemode="Disabled">Forgot your password?</asp:hyperlink>
</p>
<div class="modal fade" id="LoginModal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<div id="LoginModalHeader" runat="server" class="modal-header bg-aero">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icons-office-52"></i></button>
<h4 class="modal-title c-white">
<asp:label id="LoginModalTitle" runat="server" />
</h4>
</div>
<asp:updatepanel id="LoginModalUpdatePanel" runat="server">
<ContentTemplate>
<div class="modal-body m-t-10">
<p class=" c-gray w-300 f-13"><asp:Label ID="LoginModalDetails" runat="server" /></p>
</div>
<div class="modal-footer">
<asp:LinkButton runat="server" ID="ResendConfirm" OnClick="SendEmailConfirmationToken" Text="Resend Confirmation" Visible="false" CssClass="btn btn-material-blue-grey btn-embossed" />
<button id="LoginModalCancel" runat="server" type="button" class="btn btn-default btn-embossed" data-dismiss="modal">Cancel</button>
</div>
</ContentTemplate>
</asp:updatepanel>
</div>
</div>
</div>
</form>
I appreciate your efforts in reaching a solution for my problem.
I came across the same issue a while back and was able to resolve it via Page.Validate();.
Basically, before I added ScriptManager everything was working well. When I would click the update button, the field validators would run and prevent a post back until requirements were met. After adding ScriptManager tag, the page would post back rendering my validators pretty much useless.
What I did was add on my update (submit) button click event:
page.validate();
if (Page.IsValid)
{
// Your update or submit code here.
}
This seems to work fine!
Write like this..
<asp:updatepanel id="LoginModalUpdatePanel" runat="server">
<ContentTemplate>
//paste all codes inside here
</ContentTemplate>
</asp:updatepanel>
I have a few dynamic html items which are populated by jquery and/or JS, but for some reason the C# will only see the original values from when the page loaded.
<form class="form-horizontal">
<div class="form-group">
<label class="col-sm-3">Date</label>
<div class="col-sm-9">
<asp:ToolkitScriptManager ID="tsm" runat="server" />
<asp:TextBox CssClass="btn btn-default pull-right" ID="calBtn" runat="server" Style="width: 150px">Click Here</asp:TextBox>
<asp:CalendarExtender ID="calExt" TargetControlID="calBtn" runat="server" />
</div>
</div>
<div class="form-group">
<label class="col-sm-5">
Start (Actual Begin Time)</label>
<div class="col-sm-7">
<%--<input runat="server" id="startTime" class="time btn btn-default pull-right" type="text" autocomplete="off" style="width: 150px" />--%>
<asp:TextBox runat="server" ID="startTime" CssClass="time btn btn-default pull-right" AutoCompleteType="Disabled" Style="width: 150px"></asp:TextBox>
</div>
</div>
<div class="form-group">
<label class="col-sm-4">End</label>
<div class="col-sm-8">
<%--<input runat="server" id="endTime" class="time btn btn-default pull-right disabled" type="text" autocomplete="off" style="width: 150px" />--%>
<asp:TextBox runat="server" ID="endTime" CssClass="time btn btn-default pull-right" AutoCompleteType="Disabled" Style="width: 150px"></asp:TextBox>
</div>
</div>
</form>
Above the asp:TextBox items I have commented out my original "input" elements since I was trying both methods. If I call string date = calBtn.Text in the C#, it says "Click here" as the returned value. I have also tried date = calExt.SelectedDate which returns empty.
In the text box I have tried .Text and .SelectedValue but still empty.
#DrewKennedy had the right idea. I was nesting all these <form> tags for the Bootstrap which caused it to not be seen server-side. I had wrongly assumed I needed the nested forms to make the CSS work.
I already had a <form runat="server"> surrounding the whole body, but changing the inner <form class="form-horizontal"> to <div class="form-horizontal"> fixed the problem.
ASP.NET only support ONE SINGLE . So you had to add runat=server on your form makup.
Now it is working for me.
is there any reason that my final step i call confirmation isn't showing in the formwizard?
<form id="wizardForm" action="" method="post">
<div id="fieldWrapper">
<div class="step" id="first">
<span class="font_normal_07em_black step_title">Site Information</span><br />
<label for="Title">Title</label>
<input id="Title" class="input_field_12em required" type="text" />
<label for="Description">Description</label>
<input id="Description" class="input_field_12em required" type="text" />
<label for="UrlName">Url Name</label>
</div>
<div class="step" id="ownerInfo">
<span class="font_normal_07em_black step_title">Site Owner</span>
<label for="PrimaryOwner">Primary Owner</label>
<input id="PrimaryOwner" class="input_field_12em required" type="text" />
<label for="SecondaryOwner">Secondary Owner (nt id)</label>
<input id="SecondaryOwner" class="input_field_12em required" type="text" />
</div>
<div class="step" id="siteAccess">
<span class="font_normal_07em_black step_title">Site Access</span>
<label for="I">Public or private info <br />
Will private information be stored in this space?</label>
<input id="iYes" name="I" type="radio" value="Yes" />Yes<br />
<input id="iNo" name="I" type="radio" value="No" />No
<hr />
<label for="T">Will T Information be stored on this space?</label>
<input id="TYes" name="T" type="radio" value="Yes" onclick="ToggleT()" />Yes<br />
<input id="TNo" name="T" type="radio" value="No" onclick="ToggleT()" />No
<div id="tAcknowledgeContainer" class="hidden_contain">
<input type="checkbox" id="tCheckbox" /><span class="checkbox_label">I acknowledge </span>
</div>
<hr />
<label for="C">Will space need to Control content?</label>
<input id="cYes" name="C" type="radio" value="Yes" onclick="ToggleC()" />Yes<br />
<input id="cNo" name="C" type="radio" value="No" onclick="ToggleC()" />No
<div id="cAcknowledgeContainer" class="hidden_contain">
<input type="checkbox" id="cCheckbox" />
<span class="checkbox_label">I agree </span>
</div>
<hr />
<label for="F">Is Other User Access Required?</label>
<input id="FYes" name="F" type="radio" value="Yes" onclick="ToggleF()" />Yes<br />
<input id="FNo" name="F" type="radio" value="No" onclick="ToggleF()" />No
<div id="fPleaseNoteContainer" class="hidden_contain">
<span class="please_note"><strong>Please Note</strong><br />
</span>
</div>
<hr />
<label for="N">Non Employee(s)?</label>
<input id="NYes" name="N" type="radio" value="Yes" onclick="ToggleN()" />Yes<br />
<input id="NNo" name="N" type="radio" value="No" onclick="ToggleN()" />No
<div id="nAcknowledgeContainer" class="hidden_contain">
<input type="checkbox" id="nCheckbox" />
<span class="checkbox_label">
I agree
</span>
</div>
</div>
<div class="step" id="siteSharing">
<span class="font_normal_07em_black step_title">Site Sharing</span>
<div class="side_by_side_container">
<div class="left_container">
<input id="SharingRestrictionN2S" name="SharingRestriction" type="radio" value="N2S" />
<span class="generic_label">Public</span><br />
</div>
<div class="right_container">
<input id="SharingRestrictionN2K" name="SharingRestriction" type="radio" value="N2K" />
<span class="generic_label">Private</span><br />
</div>
</div>
</div>
<div class="step" id="agreement">
<span class="font_normal_07em_black step_title">Agreements</span>
<div>
<br />
<div>Business Agreement</div>
<iframe id="bFrame" class="generic_iframe" src="<%= ConfigurationManager.AppSettings["businessUrl"] %>"></iframe>
<br /><br />
<hr />
<br />
<div>Service Agreement</div>
<iframe id="sFrame" class="generic_iframe" src="<%= ConfigurationManager.AppSettings["sericeUrl"] %>"></iframe>
<br /><br />
<hr />
<br />
I agree
</div>
<br />
<input id="sbAggrement" class="required" type="checkbox" />
<span class="checkbox_label">
i agree
</span>
</div>
<div id="final" class="step submit_step">
<span class="font_normal_07em_black step_title">Confirmation</span>
<input type="text" name="temp1" />
</div>
</div>
<br />
<hr class="form_divider" />
<div id="wizardNavigation">
<input class="navigation_button" value="Back" type="reset" />
<input class="navigation_button" value="Next" type="submit" />
</div>
</form>
seems like it submits on the prior step and doesn't even hit this step. i thought you had to include the class step and submit_step because when i remove "step" it doesn't add this as another wizard step. if displays it on the bottom of every step.
also on the final submit, has anyone done anything where they call ajax to perform the submit so that if an error occurs the user doesn't leave the page and still has all their data to attempt again?
i am using c#, mvc2 and testing with Firefox browser
add onsubmit="return false;" to the form to make it so u can manipulate the post data
and in the jquery:
$("form").submit(function(){
$.post('postFile....',$(this).serialize(),function(data){
console.log(data);
//do something with data
})
})
When the Wizard button caption is next it will fire the
$("#form1").bind("step_shown", function (event, data) {
if (data.currentStep == "Div0") {
//Code that needs to be implemented in the step 0
}
if (data.currentStep == "Div1") {
//Code that needs to be implemented in the step 1
}
});
But when the Wizard button caption is Submit the final step in Wizard will be fired in the method mentioned bellow
$("#form1").formwizard({
formPluginEnabled: true,
validationEnabled: true,
focusFirstInput: true,
formOptions: {
success: function (data) {
//Last step completed message
},
beforeSubmit: function (data) {
//Code that need to be implemented for the submit method
},
dataType: 'json',
resetForm: true
}});
Please let me know has this resolved your issue.
:) Coding :)
i found an issue. it seems that the required class on the checkbox before the final confirmation step was throwing a javascript error.
<input id="sbAggrement" class="required" type="checkbox" />
i removed the required class and the final step is displayed when the next button is clicked. Now onto the next problem, why is the required class on the checkbox throwing a javascript error.......
instead of having the required class on the input, I added the checkbox to the validationOptions and it works perfectly now