How to use AJAXControlToolkit’s Modelpopu with ConfirmDialog? - asp.net

I am trying to use AJAXControlToolkit’s Modelpopu with ConfirmDialog.I am using VS2008. Following is my code
<asp:Button ID="btnSave" runat="server" Text="Save" onclick="btnSave_Click" />
<asp:ConfirmButtonExtender ID="btnSave_ConfirmButtonExtender" runat="server"
ConfirmText="Want to Save?" Enabled="True" TargetControlID="btnSave">
</asp:ConfirmButtonExtender>
<asp:ModalPopupExtender ID="btnSave_ModalPopupExtender" runat="server"
DynamicServicePath="" Enabled="True" TargetControlID="btnSave">
</asp:ModalPopupExtender>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
Please guide me what should I do to make it run.

From the AJAX Control Toolkit documentation for the ConfirmButtonExtender:
http://www.asp.net/ajax/ajaxcontroltoolkit/samples/ConfirmButton/ConfirmButton.aspx
DisplayModalPopupID - Optionally specifies the ID of a ModalPopup control to use for displaying the confirmation dialog (instead of window.confirm). When using DisplayModalPopupID, the following conditions must be met:
The ModalPopup must be configured to work against the same TargetControlID as the ConfirmButton (and should work properly if the ConfirmButton is disabled).
The ModalPopup must specify OkControlID and/or CancelControlID to identify the buttons corresponding to window.confirm's OK/Cancel buttons.
The ModalPopup must not specify OnOkScript or OnCancelScript.
Example of using the AJAX controls together in your page:
<asp:ConfirmButtonExtender ID="btnSave_ConfirmButtonExtender" runat="server"
ConfirmText="Want to Save?" TargetControlID="btnSave"
DisplayModalPopupID="btnSave_ModalPopupExtender"></asp:ConfirmButtonExtender>
<asp:ModalPopupExtender ID="btnSave_ModalPopupExtender" runat="server"
TargetControlID="btnSave" PopupControlID="Panel1"
OkControlID="btnOK" CancelControlID="btnCancel"></asp:ModalPopupExtender>
Where Panel1 is an <asp:Panel> that gets displayed as the modal dialog, and btnOK and btnCancel are the OK and Cancel buttons on that panel.

Related

Ajax AutoCompleteExtender textbox not firing text change event in Edge Browser

I am using Ajax AutoCompleteExtender on a textbox(ASP.NET) and I have wired up the text change event. When I type in the textbox system is able to successfully fetch the data from an asmx method but the text change event associated with the auto complete text box is not getting fired. This is only happening in Edge browser. I tested the site in chrome and IE and it is working absolutely fine. To add this issue started to appear when I upgraded to the latest version of Ajax Control Kit. Also the text change event gets fired(edge) when I click on the submit button. It's something like the text change event is getting fired when some other event is fired.
Below is the code snippet.
<asp:TextBox ID="AutoTxtCompany" runat="server" aria-describedby="ContentPlaceHolder1_rfvCustomerCompany" AutoPostBack="true" CssClass="ui-autocomplete-input ui-widget ui-widget-content comboBoxDimensionsTextBox" OnTextChanged="AutoTxtCompany_TextChanged" aria-required="true" />
<asp:AutoCompleteExtender ID="autoextAutoTxtCompany" BehaviorID="autoextcompanyautocomplete" runat="server" TargetControlID="AutoTxtCompany" MinimumPrefixLength="1" EnableCaching="false"
CompletionSetCount="5000" CompletionInterval="100" ServiceMethod="getCompanyList" CompletionListCssClass="autocomplete_completionListElement" ServicePath="~/FrontEnd/AutoComplete.asmx" UseContextKey="true" FirstRowSelected="true">
</asp:AutoCompleteExtender>
Try to use the AutoCompleteExtender control's OnClientItemSelected event to fire the Textbox TextChanged event. Code like this:
<script type="text/javascript" >
function DoTextChangedPostBack(source, eventArgs) {
var hfield = $get('<%=AutoTxtCompany.ClientID%>');
hfield.value = eventArgs.get_value();
__doPostBack("<%=AutoTxtCompany.ID%>", "TextChanged");
}
</script>
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:TextBox ID="AutoTxtCompany" runat="server" aria-describedby="ContentPlaceHolder1_rfvCustomerCompany"
AutoPostBack="true" CssClass="ui-autocomplete-input ui-widget ui-widget-content comboBoxDimensionsTextBox"
OnTextChanged="AutoTxtCompany_TextChanged" aria-required="true" />
<ajaxtoolkit:autocompleteextender id="autoextAutoTxtCompany" behaviorid="autoextcompanyautocomplete" runat="server"
targetcontrolid="AutoTxtCompany" minimumprefixlength="1" enablecaching="false"
completionsetcount="5000" completioninterval="100" servicemethod="getCompanyList"
completionlistcssclass="autocomplete_completionListElement" servicepath="FrontEnd/AutoComplete.asmx"
OnClientItemSelected="DoTextChangedPostBack"
usecontextkey="true" firstrowselected="true">
</ajaxtoolkit:autocompleteextender>
</div>

