I have an aspx form which contains couple of textboxes, dropdownlists and checkboxes on it. I have not set the default focus on any of the control. When I open this in IE it works fine. but when the page opens in chrome it set focus on a textbox which is not the first element of the DOM. and when the page opens in FireFox, it set focus on first textbox in the DOM.
I don't want focus on any of the control, how can I fix this issue.
Can you try document.getElementById('yourElement').blur();?
You could add autofocus = false;
<input type="text" name="second" id="second" "autofocus = false" />
Take look at these links:
http://msdn.microsoft.com/en-us/library/ms178231(v=vs.100).aspx
or
http://msdn.microsoft.com/en-us/library/ms178232(v=vs.100).aspx
Maybe it can help you.
Try setting default focus on from in aspx like this:
<form id="form1" runat="server" defaultfocus="TextBox1" >
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" />
<br />
</div>
</form>
Post your code for more informations.
re: I think that you must have focus on at least one control on page. You can set dummy control like input and set it's opacity in css to 0 and set defaultfocus on it.
Related
I have a problem with the trigger of the OnCheckedChanged. When I click the checkbox (switch toggle), the OnCheckedChanged is not firing. I already tried many solutions like trigger it in JS part but no luck.
Below is the checkbox code:
<input type="checkbox" data-toggle="toggle" data-onstyle="info" data-offstyle="secondary" data-on="Ja" data-off="Nee" data-size="xs" runat="server"
oncheckedchanged="showProductFoto_CheckedChanged" AutoPostBack="true"
style="margin-top: -5px;" runat="server" id="showProductFoto" onchange="IncludeWithoutPhotos(this)" ClientIDMode="Static"/>
Well, then get the css working for the check box, and then you back to using the standard asp.net controls - and they are a pure joy to use, and easy to use.
So, say I have this check box:
<asp:CheckBox ID="CheckBox1"
runat="server" Text="Confirm to send email"
OnCheckedChanged="CheckBox1_CheckedChanged" >
We get this ugly thing:
so, I can see your motivation to want to dump that ugly above.
but, a check box gets renderd as a html input (type = checkbox), and also puts in a label for you.
So, you can style it anyway you want.
Say, like this:
<style>
.bigcheck input {width:28px;height:28px;cursor:pointer;
box-shadow: 5px 5px 5px grey}
.bigcheck label {position:absolute;margin-left:15px;margin-top:10px}
</style>
<asp:CheckBox ID="CheckBox1" CssClass="bigcheck"
runat="server" Text="Confirm to send email"
OnCheckedChanged="CheckBox1_CheckedChanged" />
And now we get this:
so, you still have quite much unlimited css you can apply against that check box.
I have a simple proof of concept web page. It uses one master page and one content page, the default one, default.aspx. I'm doing some client side debugging with alert boxes. I dragged an asp.net button onto the page and set CausesValidation = false and UseSubmitBehavior = false and yet when I click it the page submits.
What am I doing wrong?
Here is a design time code....
<asp:Button ID="Button1" runat="server" Text="Button" UseSubmitBehavior="False" CausesValidation="False" />
Here is Runtime render, wth is it putting in a PostBack?
<input type="button" name="ctl00$ContentPlaceHolder1$Button1" value="Button" onclick="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Button1','')" id="ContentPlaceHolder1_Button1" />
--Update--
Thanks Volkan Paksoy, that worked. For those who suggested HTML buttons, that worked too and that is what I used, but I was just curious why the ASP.NET button wouldn't work. It's something I should know and probably something I knew and forgot. Thanks for the help
If you need to use asp:Button and disable submit you can add OnclientClick function such as:
<asp:Button ID="Button1" runat="server"
CausesValidation="False"
OnClick="Button1_Click"
Text="Button"
UseSubmitBehavior="False"
OnClientClick="return false;" />
This should stop the postback. But you can simply use an input too of course. This is just one way of doing it.
If you want to create a button that does not submit the page/postback to the server, you could create one using raw HTML like so:
<input type="button" />
How do I put a hint/placeholder inside a asp:TextBox? When I say a hint I mean some text which disappears when the user clicks on it. Is there a way to achieve the same using html / css?
The placeholder attribute
You're looking for the placeholder attribute. Use it like any other attribute inside your ASP.net control:
<asp:textbox id="txtWithHint" placeholder="hint" runat="server"/>
Don't bother about your IDE (i.e. Visual Studio) maybe not knowing the attribute. Attributes which are not registered with ASP.net are passed through and rendered as is. So the above code (basically) renders to:
<input type="text" placeholder="hint"/>
Using placeholder in resources
A fine way of applying the hint to the control is using resources. This way you may have localized hints. Let's say you have an index.aspx file, your App_LocalResources/index.aspx.resx file contains
<data name="WithHint.placeholder">
<value>hint</value>
</data>
and your control looks like
<asp:textbox id="txtWithHint" meta:resourcekey="WithHint" runat="server"/>
the rendered result will look the same as the one in the chapter above.
Add attribute in code behind
Like any other attribute you can add the placeholder to the AttributeCollection:
txtWithHint.Attributes.Add("placeholder", "hint");
Just write like this:
<asp:TextBox ID="TextBox1" runat="server" placeholder="hi test"></asp:TextBox>
<asp:TextBox runat="server" ID="txtPassword" placeholder="Password">
This will work you might some time feel that it is not working due to Intellisence not showing placeholder
Adding placeholder attributes from code-behind:
txtFilterTerm.Attributes.Add("placeholder", "Filter" + Filter.Name);
Or
txtFilterTerm.Attributes["placeholder"] = "Filter" + Filter.Name;
Adding placeholder attributes from aspx Page
<asp:TextBox type="text" runat="server" id="txtFilterTerm" placeholder="Filter" />
Or
<input type="text" id="txtFilterTerm" placeholder="Filter"/>
asp:TextBox ID="txtName" placeholder="any text here"
I have a simple form with one text box that pass data to SQL and I want it to submit when the user hits the enter key.
In Firefox, this works great. The user puts a number hits enter gets back the results.
However in IE 8 and IE 9 this is not working.
<form id="form1" runat="server" accept="cmdclick"
style="background-position: center; background-image: url('BG.gif'); background-repeat: no-repeat;">
<div style="text-align: center">
<br /><br /> <br /><br /><br /> <br /><br /><br />
<asp:TextBox ID="txttrack" runat="server" Height="20px"
Width="175px" Wrap="False"></asp:TextBox>
<asp:Button ID="cmdclick" runat="server"
CommandName="cmdclick" BackColor="White" BorderStyle="None" />
I am not sure what would cause this. I see a lot of people using JavaScript to go around the problem however I do not know how to write JavaScript code.
How can this be done (preferably without JavaScript)?
Set the DefaultButton-Property in Form-Tag:
<form defaultbutton="cmdclick" runat="server">
You can also set the DefaultButton on ASP.NET-Panels. This might not be important in this case but
when you're using MasterPages, because the ID of a Button in a ContentPage is unknown in a MasterPage (Form-Tag is inside the Masterpage)
when you want to have more than one DefaultButton you can set different DefaultButtons to every Panel
If you have recursive form elements (which is against standards compliance) then IE will basically ignore the enter key and not submit the form when it is detected as it doesn't know which form you are trying to submit.
I have a simple form written in asp.net/C# and when trying to hit enter while in the form's input box doesn't submit the form for some reason. I had implemented a fix for a previous bug where pressing enter would merely refresh the page without submitting the form data but now pressing enter just does nothing, the fix is below:
<div style="display: none">
<input type="text" name="hiddenText" />
</div>
anybody know about a fix for this or a workaround?
I'm assuming you have a button somewhere on your page, as well as an event handler for it.
Have you tried wrapping your form (with the button) inside a Panel control and setting the default button attribute?
i.e.
<asp:Panel id="pnlMyForm" runat="server" DefaultButton="btnMyButton">
<asp:textbox id="txtInput" runat="server" />
<asp:Button id="btnMyButton" text="Submit" runat="server" />
</asp:Panel>
You can specify a default button for a form, which means hitting enter on any input control will fire that button (i.e. target the submit button). I haven't heard of this not working in any specific browser. This should eliminate your need for a workaround/hack.
<form id="form1" runat="server">
<asp:Panel ID="pnlFormContents" runat="server" DefaultButton="btnSubmit">
<!-- add some input controls as needed -->
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click"/>
</asp:Panel>
</form>
Hope this helps...
I don't remember the specifics of the rules, but most browsers have the capability of submitting forms when ENTER is pressed if conditions are met. I think it had to do with whether you had 1 or more-than-one field, or whether or not there was at least one submit button (even if you hide it). I've done it in a site I recently did, but I don't have the code handy, but I can tell you it works without any special scripting. Check this posting for more details:
http://manfred.dschini.org/2007/09/20/submit-form-on-enter-key/