In the following code when I click on my Clear_Button my OnClick event refreshes my page and I don't want that to happen. How can I prevent this from happening?
<dx:ASPxButton ID="Clear_Button" runat="server" AutoPostBack="false" CssClass="bordered-orange roundCorners toRight toMiddle" Text="Clear" Width="18%" Theme="Metropolis">
</dx:ASPxButton>
My Event :
Protected Sub Clear_Button_Click(sender As Object, e As EventArgs)
Author.Items.Clear()
End Sub
Thank you in advance for your answers
event.preventDefault(); will work
Try to use in frontend like javascript to clearing your data or refreshing your page without postback
<asp:Button ID="Clear_Button" runat="server" CssClass="bordered-orange roundCorners toRight toMiddle" Text="Clear" Width="18%" Theme="Metropolis" OnClientClick="return resetButtonClick();"Text="Reset" />
<script type="text/javascript"> function resetButtonClick() { $("#<%= txt1.ClientID %>").val("");$("#<%= txt2.ClientID %>").val(""); return false;}</script>
To prevent refresh, you can use:
<dx:ASPxButton ... OnClientClick="return false;" >
</dx:ASPxButton>
thank you for your answers !
I managed to make it work thanks to the <asp:updatepanel> element which allows not to refresh the page
Related
Iam developing application in asp.net c#, in that i have a requirement to pass text box value through query string without using server side code,
in that iam trying some code below, but its not working for me.
<asp:HyperLink ID="hlnkHistory" runat="server" Text="History" ForeColor="Green" ImageUrl="~/images/History2.png" Font-Bold="true" Target="_blank" NavigateUrl="~/WebFormReports/History.aspx?SerialNo=<%#Eval('txtSerialNo.ClientID')%>" ToolTip="View History"></asp:HyperLink>
When iam assign value directly like the below code its working fine.
<asp:HyperLink ID="hlnkHistory" runat="server" Text="History" ForeColor="Green" ImageUrl="~/images/History2.png" Font-Bold="true" Target="_blank" NavigateUrl="~/WebFormReports/History.aspx?SerialNo=1" ToolTip="View History"></asp:HyperLink>
Note: i need not server side code to pass value
like
protected void lnkNavigate_Click(object sender, EventsArgs e)
{
Response.Redirect("MyLocation.aspx?value=" + myTextBox.Text, false);
}
if it is not possible means please tell me is there any another option to pass text box value to query string like a href & link button
any help would be appreciated.. thanks in advance..
If you want to still use the asp:HyperLink then you can use this snippet.
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:HyperLink ID="hlnkHistory" runat="server" Text="History" ForeColor="Green" ImageUrl="~/images/History2.png" Font-Bold="true" Target="_blank" NavigateUrl="~/WebFormReports/History.aspx?SerialNo=" ToolTip="View History" onclick="setHyperlink()"></asp:HyperLink>
<script type="text/javascript">
function setHyperlink() {
var value_hyperlink = $("#<%=hlnkHistory.ClientID %>").attr("href");
var value_textbox = $("#<%=TextBox1.ClientID %>").val();
$("#<%=hlnkHistory.ClientID %>").attr("href", value_hyperlink + value_textbox);
}
</script>
If you don't need that hyperlink, you can use a somewhat simpler javascript function.
location.href = "~/WebFormReports/History.aspx?SerialNo=" + $("#<%=TextBox1.ClientID %>").val();
I have multiple sections on my aspx page.
<ul>
<li class="tab-current"><asp:HyperLink ID="home" runat="server" Text="Home" NavigateUrl="#section-1"/></li>
<li><asp:HyperLink ID="events" runat="server" Text="Events" NavigateUrl="#section-2"/></li>
<li><asp:HyperLink ID="finance" runat="server" Text="Finance" NavigateUrl="#section-3"/></li>
<li><asp:HyperLink ID="merchandise" runat="server" Text="Merchandise" NavigateUrl="#section-4"/></li>
<li><asp:HyperLink ID="tasks" runat="server" Text="Tasks" NavigateUrl="#section-5"/></li>
<li><asp:HyperLink ID="profile" runat="server" Text="Profile" NavigateUrl="#section-6"/></li>
</ul>
On one of the sections I have a button and a gridview control. On button click gridview gets loaded with some data, However button click causes postback and takes me Section#1. I want to stay on the that gridview after postback.
Thanks.
Add MaintainScrollPositionOnPostback="true" to the Page directive.
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="myPage.aspx.cs" MaintainScrollPositionOnPostback="true" %>
Or if you want this for all your pages you could set in the Web.Config under the <system.web> node.
<pages validateRequest="true" maintainScrollPositionOnPostBack="true" enableViewStateMac="true" enableEventValidation="true" viewStateEncryptionMode="Always"/>
UPDATE
To make sure the correct tab is displayed after PostBack, you need to call a client side function.
First add something like this to the section onclick="setTabIndex(1)". This can also be onmouseover, a binding on class name etc.
<asp:HiddenField ID="HiddenField1" runat="server" />
<script type="text/javascript">
function setTabIndex(tab) {
//store the tab number in a hidden field so you can access it in code behind
document.getElementById("<% = HiddenField1.ClientID %>").value = tab;
}
function showTab(tab) {
alert(tab);
//open the correct tab
}
</script>
And in code behind call the client side function showTab:
if (IsPostBack)
{
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "showTab", "showTab(" + HiddenField1.Value + ")", true);
}
One thing you could do is to pass back the url of the current page with the section ID anchor appended to the URL (see below).
Example:
http://yoursite.com/return-address#section1
http://yoursite.com/return-address#section2
and so on...
Hope this helps.
Craig
I have developed a visualforce page where I have used apex:tab and apex:commandButton. apex:commandButton is in under apex:tab. Now, I am using commandButton for check validation and calling class method. But I want to do same thing on tab click also. I have used switchType="ajax", it is working and tab is changing but I can't find out how can I call a class method on tab click.
I am using below code:-
<apex:form id="formId">
<apex:actionStatus id="tabStatus" startText="Processing..." onstop=""/>
<apex:tabPanel switchType="ajax" reRender="formId" value="{!currentTab}" id="theTabPanel" tabClass="activeTab" inactiveTabClass="inactiveTab" activeTabClass="activeTab" contentStyle="font-size: 12px;">
<apex:tab switchType="ajax" label="Tab1" status="tabStatus" name="Tab1" id="Tab1Id" reRender="formId">
</apex:tab>
<apex:tab switchType="ajax" label="Tab2" status="tabStatus" name="Tab2" id="Tab2Id" reRender="formId">
</apex:tab>
<apex:tab switchType="ajax" label="Tab3" status="tabStatus" name="Tab3" id="Tab3Id" reRender="formId">
</apex:tab>
</apex:tabPanel>
can anybody help me please
How to call a class method on click on tab?
Thanks in advance.
Try this:
<apex:actionFunction name="callClass" action="{!yourMethodName}" rerender="none" />
<apex:tab onclick="callClass()">
Use selectedTab attribute in "tabPanel" to control from controler the selectedTab
something like
<apex:actionFunction name="callClass" action="{!callClass}" rerender="tabPanel" />
<apex:tabPanel selectedTab="{!selectedTab}" onclick="callClass()">
I have a form with an image button inside of it, and this image button is submitting the form. How do I override this functionality?
<form><input type="image" src="/images/arrow.png" id="imageButton" onClick="javascript:autofill();"/></form>
Why not just have image? return false would also stop the form submit action.
<form><input type="image" src="/images/arrow.png" id="imageButton" onClick="autofill();return false;"/></form>
simply return false after your autofill() function.
onclick="autofill();return false;"
Why use an input element at all? I'd have thought just using an image with an onclick event would be more appropriate if you don't want to cause any submit or reset behaviour
<image src="/images/arrow.png" onclick="javascript:autofill();" width="xxx" height="xxx" alt="Autofill" />
Clicking on button inside a form, submit the form by default. To change it, you have to define a button with type="button". Then, you can add img element inside it. This is the best way I found to do it.
<form>
<button type="button" id="imageButton" onclick="javascript:autofill();">
<img src="images/arrow.png">
</button>
</form>
Try to use event.preventDefault to abort submit event on button click
for example:
$("#idButton").click(function(event) {
if(!valid)
{
//stopEvent
event.preventDefault();
} else {
//submit your form
$("#form").submit();
}
});
Do you want to disable your button after click the submit button/image?
if you're using php you can use the code below or add disabled="disabled" to disable the button as long as you keep it in your input form..
<?php if (isset($disable) && $disable === true) echo ' disabled="disabled"'; ?>
how to add my code
if you use your line of code with an image type:
try:
<form><input type="image" src="/images/arrow.png" id="imageButton" onClick="javascript:autofill();" <?php if (isset($disable) && $disable === true) echo ' disabled="disabled"'; ?> /></form>
Please, read this answer from me (jagb) too if you'd like to use an image without javascript, the needed css can be found on there as well.
Adding attribute type="button" to button tag resolved my issue.
I have a peculiar problem here and I can't by my life figure out what the solution is. Note that the following code is not dynamically created, but just immediately in my aspx file.
<button type="button" runat="server" id="btnSubmit"
OnServerClick="btnSubmit_Click" onclick="return confirm('Sure?');">
Submit
</button>
This works just fine as long as I don't have the onclick attribute there, i.e. the OnServerClick handler is fired as it should. But when I use the onclick attribute it is not, no matter whether I confirm or decline the confirmation dialog box.
What am I doing wrong?
If you look at the source code generated you will see the following:
onclick="return confirm('Sure?'); __doPostBack('btnSubmit','')"
so what is happening is the _doPostBack is never called. The hacky way to do what you're looking for is the following:
<button type="button" runat="server" id="btnSubmit"
OnServerClick="btnSubmit_Click" onclick="if (confirm('Sure?')) ">
The real correct way would be to use a Web Control:
<asp:Button runat="server"
OnClick="btnSubmit_Click" OnClientClick="return confirm('Sure?')" Text="Submit" />
I had more success with
<asp:Button ID="btnSubmit" runat="server" Text="Save" UseSubmitBehaviour="false"
OnClick="btnSubmit_Click" OnClientClick="if (!confirm('Sure?')) return" />
The accepted answer is not perfect. If you do not use type="button", the web page will do postback even you have clicked cancel. The correct and easiest way is to take advantage of short-circuit evaluation and do this hack: replace ; with && !, like below.
<button runat="server" id="btnSubmit"
OnServerClick="btnSubmit_Click" onclick="return confirm('Sure?') && !">
The output will look like this:
<button id="btnSubmit"
onclick="return confirm('Sure?') && ! __doPostBack('btnSubmit','')">
It gives correct return value because true && !undefined will return true and undefined will be evaluated and false && !undefined will return false and undefined will NOT be evaluated which is exactly what we want.
How about chaging button's type to submit, it works well :
<button type="submit" runat="server" id="btnSubmit"
OnServerClick="btnSubmit_Click" onclick="return confirm('Sure?');">
Submit
</button>
Try this:
<button type="button" runat="server" id="btnSubmit"
OnServerClick="btnSubmit_Click" onclick="if(!confirm('Sure?')) return;">
Submit
</button>
It sounds like the onclick event isn't bubbling through.
You should just be able to use
OnClientClick="return confirm('Sure?');
I don't think the other onClick should be necessary.
Edit:
This method would require you to hook your function to the OnClick event manually.
I am making up attributes this morning so in a futile effort to redeem myself-
Another method would be to insert javascript to catch the event. Something like..
$("form").submit(function() {
var resp = confirm("Save & Submit?");
if (resp) {
serializeStats();
return true;
}
else {
return false;
}
});
I do recall there being a better inline way to do this though.
Caffeine time now.
< button> is an HtmlButton control where OnServerClick is the only server-side click event. OnClick is unrecognized by ASP.NET so it gets passed to the client intact in case you want some client-side javascript code to execute before the postback.
< asp:button> is a WebControl which accomplishes the same thing with the OnClick server-side event and OnClientClick for client-side.
I think you're getting the behavior you see because your confirm('sure?') returns false which stops the postback mechanism. That would explain why it works when you don't have onclick in place.
Front Site
<button id="submit1" runat="server"
onclick="if(confirm('Sure?')) { } else{ return false} ;"
onserverclick="submit_ServerClick" >save</button>
Back Site
protected void submit_ServerClick(object sender, EventArgs e)
{
}