Will something like this work? If it does, how do I determine which button was clicked on post?
<asp:UpdatePanel ID="MainUpdatePanel" runat="server"><ContentTemplate><div class="home_c" id="home_c2">
<div class="home-tabs">
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Cures" ID="cures_btn" runat="server" />
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Conditions" ID="conditions_btn" runat="server" />
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Recent" ID="recent_btn" runat="server" />
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Uncured" ID="uncured_btn" runat="server" />
</div>
<div class="home-search">
</div>
</div>
</ContentTemplate></asp:UpdatePanel>
Yes it will work. Just add OnClick events for each and have your click events defined in your code behind to handle them. Simple as that. :)
E.g.
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Cures" ID="cures_btn" runat="server" OnClick="cures_btn_Click" />
And in your code behind
protected void cures_btn_Click(object sender, EventArgs e)
{
// Some code
}
Related
I am using ASP.NET and C#. I want to popup this little screen, then when the OK button is clicked, I want to update the main screen based on the input to the popup. Sounds like it should be a regular thing. Is it possible, and if so, how?
<cc1:modalpopupextender id="ModalPopupExtender1" runat="server"
cancelcontrolid="btnCancel" okcontrolid="btnOkay"
targetcontrolid="txtCosCodeExpCode" popupcontrolid="Panel1"
popupdraghandlecontrolid="PopupHeader" drag="true"
backgroundcssclass="ModalPopupBG">
</cc1:modalpopupextender>
<asp:panel id="Panel1" style="display: none" runat="server">
<div class="CostCentreExpenseCodePopup" style="background-color:White ; border-style :solid;">
<div class="PopupHeader" id="PopupHeader">Select Cost Centre / Expense Code</div>
<div class="PopupBody">
<p>Cost Centre<asp:DropDownList
ID="ddlCostCentres1"
runat="server"
CssClass="SVSComboBox1"
AppendDataBoundItems ="True"
AutoPostBack="True"
style = "width :152px;"
OnSelectedIndexChanged="ddlCostCentres1_SelectedIndexChanged">
<asp:ListItem Text="Please select" Value="0"></asp:ListItem>
</asp:DropDownList></p>
<p>Expense Code <asp:DropDownList ID="ddlExpCode1" runat="server" CssClass="SVSComboBox1" style = "width :152px;"
AppendDataBoundItems ="True" Enabled="False" Visible ="False">
<asp:ListItem Text="Please select" Value="0"></asp:ListItem>
</asp:DropDownList></p>
</div>
<div class="Controls">
<input id="btnOkay" type="button" value="Done" />
<input id="btnCancel" type="button" value="Cancel" />
</div>
</div>
Don't set OkControlID but use ModalPopupExtender1.Hide() on server-side. Then you're able to call your update-code first.
You should also use server-buttons instead of <input id="btnOkay" type="button" value="Done" /> and handle their click-event.
First of all add the asp:Button as an Ok button and add click event in your aspx.cs page as mentioned below:
ASPX:
<asp:Button runat="server" ID="btnOkay" Text="OK" OnClick="btnOkay_Click"/>
ASPX.cs
protected void btnOkay_Click(object sender, EventArgs e)
{
// Code to write on ok click event
}
And then remove okcontrolid="btnOkay" from your modal popup extender.
Maybe I am not understanding how this works completely but what I have is a gridview custom template with an imagebutton and a modalpopup. Below my page I have my popup panel which is hidden. When I click my image button the panel displays then I click the "btnModalCancelAll" and it starts to step through my method which sets a page variable from 0 to 1 but then the problem comes in it does not continue to the original gridview image click event not sure why. Below is my template field and the popup panel.
<asp:TemplateField>
<ItemTemplate>
<asp:ImageButton ID="ImageButtonCancelResv" runat="server" Width="20" Height="20px" ImageUrl="~/Images/Delete.png" OnClick="ImageButtonCancelResv_Click" />
<asp:ModalPopupExtender ID="mpe" runat="server" TargetControlID="ImageButtonCancelResv" PopupControlID="pnlModalPanel" CancelControlID="btnModalCancel"></asp:ModalPopupExtender>
<br />
<asp:Label ID="Label1" runat="server" Text="Cancel"></asp:Label>
</ItemTemplate>
<asp:Panel ID="pnlModalPanel" CssClass="modalBackground" runat="server" Style="display:none">
<asp:UpdatePanel runat="server" ID="updatePanelPopUp">
<ContentTemplate>
<div id="modalWrap">
<asp:Label ID="lblAreyousure" runat="server" Text="Are you sure you want to do that?"></asp:Label>
<div id="divhr1" class="horizontalRule" runat="server"></div>
<div id="divCancelSummaryAll">
<asp:Label ID="lblEntireFamily" runat="server" Text="Cancel all family reservations from this event date."></asp:Label><br />
<asp:Label ID="lblSummaryDeleteAll" runat="server" Text=""></asp:Label><br />
<asp:Button ID="btnModalDeleteAll" runat="server" CssClass="modalButton" Text="Cancel all Family" OnClick="btnModalDeleteAll_Click" />
</div>
<div id="divCancelSummaryOne">
<asp:Label ID="Label2" runat="server" Text="Cancel selected child reservation from this event date."></asp:Label><br />
<asp:Label ID="lblSummaryDeleteOne" runat="server" Text=""></asp:Label><br />
<asp:Button ID="btnModalDeleteOne" runat="server" CssClass="modalButton" Text="Cancel this Child" OnClick="btnModalDeleteOne_Click" />
</div>
<br />
<asp:Button ID="btnModalCancel" runat="server" Text="Cancel" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
I suggest you create another button and use it as the TargetControlID for the modal popup.
you can hide this button by setting its display to 'none'. This will only be a dummy button so that your code compiles.
Now when you click the button "ImageButtonCancelResv" it will run your code which is in the method OnClick="ImageButtonCancelResv_Click"
and at the end of this method you can add a command to show the popup:
mpe.Show();
Example Code:
protected void ImageButtonCancelResv_Click(object sender, EventArgs e)
{
//Do something here when button is clicked
mpe.Show();
}
And then
<asp:TemplateField>
<ItemTemplate>
<asp:ImageButton ID="ImageButtonCancelResv" runat="server" Width="20" Height="20px" ImageUrl="~/Images/Delete.png" OnClick="ImageButtonCancelResv_Click" />
<div style="display: none">
<asp:Button ID="btnModalStatusHidden" runat="server" />
</div>
<asp:ModalPopupExtender ID="mpe" runat="server" TargetControlID="btnModalStatusHidden" PopupControlID="pnlModalPanel" CancelControlID="btnModalCancel"></asp:ModalPopupExtender>
<br />
<asp:Label ID="Label1" runat="server" Text="Cancel"></asp:Label>
</ItemTemplate>
In Internet Explorer if I hit enter in the TextBox P it submits the Form using the onclick event of LoginButton.
This is what I want to happen.
In Google Chrome if I hit enter it submits the form with the onclick of Button1.
This is not what I want to happen.
Button1 is actually not visible on the form under normal circumstances. It is made visible under certain circumstances to do a different task then login.
How can I force this, browser independently, to always use LoginButton onclick when someone presses enter?
<asp:TextBox ID="P" runat="server" TextMode="Password" Width="150"></asp:TextBox>
<asp:LinkButton CssClass="button" ID="LoginButton"
runat="server" CommandName="Login" Text="Log In" ValidationGroup="Login1"
onclick="LoginButton_Click" />
<asp:Button
ID="Button1" runat="server"
Text="Submit" onclick="Button1_Click" />
You set the forms default button:
<form id="Form1" defaultbutton="SubmitButton" runat="server">
The Following works for me.
<form id="form1" runat="server" defaultbutton="LoginButton">
<div>
<asp:TextBox ID="P" runat="server" TextMode="Password" Width="150"></asp:TextBox>
<asp:LinkButton CssClass="button" ID="LoginButton"
runat="server" CommandName="Login" Text="Log In" ValidationGroup="Login1"
OnClick="LoginButton_Click" />
<asp:Button ID="Button1" runat="server" Text="Submit" OnClick="Button1_Click" > </asp:button>
</div>
</form>
You'll probably want to set a default button in your Page_Load method, like this:
this.Form.DefaultButton = this.LoginButton.UniqueID;
I ended up using C# in my Page_Load(object sender, EventArgs e) method to set the DefaultButton. Found this on another stackoverflow post.
https://stackoverflow.com/a/2213237/2907463
this.Form.DefaultButton = Login1.FindControl("LoginButton").UniqueID;
I am trying set a button on a user control as defaultbutton on a page but its not working. Here is the code for my user control
<asp:Panel ID="pnlTopicPicker" runat="server" DefaultButton="btnSubmit">
<div class="PadBottom">
<div id="divTopic" class="FloatLeft PadDiv">
<div class="SectionHeader FloatLeft PadRightMediumSmall">Topic:</div>
<asp:DropDownList ID="ddlSelectedTopic" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlSelectedTopic_OnSelectedIndexChanged" >
</asp:DropDownList>
</div>
<div class="FloatLeft PadLeftMediumSmall">
<asp:Button ID="btnClear" runat="server" Text="Clear" OnClick="btnClear_Click" CssClass="DefaultButton" />
</div>
<div class="FloatRight PadRightMediumSmall">
<asp:Button ID="btnSubmit" runat="server" Text="View Report" OnClick="btnSubmit_Click" OnClientClick="return ViewReportSubmit(event);" CssClass="DefaultButton" />
</div>
</div>
</asp:Panel>
I am using the above control : TopicPicker in a page:
<asp:UpdatePanel ID="pnlFind" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div class="PadLeft">
<Incapnet:TopicPicker ID="incTopicPicker" runat="server" OnClearClick="btnClear_Click" OnSubmitClick="btnSubmit_Click" OnSelectedTopicChanged="ddlSelectedTopic_Changed" />
</div>
<div class="ClearBoth" />
<div class="PadTop PadLeft" >
<asp:GridView ID="gvFindGrid" runat="server" AutoGenerateColumns="False" OnRowDataBound="gvFindGrid_RowDataBound"
CssClass="ContrastTable UFWideTable" GridLines="None">
<AlternatingRowStyle CssClass="AlternateRow" />
<RowStyle CssClass="Row" />
<HeaderStyle CssClass="HeaderRow" />
<EmptyDataTemplate>
No Records Found
</EmptyDataTemplate>
<Columns>
...
...
</ContentTemplate>
</asp:UpdatePanel>
Now when I hit enter, on the page, I want the "btnSubmit" to be executed, which is not happening.
How do I get this working.
Thanks,
under what circumstances are you expecting the btnSubmit Click event to fire?
I ask because the event will only be triggered if the Enter key is pressed when a control which implements the IButtonControl interface has focus.
This would include (among others) TextBox and DropDownList.
If you select your DropDownList and then hit enter it should fire the event. But just clicking any element (such as a DIV) and hitting enter would not.
Edit (Based on comment)
Its a bit of a hack but you can achieve what you ask using the following javascript (uses JQuery):
<script type="text/javascript">
$(document).keypress(function (e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code == 13) {
$('#<%= btnSubmit.ClientID %>').click();
}
});
</script>
Try adding the following to the button:
<asp:Button ID="Button1" runat="sever" UseSubmitBehavior="true" ... >
If that doesn't help, try adding this to your markup (for IE):
<!-- Fix for IE bug submit on pressing "Enter" -->
<div style="display:none">
<input type="text" name="hiddenText"/>
</div>
this.Page.Form.DefaultButton = this.btnLogin.UniqueID;
I am dynamically adding buttons to a listview and using the ItemCommand event to handle the button click event using the CommandName property for the button. It works fine in IE, but when I try in Firefox 5, it is hitting the page load event but not the ItemCommand event. Is there a work-around for Firefox?
Thanks!
<asp:ListView ID="lvItems" runat="server" OnItemDataBound="lvItems_ItemDataBound"
DataSourceID="odsItems" OnItemCommand="lvItems_ItemCommand" DataKeyNames="ItemID"
OnDataBound="lvItems_DataBound" OnPagePropertiesChanging="lvItems_PagePropertiesChanging">
<LayoutTemplate>
<div id="itemPlaceholder" runat="server">
</div>
</LayoutTemplate>
<ItemTemplate>
<div>
<asp:Label ID="lbl" runat="server">
</asp:Label>
<asp:Button ID="btnAdd" runat="server" CommandName="Add" Text="Add" OnClientClick="this.disabled=true;" />
</div>
</ItemTemplate>
<EmptyDataTemplate>
No items found for the selected filters. Please try again.<br />
<br />
</EmptyDataTemplate>
</asp:ListView>
protected void lvItems_ItemCommand(object sender,ListViewCommandEventArgs e)
{
if (e.CommandName == "Add")
{
//code here;
}
}
You have to set UseSubmitBehaviour to false, because disabling a button on clientside will cancel the browsers submit. By the way, in IE it's exactly the same.
<asp:Button ID="btnAdd" runat="server" CommandName="Add" Text="Add"
UseSubmitBehavior="false" OnClientClick="this.disabled='true';" />
On this way ASP.NET will append the necessary client-script to postback at the end of your script:
__doPostBack('btnAdd','')
http://encosia.com/disable-a-button-control-during-postback/
OnclientClick and OnClick is not working at the same time?