I am working on an asp page that verifies information in a text box after the user types it in.
A “product number” is manually entered (free form). Using the after update event, I have the page post the data and lookup the product number to determine if it is valid. If not valid an error message is posted in the box, otherwise the product number and description is placed in the box (I.E X1234 becomes X1234 – RED YO-YO). This works 100% fine. My problem is that after the update the focus is lost on all the data entry items. I want the focus to be returned to the next text box so the operator can type in the next piece of needed information.
Note: So far I inserted a function that dynamically changes the “TABSTOP” numbering such that the “next” box is assigned the #1 after the validation lookup. This works on my browser (Firefox 3.05) but is does not on my IE (Thanks Bill ! ). In IE when the posting is finished the focus for some reason ends up on the “enter the URL” and hitting tab puts the focus on some control button that is no where near where I want it to be.
If you are trying to do what I think you are, this should do it.
In your ASPX page:
<script type="text/javascript">
function focusControl(ctrlId) {
document.getElementById(ctrlId).focus();
}
</script>
In your code-behind:
// 'ctrl' is the name of the ASP.NET TextBox that you want to receive
// focus on load.
Page.ClientScript.RegisterStartupScript(
typeof(Page),
"Focuser",
"focusControl('" + ctrl.ClientID + "');",
true);
Here is the general solution:
http://couldbedone.blogspot.com/2007/08/restoring-lost-focus-in-update-panel.html
Related
I'm quite new to VBA and I've been looking around but cannot seem to find a solution to my problem.
I have made a navigation form (frmNavigation) with 3 buttons, each referring to a different form, let's call them frm1, frm2 and frm3. In the navigationform the control buttons to switch between tabs are all named differently (btn1, btn2, btn3), but the subform that shows either frm1, frm2, or frm3 has the same name: “NavigationSubform” (this shows a different form depending on which tab is clicked on, based on the 'navagation target name' referring to frm1, frm2 and frm3).
When I want to refer to a textbox (txtBox1) on form 1 (first tab) and insert a value i can do this by:
Forms!frmNavigation!NavigationSubform.Form!txtBox1.Value = "insert awesome text"
But how would I refer to txtbox10 on the second tab (frm2)? Just using the following does not work:
Forms!frmNavigation!NavigationSubform.Form!txtBox10.Value
You then get the error 2465 (can't find the field).
I’ve been trying many different things, but can’t seem to get it right. So how do I refer to a textbox on a different tab than the first one?
Help us much appreciated!
Only one subform can be loaded at once. So you've just got to break this process into two steps.
Store the value from txtBox1 somewhere outside of the NavigationSubforms (a textbox on the parent form with visible = no, a global variable or a table works).
In frm2's On Load event, set txtbox10 to be the value you stored.
Just note, that you will need to add conditions in the On Load event if you want to avoid that textbox being set to an empty string or a wrong value if you have a setup where your filter is changing.
I have two buttons - Company Email and Non Company Email.
If i select the first , ng-click="flag='Y'" and the second one renders the flag value as 'N'
So now I am trying to disable them when they are selected so user is not allowed to click on the second time, the second click is creating some UI issues which I want to avoid here.
But the ng-disabled is not working at all as expected, it disables from the outlook but we can still click the button and it behaves strangely.
Pleas help-
Code block is added in comments
This seems like a simple enough issue where you would disabled the buttons using a scope variable set once a button is clicked.
<button ng-disabled="flag=='Y'" ng-click="doCompany()">Company Email</button>
Here is an example
Take a look at this login page, specifically, the form in the section labeled Returning Members. As you can verify by looking at the HTML or by digging with a tool such as Firebug, the actual form contains four tags: one each for the email address and password, an invisible input called "memberAlready" that contains the value "yes", and a submit button in the form an image. So far, perfectly generic.
However, if you inspect the form data at the point at which the form is submitted (using Tamper Data or its equivalent on another browser, you'll see that two additional form fields have been sneaked into the response: ACTION(loginCheckout).x and ACTION(loginCheckout).y.
They both have two-digit integer values, which suggests that they're only there to verify that the submitter is an actual web browser and not a robot. Presumably, they are related somehow to the submit button, which is defined as follows:
<input type="image" name="ACTION(loginCheckout)" value="Login" src="/images/login/login.gif">
What's confusing to me is that these extra form fields appear even when JavaScript is disabled in the browser. So they presumably aren't just something inserted by an event handler somewhere.
Furthermore, if you submit the form programmatically (e.g., by running document.forms[1].submit() in the JavaScript console), the extra fields are not generated and the login attempt fails. That suggests to me that the insertion of the fields depends on something outside the basic HTML form submission mechanism. But what that "thing" could be if it's not JavaScript, I don't know.
Does anyone recognize this pattern or have a theory as to how the validation fields are inserted?
Take a look at the code you posted here:
<input type="image" name="ACTION(loginCheckout)" value="Login" src="/images/login/login.gif">
Notice that this is an image input type which is used to submit the login form. The additional values that appear to be injected on submission are simply the x and y coordinates where the you clicked on the image to submit the form. They are not additional values which are injected by JavaScript on form submission, they are added by the browser itself.
Try clicking on different areas of the images and see the values change.
When you use JavaScript to submit the form, you do not click on the image, which is why the x and y values are not included on form submission.
Replacing the image for an <input type="submit" /> element will remove the x and y coordinates.
Hope that helps.
The X and Y values you are seeing are because the submit button is an an input type=image. They correspond to the X and Y locations within the image where the cursor was when the image was clicked. They're added by the browser itself, as the HTML specification requires it. Section 17.4.1 states that for an image input type
When a pointing device is used to click on the image, the form is submitted and the click coordinates passed to the server. The x value is measured in pixels from the left of the image, and the y value in pixels from the top of the image. The submitted data includes name.x=x-value and name.y=y-value where "name" is the value of the name attribute, and x-value and y-value are the x and y coordinate values, respectively.
You'll note it only mentions the use of a pointing device. If you submit by using the keyboard the values won't be created.
My ASP.NET MVC 3 website has code on the server side that checks for the name of the submit button clicked to submit the form. The code works when I use the mouse to click the button, but when I use the Enter key, the form gets posted, but the request doesn't contain the name of the submit button.
Is there some attribute I can set on the submit button to get this to work for both clicking and using the Enter key?
Here is my HTML:
<div>Search:</div>
<form action="/Item/Search" method="post">
<input class="fulltextsearch" id="FTSearchText" name="FTSearchText" type="text" value="" />
<input type="submit" value="Go" name="FTSearchButton" />
</form>
</div>
On the server side, I have a custom model binder that uses the following code to determine if the user clicked the submit button.
// See if the value provider has the required prefix
var hasPrefix = bindingContext.ValueProvider.ContainsPrefix(bindingContext.ModelName);
var searchPrefix = (hasPrefix) ? bindingContext.ModelName + "." : string.Empty;
var searchButton = GetValue(bindingContext, searchPrefix, "FTSearchButton");
// If this value doesn't have value, the user didn't click the button so exit
if (string.IsNullOrEmpty(searchButton)) {
return null;
}
private static string GetValue(ModelBindingContext context, string prefix, string key) {
var result = context.ValueProvider.GetValue(prefix + key);
return result == null ? null : result.AttemptedValue;
}
Here is the problem I'm having with this. I have a page that displays a list of items. I have a 'search' textbox and a submit button in an HTML form. When the user enters text in the textbox and clicks the search button or uses the enter key, the page posts the form data via HTML GET, and returns the first eight records found. The page then displays page links for additional pages. The problems is that when the user clicks a page link, the form data is all blank, and my filter information is lost (the form isn't posted with the form value when using these links). So, I end up displaying a blank list of items (blank searches returns zero results) instead of paging the data.
By adding the check for the button name in my form data, I could determine whether or not to simply page the data, or do a new look up.
I wouldn't rely on this. There are plenty of documented bugs with this scenario. Just add a hidden field with name='submit'. That way it wouldn't be too hard to recode the backend.
<input type='hidden' name='submit' value='FTSearchButton'/>
So, I researched this last night and almost got somewhere. Then this morning, I really did get somewhere and here's where I ended up.
Apparently the W3C standards for form submission are pretty lax when describing the functionality as it relates to the Enter button and submitting forms. It seems they determined that
When there is only one single-line text input field in a form, the user agent should accept Enter in that field as a request to submit the form.
So that leaves a lot of wiggle room for the browser makers. Today, virtually all browsers support using the Enter key to submit a form, whether the form contains one or more single line text input boxes.
The problem I'm having is more or less unique to Internet Explorer, and only when the form contains one, single-line text input control. For whatever reason, Microsoft decided that when Internet Explorer submits a form like this, it doesn't include the submit button's name/value pair in the post body. However, it does include the button's name/value pair if the user clicks the submit button --or-- uses the Enter key, and the form contains more than one single-line text input control.
So, the only solution I can think of or find suggested is to add a second single-line text input to my form, and then set the the style to
visibility: hidden; display: none;
My form now has two single-line text input controls, so the form will post with the name/value pair in the form body, regardless of whether or not the user used the Enter key or clicked the submit button.
So, we have a workaround that was discovered by ASP.NET developers. It seems the key/value pair is required by ASP.NET web-forms to fire the click event, so this work around isn't something new, albeit not my favorite way to do things.
This question is somehow similar to this one.
I have a form in my ecommerce solution. When you insert something into the cart, you can change number of items. The cart is whole in one form. The form has two submit buttons - recalcualte and continue (which will take buyer to Step 2 of the process).
When user changes the number of items using the inputs, he can either hit recalculate (which sends post to app that will change the numbers in session/db) or continue (that will also send the post data to recalculate and then take user to the step 2).
But when user hits enter, the recalculate button takes precedence.
What I want is to make the recalculate button submit the form, but ONLY when clicked and NOT when submited by pressing enter. In contrast the "continue" button should work also with enter.
The solution MUST NOT use javascript as the frontend has to be useable without JS enabled.
Any ideas?
Put the button that takes precedence first in your html sourcecode, and use markup to invert the position of the two buttons?
Edit: you say your layout can't handle that.
Either:
1. Change the layout. Functionality is more important, and for layout there is more than one way to do it.
2. Have the form not check if "recalculate" or "submit" was pressed, but rather if the shown price was correct with the calculated prize. Example:
User buys 1 item, value 3 dollar.
User buys 2 items, value 5 dollar.
Total prize: 13 dollar.
User now changes the 1 item into 4 items. 3 dollar becomes 12 dollar, but he doesn't hit recalculate.
Have a field in your form that shows the total amount (a hidden field is nicest). When the user submits the form, redo the calculation. If the calculated prize equals the prize in the hidden field, the user knew the final correct prize. If it differs, reshow the form mentioning "You changed your shopping cart, the total prize has been updated to reflect these changes. Verify the amount and submit to purchase" or something.
<input type="text" id="mytext" ... />
<script type="text/javascript">
document.getElementById("mytext").onkeyup = function(event) {
if(event.keyCode=='13' || event.keyCode=='10') {
alert('you pressed enter');
// do whatever you want when enter is detected
}
}
</script>
You should be able to decide that server-side. When a button is clicked it's name-value pair is submitted, but when return is pressed it isn't. So change your server-side script to do "recalculate" when the recalculate name-value is submitted and to contine in all other cases.