I have a user control which acts as a form for updating student records. This user control is used in a page called students update. After the update is sucessfull, I want to disable the update button. After that, if the user changes any text, the update button should be enabled back. I am trying this but it is not working. I have all my textboxes autopost property to true. I am able to disable, but I am not able to enable it again if user starts entering new text in the text box. I am using the textbox.textchanged event to achieve this.
A Jquery approach :
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" Enabled="false" />
</div>
</form>
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
$("#<%= TextBox1.ClientID %>").keyup(function () {
$("#<%= Button1.ClientID %>").attr("disabled", $(this).val() == "");
});
</script>
</body>
Or you can do this server-side :
<asp:textbox id="TextBox1" runat="server" autopostback="True" ontextchanged="TextBox1_TextChanged"></asp:textbox>
<asp:button id="Button1" runat="server" enabled="False" text="Button" />
protected void TextBox1_TextChanged(object sender, EventArgs e)
{
Button1.Enabled = !String.IsNullOrEmpty(TextBox1.Text);
}
#Hoangnnm solution looks OK. Just include the later jQuery Lib, e.g. version 1.9.0 instead of 1.4.1 which is quite obsolete:
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
Related
I am trying to get html textbox value when click on html button without using "runat" attribute.I need to do it in code behind ,is it possible?
<button id="button1" onclick="btnclick">Click Here</button><input type="text" id="txtBox1" name="txtBox12" />
and My code Behind is like:
protected void btnclick(object sender, EventArgs e)
{
string name = Request.Form["txtBox12"];
Response.Write(name);
}
MODIFIED
To access any control in code behind it needs to have runat=server attribute attached to it.
In your case, like you pointed you can transfer the value of input text to asp hidden field and then access
its value on button click in server-side but in this case too you have to place hidden field inside form runat=server tag.
<form id="form1" runat="server">
<input type="text" id="txt" onkeyup="PassValue(this);";/>
<asp:HiddenField ID="hf" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Go" onclick="Button1_Click" />
</form>
-----------------------
<script type="text/javascript">
function PassValue(obj) {
document.getElementById("hf").value = obj.value;
}
</script>
I am using Visual Studio 2015 to create a ASP.NET web site. I have a DIV that is hidden by default and I am trying to display it if the user checks a check box. I am wondering if there is a way using C# to immediately display the DIV as soon as the user checks the box. I can't seem to find a way to recognize the change in state without the form being first submitted. I can easily achieve this using JavaScript however this is for a uni assignment and requires functionality to be implemented in C#.
This is the HTML for the checkBox:
<form id="form1" runat="server">
Limit Stations To My Location<asp:CheckBox ID="limitOptions" runat="server" onClick="toggleOptions()" />
<br /><br />
<div id="locationOptions" runat="server" hidden="hidden">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
<asp:Button ID="updateList" runat="server" Text="Button" OnClick="updateList_Click"/>
</div>
Any help would be greatly appreciated.
You can do this with C# in code behind. Add a OnCheckedChanged event to the CheckBox and set the AutoPostBack to true and handle the change. Note that a Panel becomes a div in HTML.
<asp:CheckBox ID="limitOptions" runat="server" OnCheckedChanged="limitOptions_CheckedChanged" AutoPostBack="true" />
<asp:Panel ID="locationOptions" runat="server" Visible="false">
Radius (KM) <asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</asp:Panel>
However this causes a PostBack, so just using JavaScript could be a better option.
<asp:CheckBox ID="limitOptions" runat="server" onclick="toggleOptions()" />
<div id="locationOptions" runat="server" style="display: none">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</div>
<script type="text/javascript">
function toggleOptions() {
var id = '#<% =locationOptions.ClientID %>';
if ($(id).css('display') == 'none') {
$(id).slideDown('fast', function () { });
} else {
$(id).slideUp('fast', function () { });
}
}
</script>
am trying to show a loading div on button click, but it is not working at the moment.
Javascript :
<script type="text/javascript">
$(document).ready(function (e) {
$('#BtnSend').click(function () {
$('#<%= loading.ClientID %>').toggle("slow");
});
});
</script>
Div:
<div id="loading" class="Loading" runat="server" visible="false">
<div class="loadingImg">
<img src="../Images/loading.gif" alt="loading" />
</div>
</div>
Button:
<asp:Button ID="BtnSend" runat="server" Text="SEND"
onclick="BtnSend_Click" CssClass="pressbutton2" Height="36px" ClientIDMode="Static" />
the div is set to runat server so that I can change its visibility also through code.
Use the onClientClick for the asp button. Then make the jquery function that you ahve called BtnSend_Click
If you want to do it via Client side:
jQuery
function BtnSend_Click () {
$('#<%= loading.ClientID %>').toggle("slow");
}
ASP Button
<asp:Button ID="BtnSend" runat="server" Text="SEND"
onClientClick="BtnSend_Click" CssClass="pressbutton2" Height="36px" ClientIDMode="Static" />
If you want to do it via the server:
C#
protected void BtnSend_Click(object sender, EventArgs e){
loading.Visibility = 'visible' //not sure on syntax to show it in code behind off the top my head
}
ASP Button
<asp:Button ID="BtnSend" runat="server" Text="SEND"
onClick="BtnSend_Click" CssClass="pressbutton2" Height="36px" ClientIDMode="Static" />
The ASP.Net AJAX library has an UpdateProgress control that sounds like it would fit your needs.
I've tried adding in a prevent default, as the code as described below would postback before the loading div was shown otherwise.
<script type="text/javascript">
$(document).ready(function (e) {
$('#<%= BtnSend.ClientID %>').click(function (e) {
e.preventDefault();
$('#<%= loading.ClientID %>').toggle("slow");
});
});
</script>
Another thing I've noticed is you have set Visible="false":
<div id="loading" class="Loading" runat="server" visible="false">
This means the div doesn't exist as its not output from the server side. Look in the view source when the page loads, it wont be there and hidden, its just not there. Remove the visible="false" and use CSS to hide it to start off with.
I use a button click with the asp.net validation group and client side validation (javascript). It give the first preference to javascript validation if it returns true means it directly go to the serverside button click event not check the asp.net validations.
<asp:ImageButton ID="img_btn_register" runat="server"
ImageUrl="~/images/Register1.png"
**OnClientClick="return validat_form()"** OnClick="img_btn_register_Click1"
**ValidationGroup="qa"** />
Based on your question I understand that- You need your field validations should occur first and then script should execute.
You can call Page_ClientValidate() in your client script to explicitly execute all validations and if it successful then only Client Script should be executed.
Here is a small demo on the same:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" language="javascript">
function ClientScript() {
if (Page_ClientValidate("qa"))**// first check the validators in ValidationGroup "qa"**
{
alert("Save all Modification?");
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ValidationGroup="qa" runat="server" ControlToValidate="TextBox1"
Text="*" ErrorMessage="Value in Textbox1 is required!">
</asp:RequiredFieldValidator>
<asp:Button ID="Button1" runat="server" ValidationGroup="qa" Text="Test Validation" OnClientClick="ClientScript()" />
</div>
</form>
</body>
</html>
I have a simple JQuery enabled ASP.NET page:
<script>
$(document).ready(function() {
$("#accordion").accordion();
});
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div id="accordion">
<h3><a id="Accordion1" href="#">Accordion Panel 1</a></h3>
<div>
A form input...
<asp:Button id="btnSubmit" runat="server" onclick="btnSubmit_Click" />
</div>
<h3><a id="Accordion2" href="#">Accordion Panel 2</a></h3>
<div>
Some content...
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
If you'll notice, I'm using an UpdatePanel also.
btnSubmit_Click event does something like this:
protected void btnSubmit_Click(object sender, EventArgs e)
{
//Some MySql INSERT, etc.
}
Now what I want to do is for server-side btnSubmit_Click to trigger JQuery to "click" Accordion Panel 2 (so it will open Accordion Panel 2 and close 1). How to do this?
UPDATE: Sorry guys I forgot to mention earlier that It's got an UpdatePanel
Oh well, I just used the "change the value of a hiddenfield after postback then let jquery read that hiddenfield" approach. Thanks guys!
Jquery:
var tag = $("#contentBody_hfTag1").val();
if (tag=="1") { $(".Accordion").accordion({ active: 1 }); }
else { $(".Accordion").accordion({ active: 0 }); }
.aspx
<asp:HiddenField ID="hfTag1" ClientIDMode="Predictable" Value="0" runat="server" />
C#
protected void btnMyButton_Click(object sender, EventArgs e)
{
hfTag1.Value = "1";
}
You can't. Jquery runs on the client, your handler is on the server. You will need to trigger the event on the client when the page reloads after the post back.
You can't do that as Jquery works on client side, from a server side event, as the page reloads. And the state of the accordion will be lost. So what you can do is, instead of making a post back, you can do the same work in a Jquery AJAX call on the button click to do whatever you want and then close the accordion 1 and show accordion 2.
<asp:UpdatePanel ID="up1" runat="server">
<ContentTemplate>
<i88:InlineScript runat="server">
<script type="text/javascript">
$('Accordion2').click()
</script>
</i88:InlineScript>
<asp:Button ID="cmd" runat="server" Text="Update" />
</ContentTemplate>
</asp:UpdatePanel>
You can put inlineScript which will get Executed every time you update the Panel.
You can also use jQuery.Trigger(); for other event's.