I'm trying to change the cursor to an hourglass in my asp.net application.
Add this javascript
funcion hourglass() {
document.body.style.cursor = "wait";
}
Then in my code in the page load event:
button.Attributes.Add("onclick","hourglass()")
when I click the button, the cursor changes but the system freezes and does not reload the page!
Any tips?
You need to use OnClientClick
button.OnClientClick = "hourglass(); return true;";
Reference: https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.onclientclick(v=vs.110).aspx
Use button like this
<asp:Button ID="btn" ClientIDMode="Static" runat="server" Text="Button Text" OnClick="btnRefresh_Click" CssClass="btn" OnClientClick="hourglass(); return true;"/>
While going to server side it will change your cursor and code behind function will execute
Related
I am trying to hide my content by clicking the button. But when the page is loading, content is hiding but after finishing page load content is showed. This content doesn't hide. I am using Visual Studio 2017 community and asp.net/vb.net framework. But the same JQuery code is working on my text editor and my browser.
Here is my sample code:
<p id="justp" class="testcls">Hi Hide me!</p>
<asp:Button ID="testbtn" runat="server" Text="hide me" />
<script>
$(function () {
$('#testbtn').click(function () {
$('.testcls').hide();
});
});
</script>
I am try to passing alert inside hide() and it is run successfully :
$('.testcls').hide(alert("Hello"));
What is the problem?
How can I solve this?
In case your are just using this button to hide/show your content on the client side (no server side calculation or something like that) use a normal input / button tag:
Replace this:
<asp:Button ID="testbtn" runat="server" Text="hide me" />
With this line:
<button type="button" id="testbtn">Hide me!</button>
As mentioned above this solution will only work if you don't need to submit any data.
What is the problem?
The button submits your form after the click so the page will be refreshed and the view will return to the default status.
How can I solve this?
You've several ways to change this behavior :
if you have got a control on the asp code you could remove the runat="server" to prevent the button from submitting :
<asp:Button ID="testbtn" Text="hide me" />
You could simply add the return false; statement at the end of the event.
Another way is preventing the default behavior using preventDefault() like :
$('#testbtn').click(function (e) {
e.preventDefault();
$('.testcls').hide();
});
The one that I recommend to you is using UseSubmitBehavior:
<asp:Button ID="testbtn" runat="server" UseSubmitBehavior="false" Text="hide me" />
Last choice is using the plain HTML code like :
<button type="button" id="testbtn">Hide me!</button>
I am new to C#. I have a save button inside InsertItemTemplate. I have used the following code to disable the button after first click in java script but its not even working for the first click please help me.
<asp:ImageButton ID="imgbtnSave" runat="server" CommandName="Add" CausesValidation="true" OnClientClick="this.disabled='true';return true;" />
You are modifying the "disabled" property of the DOM object on the browser, but the button will do a post back to the server when it's clicked, so any change to the DOM will be lost.
On the function where you handle the command "Add" in your server code you must retrieve the button from the InsertItemTemplate and set its "Enabled" property to false, that will disable the control from the server side.
If you want to avoid multiple clicks while the page has not been reloaded then you need a client function to avoid this, something like this:
<asp:ImageButton ID="imgbtnSave" runat="server" CommandName="Add" CausesValidation="true" OnClientClick="return checkEnabled(this);" />
<!-- somewhere in your page -->
<script>
function checkEnabled(item)
{
if(item.disabled != 'true')
{
item.disabled = 'true';
return true;
}
return false;
}
</script>
I want to disable link button after user click on it.
But I made something wrong here.
Button is still enabled after click. What am I doing wrong?
<asp:LinkButton ID="submit" runat="server"
CssClass="button"
Text="OK"
OnClick="Submit_Click"
OnClientClick="this.disabled=true">
</asp:LinkButton>
Just give return false; to your JavaScript. The reason is that your asp:LinkButton is getting rendered like this.
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$submit','')"
class="button"
id="ContentPlaceHolder1_submit"
onclick="this.disabled = true;return false;">
OK</a>
So, if you do not give return false, these things happens
It fires the onclick event and disables the anchor tag. (anchor tag does not have a disabled property. button and input type="submit" has that property.)
It moves on to fire the postback and hits the server side click event
As there is a postback, the client side JavaScript disabling wont persist (even if it were a button)
By enforcing return false you are asking the asp:LinkButton not to do anymore processing.
P.S: I have been using PostBack Ritalin to prevent multiple clicks on asp:Button. IMO, its definitely worth a look in this case.
Use the javascript debugger to check the method is being called. LinkButtons are server generated javascript powered anchor tags & therefore can be tricky.
Try this java script function ,
On your OnClientClick
<asp:LinkButton ID="submit" CssClass="button" Text="OK" onclick="myButtonId_Click(this);return false;" ></asp:LinkButton>
add function ,
protected void myButtonId_Click(target) {
target.disabled = true;
}
I am facing a problem with buttons.
I want a client side validation to occur(say selecting a maximum of only 4 checkboxes in a datalist).
I used a INPUT TYPE="BUTTON" RUNAT="SERVER" style of tag. and put Onserverclick="someservermethod" which works fine.
I wrote a Validate() and added onclick="return validate();" to the above HTML markup and was thinking if it returns false then my server side code someservermethod() would not execute and it works great as expected
But when I return true I thought it would fire my someservermethod(), but it is not working. Any thoughts on why it is not working?
HTML MARKUP BELOW FOR THE BUTTON
button onclick="return ValidateSelection();" type="button" id="btnSubmit"
runat="server" onserverclick="btnSubmit_Click"
JAVASCRIPT CODE
function ValidateSelection()
{
if(good)
{
// I expect that my server side code btn_Submit would have got called. But
// it doesn't get called.
return true;
}
else
{
//This works great. Not calling the server side method for the button
alert('something happened');
return false;
}
}
I think I am messing up with the formatting. Pardon me.
The control you are using right now it HtmlButton which is not "fit" for what you are trying to do, as your onclick overwrites the required client side code for the post back.
What you need is the Button control which does support overwriting the client side onclick and still perform the post back as usual.
Change the markup to this and it should work:
<asp:button OnClientClick="return ValidateSelection();" id="btnSubmit" runat="server" OnClick="btnSubmit_Click" Text="Submit"></asp:Button>
I have a button that closes a modal dialog box on an ASP.NET Ajax form. How do a add a client side function to be called on the same button click?
currently firebug has this for the onclick
javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$DefaultContent$btnPaymentActionDetailClose", "", true, "", "", false, false))
can I just add a click handler with jQuery? I don't want to wipe out the postback as it is necessary for the forms functionality.
Can I use
$("#buttonId").bind("click", function(e){
runAnotherFunction();
});
And not interfere with the existing postback?
Actually truth be told, I want to exec the function when the modal dialog closes. Do ajax control toolkit widgets fire any type of events? I know I can find the behavior and call show and hide. Can I attach my function to exec when modal.hide() is executed?
Thanks for any advice,
~ck in San Diego
Yes, you can definitely have your ASP:Button run Javascript on the client before posting back. It's the OnClientClick property of the webcontrol.
You won't need jQuery for this.
<asp:button id="btn" runat="server" onClientClick="SomeJsFunction()"
onClick="ServerSideMethod()" Text="Hello Button" />
<script language='javascript'>
function SomeJsFunction()
{
alert('hi');
}
</script>
If you're interested controlling whether the postback occurs or not, you could return and check for true/false from the result of your Javascript function.
function SomeJsFunction()
{
var isGood = false;
return isGood;
}
<asp:button id="btn" runat="server" onClientClick="return SomeJsFunction()"
onClick="ServerSideMethod()" Text="Hello Button" />
(thanks to Ralph for the nudge in the comments)