We Keep Coding

How to execute event when user presses return on web page

I have an ASP.NET website and I have a forgot password page where the user enters their email address in a text box and when they click the button to retrieve password, the event runs as fine.
Only problem is if the user types in their email address and presses ENTER instead, it runs a search (I have a search bar at the top of the page) and so the result comes back as 'search query not found'. But this search bar at the top is on a different ASP.NET page.
So anyway, I want the event onclick to run when the user presses enter and not run a search query. Does anyone have any ideas? I've searched on this site but not really found the answer I need.

There are couple ways you can do this. If it is a webform and you have your textbox wrapped with an asp:panel you can do as below:
<asp:Panel ID="p" runat="server" DefaultButton="myButton">
<%-- Text boxes here --%>
<asp:Button ID="myButton" runat="server" />
</asp:Panel>
If its not a webform or you want to move away from that try below:
<asp:TextBox ID="TextBox1" runat="server" onkeypress="return EnterEvent(event)"></asp:TextBox>
<asp:Button ID="Button1" runat="server" style="display:none" Text="Button" />
function EnterEvent(e) {
if (e.keyCode == 13) {
__doPostBack('<%=Button1.UniqueId%>', "");
}
}
And in the codebehind fire your button click in the page load based on the parameters of the postback.

Specify the "defaultbutton" property to the ID of (event you want to fire).
You can specify the "defaultbutton" property at the Form level (in the form tag)
Or else you can define them at panel level in the tag.
The form level setting is overridden at the panel level setting.
The Event Handler for the specified button gets fired simulating a true submit button functionality.
<form id="sampleform" runat="server" defaultbutton="button1">
<div>
<asp:TextBox ID="textBox1" runat="server"></asp:TextBox>
<asp:Button ID="button2" runat="server" Text="Cancel" OnClick="Button2_Click" />
<asp:Button ID="button1" runat="server" Text="Ok" OnClick="button1_Click" />
<asp:Panel ID="panel1" runat="server" defaultbutton="Button5">
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox5" runat="server"></asp:TextBox>
<asp:Button ID="Button5" runat="server" Text="Button5" OnClick="Button5_Click" />
</asp:Panel>
</div>
</form>
In this example, Button1 is the default button for the form (Type something in Textbox 1 and hit enter, button1_Click gets fired). But for "Panel 1", default button will be Button 5 (Type in Textbox3 or Textbox 5 and hit enter).
You can have any number of panels with different default button for each panel.

Adding an ASP Panel around the text box and button with the id of the button name as the property for DefaultButton was the best way to do this.
<asp:Panel ID="p" runat="server" DefaultButton="myButton">
<%-- Text boxes here --%>
<asp:Button ID="myButton" runat="server" />
</asp:Panel>

My button opens my modal popup window, but the c# codebehind connected to the button does not fire

I have a button that opens a modal popup, but before I open the modal popup, I want my "OnClick" event for the "btnSaveAndScheduleTask" button to fire. I am using ASP.NET 4.5 / Visual Studio 2012 / HTML5 / CSS3
My aspx (snipet):
How do I get the codebehind OnClick event for my "btnSaveAndScheduleTask" button to fire? If the entire code would help figure it out, let me know, but I'm probably missing something simple (bear in mind that I want to be able to view all my asp controls from the C# codebehind):
<asp:Button ID="btnSaveAndScheduleTask" runat="server" CausesValidation="true"
OnClientClick="javascript:return validatePage();" OnClick="btnSaveAndScheduleTask_Click"
Font-Bold="true" Text="Schedule Task" />
<ajaxToolkit:ModalPopupExtender ID="mpeScheduleTask" runat="server" ValidateRequestMode="Enabled"
BackgroundCssClass="modalBackground" CancelControlID="btnCancSchedule"
PopupControlID="pnlScheduleTask" TargetControlID="btnSaveAndScheduleTask" DropShadow="true" >
</ajaxToolkit:ModalPopupExtender>
<div id="divScheduleTask" runat="server">
<asp:Panel ID="pnlScheduleTask" Height="310" Width="690" BackColor="#ece4e1" ForeColor="Black" runat="server" >
<asp:UpdatePanel runat="server" ID="udpScheduleTask" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="lblTaskSch" Visible="false" Font-Bold="true" Text="Task Scheduling: " runat="server" />
<asp:Button ID="btnSaveSchedule" runat="server" OnClick="btnSaveSchedule_Click" Text="Save Schedule" />
</div><asp:Button ID="btnCancSchedule" runat="server" Text="Canc" />
</ContentTemplate></asp:UpdatePanel></asp:Panel></div>
I've left out most of the panel as it's huge... here is my validatePage() Javascript:
<script type="text/javascript">
function validatePage() {
//Executes all the validation controls associated with group1 validaiton Group1.
var flag = window.Page_ClientValidate('vTask');
if (flag)
//Executes all the validation controls which are not associated with any validation group.
flag = window.Page_ClientValidate();
if (!Page_IsValid) {
$find('mpeScheduleTask').hide();
}
return flag;
}
</script>
My aspx.cs code behind:
protected void btnSaveAndScheduleTask_Click(object sender, EventArgs e)
{
//do stuff
}