ASP.NET pressing Enter key causes log out

I have created Website. After I login When I hit enter key for add Product, my Website just kick me out.? I dont have problem with adding my cart with mouse click. Does Any One have same Issue or Any suggestion ..
You need to add your controls inside an ASP:Panel and make your AddProduct Button as Default Button:
<asp:Panel ID="panel1" runat="server" DefaultButton="btnAddProduct"">
//Your Other Stuff
<asp:Button ID="btnAddProduct" runat="server" onclick="btnAddProduct_Click"/>
</asp:Panel>
This will Fire AddProduct Button when you hit enter.
Regards
Here is another approach I found here - if you don't want to add a panel
<asp:Button ID="btnDisableEnter" runat="server" Text=""
OnClientClick="return false;" style="display: none;" />
<form id="form1" runat="server" DefaultButton="btnDisableEnter">
If you are using Master Page in asp.net C# and if you are using a button for logout, please type in Button:
<asp:Button ID="btn" runat="server" Text="logout"
UseSubmitBehavior="false" />
Use UseSubmitBehavior="false" in your master page. That's how my problem was solved.

how to set a default 'enter' on a certain button

There is a textbox on a ContentPage. When the user presses Enter in that textbox I am trying to fire a 'Submit' button on this ContentPage. I'd like to fire off that particular button's event.
Instead, there is a search textbox & button on the top of the page from a MasterPage, and this search button's event fires off.
How do I control to fire off this ContentPage's submit button, instead of the MasterPage's search button?
I am using Ektron CMS for my content management.
The easiest way is to put the fields and button inside of a Panel and set the default button to the button you want to be activated on enter.
<asp:Panel ID="p" runat="server" DefaultButton="myButton">
<%-- Text boxes here --%>
<asp:Button ID="myButton" runat="server" />
</asp:Panel>
if you need to do it from code, use
Me.Form.DefaultButton = Me.btn.UniqueID
Where btn is your button control.
You can use the DefaultButton property on either a server-side form control or Panel control. In your case, group the controls together in a Panel that should fire off the same button:
<asp:Panel ID="SearchBox" runat="server" DefaultButton="BtnSearch">
...
<asp:Button ID="BtnSearch" runat="server" Text="Search!" />
</asp:Panel>
....
<asp:Panel ID="UserPanel" runat="server" DefaultButton="BtnUserSubmit">
...
<asp:Button ID="BtnUserSubmit" runat="server" Text="Submit" />
</asp:Panel>
You can now use UseSubmitBehavior property to disable all the buttons you don't want to fire when hitting submit (check out the documentation for more info)
<asp:Button ID="BtnNotToFIre" runat="server" Text="Search" UseSubmitBehavior="false" />
Microsoft say:
<form id="Form1"
defaultbutton="SubmitButton"
defaultfocus="TextBox1"
runat="server">
enter link description here
$(document).ready(function(){
document.getElementById("text_box_id")
.addEventListener("keyup", function(event) {
event.preventDefault();
if (event.keyCode === 13) {
document.getElementById("button_id").click();
}
});
});

How to set TargetContrlID in ModalPopupExtender with a control in a GridView

How can I set TragetContriID to a HyperLink that is inside a GridView?
I tried this :
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
PopupControlID="Panel1"
CancelControlID="btnCancel"
OnCancelScript="HideModalPopup()"
TargetControlID="GridView1$HyperLink1">
</asp:ModalPopupExtender>
But I have an error: that there is no GridView1$HyperLink1
Setting the TargetControlID of the ModalPopupExtender basically trigger the client side Show function of that ModalPopup when the control is clicked. So you need to wire up the controls yourself.
First, since the ModalPopupExtender need a TargetControlID, you should add a dummy control to link the modal popup to :
<asp:Button runat="server"
ID="HiddenTargetControlForModalPopup"
style="display:none"/>
And link the ModalPopupExtender TargetControlID to it
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
PopupControlID="Panel1"
CancelControlID="btnCancel"
OnCancelScript="HideModalPopup()"
TargetControlID="HiddenTargetControlForModalPopup">
</asp:ModalPopupExtender>
So the ModalPopupExtender now has a target that do nothing. Now we now need to do the target's job. You need a javascript function to show the ModalPopup from client side.
<script type="text/javascript">
var ModalPopup='<%= ModalPopupExtender1.ClientID %>';
function ShowModalPopup() {
// show the Popup
$find(ModalPopup).show();
}
</script>
Then you should map the OnClientClick event of the control in your gridview to this javascript function. From your code, I see that you use a asp:HyperLink, I don't think it support the OnClientClick event, so you probably need to switch it to a asp:LinkButton.
<asp:LinkButton ID="LinkButton1" runat="server"
OnClientClick="ShowModalPopup()" />

