I've got a textbox being used to enter a password inside a wizard control. I'm trying to get a password strength meter working with it.
Unfortunately, the password box isn't visible until step 4 and this means that I can't register the event handler onload() and putting some JS next to the PW box to register the event handler doesn't seem to fire. I'm guessing this is due to the contents of the wizard being loaded through an AJAX postback
Can someone please suggest how I can register the event handler? many thanks...
function CheckCustomJSHandlers() {
if (document.getElementById('<%=Password1.ClientID %>')) {
document.getElementById('<%=Password1.ClientID %>').onkeyup = CheckPasswordStrength;
}
}
Add this to your JavaScript:
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(CheckCustomJSHandlers);
Related
i have a textbox on a page, now whenever any age number is entered in that page, that page should be loaded in my datalist, i have created rest of the thing, but i am not getting how to trigger the textbox onkeydown event from asp.net, i know working with that from javascript, but the problem is i have below things done in that function:
it applies the currentpage value to the static variable from textbox
it binds the datalist
it enable disable the next previous buttons accordingly
and i dont think this i can do from javascript, anyone have any resolution, how this could be achieved from server side, onkeydown event
You can capture the keydown event in a javascript function then do a AJAX call to the server. If this does not suit you, then you could try manually do postback in javascript.
So in your textbox:
mytextBox.Attributes.Add("onkeydown", "return doDataListBind()");
Now in the javascript function:
function doDataListBind()
{
__doPostBack("myTextBox"); // etc, etc
// some other code here...
}
More info can be found here:
http://geekswithblogs.net/mnf/archive/2005/11/04/59081.aspx
http://www.asp.net/ajaxlibrary/AjaxControlToolkitSampleSite/
Try looking into or using either:
AJAX Control Toolkit, or
JQuery Autocomplete Plugin
Alternatively you could try to call _postback() function from a client side event/function for your textbox in javascript
I have a child aspx page in an iFrame. There are a few textboxes, which are populated in the page load event.
There is also a LinkButton which the user clicks when s/he is finished editing the fields. There are some javascript functions and other things going on, so a full postback (ie: asp button) is out of the question.
Problem is, I need to reference the textboxes NEW values (user changes) after the linkbutton is clicked.
Is there any way to do this?
Thanks,
Jason
EDIT:
After playing with the interface a bit further, I realized the Page_Load event was firing as soon as the LinkButton was clicked. Of course this is where the data is initially loaded, so any changes the user made is immediately written over. Current plan of attack is to create an IsLoaded cookie value and check if true before the mentioned code executes. If anybody has a better idea, please let me know!
Thanks,
Jason
You can use jQuery to grab the textbox value on click of the button.
<script type="text/javascript">
$(document).ready(function() {
$('.btnSubmit').click(function(e) {
alert($("#txtName").val());
});
});
Then you may pass this textbox value to a server side method by calling it using jQuery AJAX. See the link below .
http://weblogs.asp.net/karan/archive/2010/09/12/calling-server-side-method-using-jquery-ajax.aspx
You want to access the new textbox values from the parent or from within iframe which has that webform opened?
Now I could be going about this the wrong way so if there is a better solution please post that as well. What I am trying to do is disable a button once it is clicked to prevent double clicks. In the past I have done my just disabling the button onclick but with webforms I am running into a little bit of a snag because there is validation on the page so I need that to fire and I need to post back.
So I have the following JQuery function to make a button disable itself on click. Here is the JQuery:
jQuery.fn.disableOnClick =
function()
{
return this.each(function()
{
$(this).click(function()
{
$(this).attr('disabled', 'disabled');
return true;
})
})
};
Intended usage would be:
$(document).ready(function()
{
$("#<%= btnSomeButton.ClientID %>").disableOnClick ();
});
This doesn't work... the button always disables, the validation is ignored and the postback doesn't even happen. I would assume because I am overwrittin the click handler. Suggestions?
UPDATE: I have tried just a basic function that is connected to the 'OnClientClick' of the button to do:
// In my Page_Load
btnSomeButton.OnClientClick = "return DisableButton('" + btnSomeButton.ClientID + "');";
// Javascript function
function DisableButton(id)
{
var bButton = $("#" + id);
if (Page_ClientValidate())
{
$("#" + id).attr('disabled', 'disabled');
__doPostBack(id, '');
}
}
This works as expected in a non master page setup but when I try to use it with a page that has a master page, the postback occurs and the Page_Load fires but the button click handler never gets called. It's like the __doPostBack is not sending which control event to fire correctly.
Any suggestions for changes or even a whole different approach?
One idea for a different approach (disclaimer: this is not a fully baked solution) is to go from the submit action of the form instead of the click handler of the button.
The validation all happens through the submit handler of the form. If everything checks out, the form is allowed to submit. If you could hook into that process, then when the form started to submit for real, you could find all buttons with the class DisableOnSubmit and disable them.
Validation could take some time, however, and some people (annoyingly) seem to like to double-click on web forms, so it might be best to blend the approaches. Disable the button immediately with a click handler, then if validation fails, re-enable the buttons that were disabled.
EDIT In response to comments
This description could be turned to be more like the signature in the question (where any button could be made to be click-once regardless of its CSS classes).
Create a jQuery extender where the buttons that fit the selector are given an onClick handler and (if not already done) the hook is added to the validation being complete. The onClick handler adds the clicked button to a collection of "currently in click evaluation" buttons. If validation succeeds, the form submits normally. If validation fails, the buttons in the collection are re-enabled and removed from the collection.
For the evil update panels, you might want to look into specifying these events with live bindings (used to be a plugin, but I think it's now part of the jQuery core depending on which version you're using) so that the event handlers are reregistered when the partial postbacks complete.
I get the feeling you can use GetPostBackEventReference to do the actual postback once you've done your validation dance.
Edit Oops, forgot the other half of the answer :-)
As for the double postback, I've used Postback Ritalin by Dave Ward in the past to curtail those pesky hyperactive users.
Add this to your startup code (ready event handler):
var elemButton = $('#<%= Button1.ClientID %>');
var fnExistingHandler = elemButton[0].onclick;
elemButton[0].onclick = function()
{
fnExistingHandler();
if (!Page_BlockSubmit)
{
$(this)
.hide()
.after('<input type="button" value="Please Wait..." disabled="disabled" />');
}
};
Basically you append new code to existing click handler. Note checking global variable Page_BlockSubmit.
Instead of disabling submit button you can hide it and immediately insert disabled button in its place. Because this happens very quickly it will look as button becoming disabled to the user. Details are at the blog of Josh Stodola.
Edit: fixed client validation.
Haven't tried it but what about something like this:
$("input[type=submit]").live("click", function() {
$(this).hide().clone().insertAfter(this).show().attr("disabled", "disabled").val("Please wait...");
return true;
});
This will ensure a submit button isn't disabled which ASP.NET doesn't like.
I have 3rd party user control (a captcha control), which has a captcha image, a text box within it.
I am using the above user control in my webpage. I have a 3 submit buttons on my webpage (Validate Captcha, Submit Page, Add User). When I click the Validate Captcha submit button using the mouse, I am validating whether captcha is empty and showing a javascript alert.
The problem comes when I enter the valid captcha text in the textbox and hit enter key when the cursor is in the textbox. The page just refreshes. I am unable to add keypress event to textbox and call Validate Captcha button event as I am using the 3rd party user control which I cannot modify.
Also, Page.ClientScript.RegisterHiddenField(...) will not work in my case as I have two other submit button inside the same page.
Only option left is to enclose these in panels and set default button.
Please let me know if anyone has any better options for achieving this.
Greetings! I too use alot of third party controls. The thing to remember about these controls, it that in the end they just emit HTML. This means you can use the DOM to access and attach event handlers such as onKeyPress. The trick is to identify how your control creator named the control you are looking for, in this case a {textbox}. The easiest way to achieve this is to simply run the page and view the page source. It is there that you can find the name as it is rendered and sent to the browser, after that all you have to do us use document.getElementByID to get the object and setup your handler
Example:
<script>
//Place this AFTER your textbox control is declared in the HTML
//Get the textbox
var textbox = document.getElementById('nameOfRenderedControlHere');
//Assign the event handler and function you want it to call
textbox.onclick = function() { validateCaptcha(); };
function validateCaptcha()
{ //Do your Stuff here }
</script>
That should be it..havent tested, let me knwo if you run into questions.
Put the captcha in its own <asp:Panel> and add a DefaultButton property for the panel with the ID of the captcha's submit button.
I have a user control that has several buttons.
On page_load, I want to run a method unless a specific button was pressed.
When I check the sender on page_load inside the user control, I just get the name of the user control and not the button itself.
Is there a way that I can determine what button was pressed on page_load? Otherwise I will have to come up with some hacky method to solve the issue.
I think you can check Request.Form ("__EVENTTARGET") - that should contain the ClientID of your control.
This refers to the value of a hidden field the ASP.NET event handling framework uses to keep track of what the user clicked. When the user triggers a post-back, some JavaScript on the page sets this hidden field to the ClientID of the control you clicked before submitting the form.
Can you create a property in your user control to return the clicked button (or set a flag or whatever), an set it in each button's click event inside the user control?
Are you sure you're handling the page model correctly? The Page Load event happens (to build the server side object model), then your control is going to handle the button click event bound to the control.
Page Load can come for any number of postback reasons besides buttons in your user control being clicked.
What about buttons in other controls on the page?
There's sometimes good reasons to do this, but I also I worry that you're just hacking around the ASP.NET page model.
Here's a simple way to check if a specific button was pressed:
protected bool isButtonClicked(string buttonName)
{
bool isClicked = false;
foreach (string ctl in this.Request.Form)
{
if (ctl.EndsWith(buttonName))
{
isButtonClicked = true;
break;
}
}
return isClicked;
}