Develop Reference

How to place the cursor at the start of ASP.NET textbox on getting the focus?

I am fairly new to ASP, FYI. The textbox in question is for phone numbers, and I am using an Ajax MaskedEditExtender to create an input mask in the form "()-___".
What is the issue now
The input mask works fine, but when the user clicks into the box, the cursor just sits at whatever position they clicked at, in the middle of the input mask or wherever.
What I need
I need the cursor to be automatically positioned at the beginning (first character) of the textbox when the user clicks into it. I am very familiar with how to do this in VBA using a GotFocus event. But there doesn't seem to be an event to handle this in ASP. Is there JavaScript or some kind of setting I am missing? I have searched but haven't been able to find anything to address this exactly.
I have included a link to a picture of what I am talking about, gotta earn some rep before I can embed...Thanks in advance!

You can set focus to your first textbox with JQuery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var myFirstTextBox = $("#MyFirstTextBoxIdHere");
$("myFirstTextBox ").focus();
});
</script>
This will autofocus on page load to your first textbox.

Try this out
<asp:TextBox runat="server" ID="txtMyBox" onFocus="setCursorToStart(this)"></asp:TextBox>
function setCursorToStart(x) {
setTimeout(function() {
x.setSelectionRange(0, 0);
}, 0);
}

how to scroll to a position in a page by clicking on link

Hi coder i am new to jquery. i serach alot but fail to find this what i am looking is not a customize application, i just want process or method how we can achieve this.
Suppose i have a menu or link like below
Home
About
Contact
As a link or menu and when i click on that any of the link or menu i srcoll down to position of the page where details for it present..
Just like This link where click on the above menu scroll to the
position of it on the page
This should be a single page application.
Any idea's or tutorial for this i want to do it jquery.
I can use scrollup(), scroll(), animate() but how to proceed this that is the main concren any help would be appreciated.

Are you by any chance talking about HTML anchors?
http://www.echoecho.com/htmllinks08.htm

This is the best link for your solution
Single Page Site with Smooth Scrolling, Highlighted Link, and Fixed Navigation
In this link you get how to stick your menu using this
$(window).scroll(function () {
var window_top = $(window).scrollTop()+12; // the "12" should equal the margin-top value for nav.stick
var div_top = $('#nav-anchor').offset().top;
if (window_top > div_top) {
$('nav').addClass('stick');
} else {
$('nav').removeClass('stick');
}
});
use scrollto.js file to scroll through the page and call it in that function for smooth scrolling
$("nav a").click(function (evn) {
evn.preventDefault();
$('html,body').scrollTo(this.hash, this.hash);
});
I hope this will help you

$('html,body').animate({scrollTop: $('#scrollToId').offset().top});
Check this solution jQuery scroll to element

KENDO ui menU IE9 issue

I am using KEndo UI in asp.net mvc website and menu is working fine in all the browsers except IE 9.0 . I am using float: right but when i open the page on IE 9 and move my mouse over the menu then it moves from right to left
But it should be like this
Mt CSS
.float-right-menu {
float: right;
}

You may need some kind of css reset for those kind issues

Welcome to IE :( If I remember correctly, IE9 has an odd rendering bug where if your floated element doesn't have a width specified in CSS, then it decides to make it 100% width (like a non-floated div would be).
I think to fix it you have to give it a width in CSS. Unfortunately, that is hard to do unless you know the actual width of the menu. But, try setting it to something like "width: 300px;" just to see if it fixes the issue.

You can use something like that
<script type="text/javascript">
function SetMenuWidth()
{
var menu = $('#MenuName');
menu.width(menu.width());
}
$(document).ready(function () {
SetMenuWidth();
});
</script>

Is there a way to not refresh the iframe each time i change tabs?

I have jquery tabs on my page, each tab has a single iframe in it. Everything works, except...
The iframes refresh each time I switch tabs.
The source for the Iframes is set in the Page_Load and is only executed once. The jquery does not do anything except change the tab...no other code.
Is there a way to not refresh the iframe each time?

This is why I never want to ask anything on this site...I know it's gonna be something simple, but for anyone that may be helped in the future from my pain...
In the code for the jquery tabs to select or hide tabs, I had a call to a button click event that was used to keep track of the current state of the tabs. This is what caused the postback and why my iframes were getting reinstantiated.
$(function () {
$("#tabs").tabs({
select: function (event, ui) {
var sel = ui.index;
$("[id*=SelectedTab]").val(sel);
$("[id*=ChangeTabButton]").click();
},
selected: $("[id*=SelectedTab]").val()
});
});
Thanks Kevin and Vishal...

Auto Scroll to bottom of page

I have a codebehind file, in which it does a:
Response.Redirect(Request.RawUrl);
after i have updated something in the database.
(when a comment for the topic is stored)
I wish to make the page autoscroll, to the bottom at the page, when the response is triggered.
Can someone please tell me how?

Scrolling to the bottom of the page can be done by using javascript. Below is the javascript code to do the same. Please place the below code at the end of the page before body tag ending.
<script>
window.scrollTo(0, document.body.clientHeight);
</script>

What about adding an anchor to the new comment.
<a name="NewComment">The comment</a>
Then let your redirect point to that anchor
Response.Redirect(Request.RawUrl + "#NewComment");
That should make your browser scroll to that anchor

Scrolling to the bottom of the page is client side not server side. C# is server side. In order to scroll you will have to add some javascript to the page to do it for you.
Typically, this is implemented as follows, a javascript routine is written that looks at the URL. If there is some specific information in the url (eg &scroll2bottom=true) then the javascript performs that action. This will also let you scroll to a specific page element.

I use this function, maybe it is useful for you. It works with coordinates
and delay seconds for scroll. Trying with different coordinates will make the scroll
stop where you want.
Declare this function in your js
function WindowsScrollTopAnimado(coordinate,miliseconds) {
$('html, body').animate({scrollTop:coordinate}, miliseconds);
}
Call it from server side when needed:
Private Sub ScrollToElement()
Dim Cadena = "<script type='text/javascript'>"
Cadena += "WindowsScrollTopAnimado( " & 1350 & "," & 1800 & ");"
Cadena += " </script>"
ScriptManager.RegisterStartupScript(Me.Page, Me.Page.GetType, "ScrollToControl", Cadena, False)
End Sub

I would insert an anchor into the HTML at the point you want to scroll to (this can be permanently in the code at the bottom, or inserted dynamically at the target point), and then redirect to yoururl.html#anchor
Unfortunately that's not very HTML5/Web2.0, the new modern way appears to be here: http://dev.w3.org/html5/spec/single-page.html#scroll-to-fragid

I've had some fun with this. A simple code-behind way I use is to put focus on the last element on the screen such as an empty label.
E.g.
lblMyEmptyLabel.Focus();
Of course, this doesn't smoothly scroll the window, it pretty much "teleports" you there.
Sometimes the above doesn't work (when using bootstrap modals for example) in which case the following javascript works for me:
<script type="text/javascript">
function openModal() {
document.getElementById('myElement').scrollIntoView(true);
$('#myModal').modal('show');
}
</script>
If you're using an asp element (eg a textbox) to scroll to, don't forget to add the clientidmode="static" part to the tag so the ID isn't altered on the client.