AutoPostBack on CheckBox control sometimes fails

If have the below markup.
<asp:checkbox id="chkTVLic" runat="server" text="TV Licence" oncheckedchanged="chkDocs_CheckChanged"
autopostback="true" CausesValidation="false" />
<asp:panel id="pnlTVLic" runat="server" visible="false">
<div class="toggle-item-link1 document-date">
<asp:panel id="pnlTVLicIssueDate" runat="server">
<p>
Please enter the date of issue
</p>
<div class="fm-req">
<asp:textbox id="txtTVLicIssueDate" cssclass="tb size2" runat="server" onblur="return true;"></asp:textbox>
<cc2:calendarextender id="caleTVLicIssueDate" runat="server" targetcontrolid="txtTVLicIssueDate"
popupbuttonid="ibnTVLicIssueDate" popupposition="BottomLeft" animated="true"
format="dd/MM/yyyy">
</cc2:calendarextender>
<asp:imagebutton id="ibnTVLicIssueDate" runat="server" imageurl="../images/img-calendar-day.png"
alternatetext="Calendar" tooltip="Pick Date" cssclass="date-picker" />
<asp:requiredfieldvalidator id="rfvTVLicIssueDate" CssClass="error" runat="server" controltovalidate="txtTVLicIssueDate"
display="Dynamic" errormessage="Required" setfocusonerror="true" validationgroup="TVLic"></asp:requiredfieldvalidator>
<asp:comparevalidator id="cmvTVLicIssueDate" CssClass="error" runat="server" errormessage="Not a valid date"
controltovalidate="txtTVLicIssueDate" operator="DataTypeCheck" type="Date" setfocusonerror="true"
validationgroup="TVLic" display="Dynamic" cultureinvariantvalues="true"></asp:comparevalidator>
<asp:customvalidator id="cuvTVLicIssueDate12Months" CssClass="error" runat="server" controltovalidate="txtTVLicIssueDate"
validationgroup="TVLic" display="Dynamic" onservervalidate="cuvDocIssueDate12Months_ServerValidate"
errormessage="Document must be less than 12 months old."></asp:customvalidator>
</div>
</asp:panel>
<asp:panel id="pnlTVLicApprove" runat="server">
<asp:LinkButton id="lbnTVLicApprove" runat="server" CssClass="screen-hide"
alternatetext="Confirm TV Licence" tooltip="Confirm TV Licence" Text="OK" CausesValidation="false" OnClick="lbnApproveConfirm_Click" />
<asp:imagebutton id="ibnTVLicApprove" runat="server" imageurl="../images/img-accept-doc-off.png"
alternatetext="Approve" tooltip="Approve" cssclass="approval-btn" causesvalidation="true" validationgroup="TVLic" OnMouseDown="HandleApproveClick('TVLic','lbnTVLicApprove');return false;" OnClientClick="HandleApproveClick('TVLic','lbnTVLicApprove');return false;" />
<span class="approval-label">Accept document:</span></asp:panel>
</div>
</asp:panel>
The app is written in c# but i havn't posted any actual code as all the user code related to this markup seems to work fine.
The problem is the CheckBox chkTVLic has causes validation set to false and autopostback set to true. So whatever happens when i check and uncheck the checkbox it should postback. Most of the time this is exactly what it does and the result is to show and hide pnlTVLic when it is checked and unchecked. However if any on the validators within the panel fire, the checkbox does not cause a postback the first time. It will on all subsequent times but never the first. However it should ALWAYS cause a postback. What could be stopping it. Before someone asks there is no use written client side code, everything is pure .net markup and c# code.
I don't see why it shouldn't postback when you check/uncheck the checkbox, but if the only purpose of that checkbox is to hide/unhide a panel, I would rather do it in javascript. Doing a full postback to the server just for hiding some panel seems really bad.
In javascript you can do this to hide the panel:
document.getElementById('<%=pnlTVLic.ClientID%>').display='none';
And this to show it:
document.getElementById('<%=pnlTVLic.ClientID%>').display='block';
It's going to be so much faster and better. Just put a regular checkbox instead of the ASP.NET one and subscribe to the onclick event.
Sorry, one more comment:
I think you are wrong when you say that the checkbox should ALWAYS cause a postback. No, if one of the validators fires inside the panel, the checkbox will not cause a postback until the condition is satisfied.
This is what I did and it worked.
on checkbox onclick event I disabled all the validation controls and immediately did Page_ClientValidate(); and it worked.

Resources