Remove TargetControlID="btnSaveAndScheduleTask" , give other dummy control's ID
So when button clicks, click will take user to server , in code behind you need to manually open popup.
This is given here...!!!!
http://www.codeproject.com/Tips/215040/ModalPopupExtender-from-Server-Side-Code

I would put the javascript to be called in the behind code in your button click..
protected void btnSaveAndScheduleTask_Click(object sender, EventArgs e)
{
// do stuff.
Page.ClientScript.RegisterStartupScript(this.GetType(), "Call my function", "validatePage();", true);
}
this is how I do most of mine. Hope this helps.
And your ASP should look like..
<asp:Button ID="btnSaveAndScheduleTask" runat="server" CausesValidation="true" OnClick="btnSaveAndScheduleTask_Click" Font-Bold="true" Text="Schedule Task" />

Cannot click on an asp.net button within a jquery dialog

I already did search online, and try a few solutions provided, but none of them are working for me.
I have a button within a div. I am displaying the div within a jquery dialog. The button click doesnt work within the jquery dialog.
I have my code below :
aspx
<div id='one'>
<asp:LinkButton ID="ConfigureAlerts" OnClick="btnConfigureAlerts_Click" runat="server">Configure Alerts</asp:LinkButton>
</div>
<div id="ViewModalPopupDiv2">
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<asp:Panel ID="Panel2" runat="server" HorizontalAlign="left" ScrollBars="Auto">
<asp:Button ID="btnGetLogs" runat="server" Text="SendAlerts" OnClick="btnSendAlertEmail_Click"/>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
jquery
function ViewModelPopup2() {
$("#ViewModalPopupDiv2").dialog({
scrollable: true,
width: 800,
modal: true
});
}
aspx.cs
protected void btnSendAlertEmail_Click(object sender, EventArgs e)
{
// Code to send email
}
protected void btnConfigureAlerts_Click(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript
(this, this.GetType(), "callScriptFunction", "ViewModelPopup2();", true);
}
}
Please let me know what I need to do , to trigger the server control events .

I also had this problem with asp.net buttons and jQuery UI Dialog.
To solve it you need to set in your aspnet button the tag UseSubmitBehavior to false.
If UseSubmitBehavior attribute is set to true (this is the default value), the button will use the browser's submit mechanism (and jQuery Dialog UI is manipulating it), if UseSubmitBehavior is set to false, the button will use a client-side script that asp.net framework includes in the page to post to the form.
So your HTML should be like this :
<div id='one'>
<asp:LinkButton ID="ConfigureAlerts" OnClick="btnConfigureAlerts_Click" runat="server">Configure Alerts</asp:LinkButton>
</div>
<div id="ViewModalPopupDiv2">
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<asp:Panel ID="Panel2" runat="server" HorizontalAlign="left" ScrollBars="Auto">
<asp:Button ID="btnGetLogs" runat="server" Text="SendAlerts" OnClick="btnSendAlertEmail_Click" UseSubmitBehavior="false" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
More details at http://msdn.microsoft.com/library/system.web.ui.webcontrols.button.usesubmitbehavior.aspx

