I have an ASP.NET Page where in web.config I have added this setting :
<pages maintainScrollPositionOnPostBack="true">
Now in a aspx page, I have a textbox (txtTop) on top of the form & after user scrolls down (there are lot of controls in between) there is a button.
Inside this button Click event on Server, I have added this code.
txtTop.focus();
I expect that the focus should be on the textbox as well as the scroll position to be pointed towards the textbox.
but it is not happening.
The focus is there on the textbox but it is not getting shown i have to press some key to put the textbox into the scroll position.
These two properties are clashing & I am unable to resolve it.
FYI: There are no update panels..
I created a dirty hack to resolve this.Without setTimeout it was not working neither was document.ready.
$(window).load(function () {
setTimeout(function () {
document.activeElement.scrollIntoView(true);
}, 1);
});
Related
I'm using the Telerik RadSlider with jQuery 1.10.2. Currently I am capturing 2 events:
OnClientValueChanged: Fires when either the up/down arrow handles are clicked, or the drag slider is in the process of being moved.
OnClientSlideEnd: Fires when the drag slider has finished moving (but does not fire when the arrow handles are clicked).
My question is how can I detect when only the up/down arrow handles are clicked? Obviously I could just hook into the OnClientValueChanged (1st event above) and call the function hooked up to the OnClientSlideEnd (2nd event), but since I am doing calculations and saving values to the database each time the OnClientSlideEnd is triggered, it would be incredibly inefficient to do the calculations and save these values each time the slider handle is dragged.
Here is my current RadSlider setup. Please note that the handles are generated dynamically, but on inspecting the element in Chrome, it has a class of "rslHandle":
$(document).ready(function myfunction() {
$('.rslHandle, .rslHorizontal, .RadSlider').live('click', 'body', function () {
alert('arrow clicked');
});
});
<telerik:RadSlider ID="radSliderTest" runat="server" CssClass="CustomSliderLook" OnClientValueChanged="OnClientSlideChanged" OnClientSlideEnd="OnClientSlideEnd" MaximumValue="100" TrackMouseWheel="true" Width="300px" />
I've tried the outdated "live click", "on click", and just the plain ol' "click" method and none have triggered. Looking through Telerik's documentation for events on the RadSlider, I haven't been able to find anything for the arrow change events other than what is posted here. Thanks very much for your help!
Ok I found the solution. It worked by capturing the mouseup event like so:
$(".rslHandle").live('mouseup', function (e) {
alert('arrow clicked');
});
I just tried the click() jQuery way of attaching to the click event:
function pageLoad() {
$telerik.$(".rslHandle").click(function () { alert(1); });
}
which uses the Sys.Application.Load (preferred for IScriptControls like this).
or
$telerik.$(document).ready(function () {
$telerik.$(".rslHandle").click(function () { alert(1); });
});
where an anonymous function is attached in the document.ready jQuery event.
Both use the jQuery Telerik provide.
You can cascade the selectors and/or use the OnClientLoad event of the slider itself so you can know which is the HTML element where the slider is created.
I am not sure, however, why using the built-in events is not OK with you. If you need the final value, regardless of how many times the end user changes it, why not simply use the radSliderTest.SelectedValue property on the server? Ultimately, the page will be POST-ed so you can get the rest of the textboxes, dropdowns, etc., so you can use this moment to get the slider value on the server without any additional code. The slider also offers the AutoPostBack property so when the user changes the value, it can POST the page and fire the OnValueChanged server event.
I have an asp.net page with two user controls. Each of which are in separate updatepanel's One user control has three textboxes. I want to update the second updatepanel based on change of text/ focus out in first user control. How can I access both user control's textboxes, and other controls in page and update the updatepanel on change of text ?
updatepanel1
user control1
textbox1
textbox2
textbox3
updatepane2
usercontrol2
label1
Regards,
Asif Hameed
Whoa, UpdatePanels! That takes me back. Triggering UpdatePanels to "postback" asynchronously from the client has always been a bit of a kludge. The common way was to register an AsyncPostBackTrigger with a hidden button's click event and then explicitly call its click event on the client side. However, a solution with a few less layers of indirection is to call the ASP.NET AJAX library's __doPostback() JS function.
Assuming you're using jQuery (which may be far-fetched considering you're still using UpdatePanels!), you can add an event handler to the 'focusout' event of your UserControl1 to trigger the asynchronous postback of your UpdatePanel2. I would recommend putting this JS outside of one of your UpdatePanels.
$('#userControl1').on('focusout', function() {
__doPostback('UpdatePanel2UniqueId', '');
});
I dug up a good article that explains the technique of using __doPostback in a bit more detail.
Easily refresh an UpdatePanel, using JavaScript
I have 3 update panels on a page. Each of them is set to conditionally update. In each update panel I have a single button control that when clicked will populate the panel with data. Each panel is independent of one another.
Everything is working fine when you manually click each one of the 3 buttons in their respective panel. The issue I am having comes up when I use JavaScript to click the buttons. I have success when executing a single JavaScript call but when I try to click all 3 buttons with JavaScript, things behave sporadically. Depending on where I place the JavaScript calls in my code, different panels work and the others do not.
For example:
__doPostBack('btnBindTeamTicketList', '');
__doPostBack('btnBindPriorityList', '');
__doPostBack('btnSearchTemplate', '');
will show the panel that holds the 'btnSearchTemplate' button, but not the others. Different results occur when I change the sequence around.
Is there a way to click my 3 independent buttons (each in its respective panel) using JavaScript so that each panel will load as if I were clicking on them individually? I am guessing this has to do with the AJAX somehow conflicting with each other or a timing problem. Anyone point me in the right direction?
I am using ASP.NET 3.5/C#
I think you should do one postback. Put a hidden update panel in your page and put a button inside this new update panel. This button should call events
btnBindTeamTicketList_Click(null, null)
btnBindPriorityList_Click(null, null)
btnSearchTemplate_Click(null, null)
and should update the other update panels like upTeamTicketList.Update(). Now try clicking this new button.
I've got a gridview/formview, master/detail relationship going on.
When I click a button in my formview (item template), I display an ajaxcontroltoolkit modal popup.
On this popup there is a textbox (several, actually). I want to validate the data in this textbox (at least six digits, so far I'm using a regex validator) before I dismiss the popup.
The validator works, but I can still dismiss the form by clicking OK. What I'd like to do is have the ok button on the popup disabled until the data is good.
I have tried fiddling with some stuff in javascript, but I couldn't make it work, as there seems to be some issues regarding finding controls in a formview.
Any ideas?
Thanks in advance.
Without a postback
You should be able to find a control using the following technique in JavaScript:
$document.getElementById('<%=btnSubmitForm.ClientID%>').disabled = true;
If you're using RegularExpressionValidator, this forum suggests a quick (albeit hacky) way to check and see if your form is valid, without doing a postback:
http://forums.asp.net/t/1114240.aspx
With a postback
You could put the Submit button in its own UpdatePanel, if it isn't already in one, and enable/disable it in the code behind, depending on the value of the validator's IsValid property.
If you're unable to get the enable/disable functionality working, you could simply keep the modal open, so the user can't close it until they enter valid inputs or click Cancel:
protected void BtnSubmitClick(object sender, EventArgs e)
{
if (!regexValidator.IsValid)
{
modalPopupExtender.Show();
}
}
I have a master template that all the pages on my site use. In the template there is an empty panel. In the code-behind for the page an imagebutton is created in the panel dynamically in my Page_Load section (makes a call to the DB to determine which button should appear via my controller).
On some pages that use this template and have forms on them, pressing the Enter key fires the click event on this imagebutton rather than the submit button in the form. Is there a simple way to prevent the imagebutton click event from firing unless it's clicked by the mouse? I'm thinking a javascript method is a hack, especially since the button doesn't even exist in the master template until the button is dynamically created on Page_Load (this is ugly since I can't simply do <% =btnName.ClientId %> to refer to the button's name in my aspx page).
I tried setting a super-high tabindex for the image button and that did nothing. Also set the button to be the DefaultButton in its panel on the master template but that did not work either. Moreover, I don't want to add a property to all of my pages that use this template (there are hundreds). It would be optimal to find a solution that works globally from my master template.
I'll try to show our example here:
We have a button on the top of each page in our system that lets you star the page as one of your favorites, sort of a server-side bookmark system. When the page loads it looks to see if the page is one of your favorites or not and then shows a gold star if it is, and a gray star if it is not. Clicking the imagebutton of a star toggles the page favorite status.
In my master template (FullMenu.master) I have this panel
<asp:Panel runat="server" ID="pnlFavorite" style="display:inline;"></asp:Panel>
Next there is a class which creates the button and adds it to the panel on the master template:
public void InsertStarButton()
{
CreateStarButton();
pnl.Controls.Add(bright);
}
and
private void CreateStarButton()
{
bright = new ImageButton();
bright.ImageUrl = "~/resources/images/star.png";
bright.Height = new Unit(12, UnitType.Pixel);
bright.ID = "btnStar";
}
What I tried earlier, that didn't work, was in InsertStarButton() I added a line pnl.DefaultButton = "btnStar" but that didn't change anything on the page. Even if I had the cursor blinking inside a text box in the form on the page the star button would fire its click event if the Enter key was pressed.
http://weblogs.asp.net/scottgu/archive/2005/08/04/421647.aspx
Pressing ENTER on a single-line textbox on a form will submit the form. That's how it works.