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>
Related
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
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 know how to prevent javscript within the href attribute from firing as evident in this JSFiddle (http://jsfiddle.net/mkarr/KNefK/)
However, when this logic is applied to an ASP.Net LinkButton as such:
<asp:LinkButton ID="btnSubmit" runat="server" Text="Submit" OnClientClick="return formTest.validate(event);" OnClick="btnSubmit_Click"></asp:LinkButton>
which translates to:
<a onclick="return formTest.validate(event);" id="ctl00_m_g_87932399_e546_4e12_8297_982b811d8cea_ctl00_btnSubmit" href="javascript:WebForm_DoPostBackWithOptions('blah blah blah')">Submit</a>
The formTest.validate() method does execute correctly and returns false, but the WebForm_DoPostBackWithOptions is always fired immediately after!
Can anyone see any flaws in my logic that I cannot??
EDIT:
Also, several stack overflow solutions have been accepted for this issue but all of them are doing virtually what I have already done leading me to believe I'm missing something simple!
Disable the postback on an <ASP:LinkButton>
Prevent LinkButton post back OnClientClick not working. Why?
ANSWER:
Since I cannot answer my own question because I'm not reputable yet (LOL), here's an edit with the answer:
Going off #QBM5's original tip of not using ASP.Net controls, I solve the problem, although I still do not know why the initial problem occurred in the first place (does anyone when it comes to ASP.Net? Turn it off, then back on comes to mind here) :o)
I replaced the LinkButton ASP.Net control with the following:
<input type="submit" value="Submit" id="btnSubmitButton" runat="server" OnServerClick="btnSubmitButton_Click" class="submitBtn" />
I then bound the .submitBtn's click event via jQuery:
$('.submitBtn').on('click', function (e) {
if (!instance.validate()) {
e.preventDefault();
}
});
The trick is to use OnServerClick and runat="server" on the control but getting away from LinkButton was the goal and the postback behavior is completely different.
which translates to this:
<input onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(''); " type="submit" id="ctl00_m_g_87932399_e546_4e12_8297_982b811d8cea_ctl00_btnSubmitButton" value="Submit" class="submitBtn">
Anyone want to take a stab at the root cause? I need to move foward so don't have time. :o)
The following is working for me, by changing element.href = "#"
<asp:LinkButton ID="btnSubmit" runat="server" Text="Submit" OnClientClick="return ClientSideValidation()" OnClick="btnSubmit_Click"></asp:LinkButton>
Javascript validation
function ClientSideValidation() {
var element = document.getElementById("<%=txtAmount.ClientID%>");
element.href = "";
if (element.value == "") {
element.href = "#";
return false;
}
return true;
}
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;
}
So right now it all looks pretty with ...
<button type="submit" runat="server" name="subscribe" id="Button1" class="link-button" onserverclick="saveListing">
Until it is time to validate the data before calling saveListing function codebehind (in VB .Net).
How can true/false be return so that when true saveListing will be called, otherwise not?
Thank you.
add onclick='if(! validateFunction()) return false;.
I can't recall correctly whether HTML button control had onclicentclick property. Surely, if the web control <asp:Button ... it has a property OnClientClick where you can give the same value above for this effect as well.