This is the classic, thanks for moving my dialog jQuery, question.
jQuery UI for some reason moves your dialog code to the bottom of the html markup, outside of your form tag. You need to move the dialog back into the form with some more jQuery:
dlg.parent().appendTo(jQuery('form:first'));
where dlg is your jQuery.UI dialog object.
var dlg = $("#ViewModalPopupDiv2").dialog({
scrollable: true,
width: 800,
modal: true
});
dlg.parent().appendTo(jQuery('form:first'));
That should get things working for you again. Cheers!
If that doesn't work, try doing that in the open event:
open: function(type,data) { $(this).parent().appendTo("form"); }

2 buttons click,1 in master another in content page

I have Logout button in master page in my website.
Now i had made a content page belonging to master page, in that i have 1 textbox and 1 button. In this page i have done coding of search on a button click of a value written in textbox. but when i enter some text in a textbox and just make enter click it calls the logout button which is in master page.
I just want that when i write some text in textbox and press enter, it should call a button where the search coding is done.

If you are using normal ASP.NET, you can surround your textbox and button with a Panel. On that panel you can set the property "DefaultButton". Every control in this panel will trigger that DefaultButton when trying to submit form via the Enter keypress.
<asp:Panel runat="server" DefaultButton="btnSearch">
<asp:TextBox runat="server" ID="txtSearch" Text="" />
<asp:Button runat="server" ID="btnSearch" Text="Search" />
</asp:Panel>

You have to use default panel. try this, I hope this will help you
<div id="search">
<asp:Panel ID="defaultpanel" runat="server">
<asp:TextBox ID="txtSearch" runat="server" Text=""></asp:TextBox>
<asp:Button ID="btnSearch" runat="server" Text="Go" OnClick="btnSearch_Click"
TabIndex="0" />
</asp:Panel>
and add the script as
<script type="text/javascript">
$('[id*=txtSearch]').keydown(function (e) {
var code = e.keyCode || e.which;
//alert("jj");
if (code === 13)
{
e.preventDefault();
$("[id*=btnSearch]").trigger('click');
}
});
</script>

Placing ajax ModalPopupExtender inside User control

I use an ajax ModalPopupExtender on many pages to display confirmation dialog.
So i would like to reuse same code on all pages by placing it in a use control.
But I'm not sure it it possible to access this user control from a javascript (I don't want server side operations).
This is the code that is responsible for popup display, that i want to place inside user control:
<script language="javascript" type="text/javascript">
var _source;
var _popup;
var _btn;
var _div;
function showConfirm(source, btnID, theDiv) {
this._source = source;
this._btn = btnID;
this._div = theDiv;
document.getElementById(btnID).click();
document.getElementById(theDiv).style.visibility = 'visible';
}
function okClick() {
document.getElementById(_div).style.visibility = 'hidden';
__doPostBack(this._source.name, '');
}
function cancelClick() {
document.getElementById(_div).style.visibility = 'hidden';
this._source = null;
}
</script>
<cc1:ModalPopupExtender ID="modal" runat="server"
TargetControlID="theButton" PopupControlID="div"
OkControlID="btnOk" OnOkScript="okClick();" CancelControlID="btnNo"
OnCancelScript="cancelClick();" BackgroundCssClass="modalBackground" />
<div id="div" runat="server" align="center" class="confirm" style="display: none">
<img align="absmiddle" src="../images/warning.jpg" />Are you sure you want to delete this item?
</br>
<asp:Button ID="btnOk" runat="server" Text="Yes" Width="50px" />
<asp:Button ID="btnNo" runat="server" Text="No" Width="50px" />
</div>
And on the "hosting" page, I want to assign JS to a buttons that will trigger the popup:
This is the code that i have now (and should be adopted to the user control):
string s = string.Format("showConfirm(this,'{0}','{1}');return false;", theButton.ClientID, div.ClientID);
btn.OnClientClick = s;

It's possible to call the modal popup extender from javascript as the modal popup control is just another DOM element. All you need to know is a selector which can select the item.
To "show" your modal popup extender from javascript all you will need to do is add some script to your master-page, user-control or page which displays the dom element which is the modal popup extender.
Alternatively you can use a javascript framework which has many other styles of modal dialog which are equally (if not more) useful than the ajax modal popup extender. This is probably more relevant to what you are trying to achieve considering your don't want to use ASP.NET's server side code capabilities.