I'm having some real problems with a group of HTML Radiobuttons when I try to pass the selected values back and forth between JavaScript and ASP.NET.
<input type="radio" id="radio1" name="markerSel" value="1" checked=true />
<input type="radio" id="radio2" name="markerSel" value="2" />
<input type="radio" id="radio3" name="markerSel" value="3" />
To begin with, the form loads with these radiobuttons and a user selects a value and submits the ASP.NET form. To get the value of the selected option on the server-side I have tried;
string selVal = Request.Form["markerSel"];
//always returns "1", regardless of the selection made.
And also tried ASP.NET's FindControl method (recursively too), and I just get null.
I want to be able to set the value of this radiobutton group via JavaScript and Asp.NET and be able to read from both environments.
Any help would be appreciated.
Thanks
Is there a reason why you don't use ASP.NET radio buttons instead of <input type=radio />?
If you use
<asp:RadioButton id="radio1" runat="server" Checked="true" />
<asp:RadioButton id="radio2" runat="server" />
<asp:RadioButton id="radio3" runat="server" />
You will be able to access them server-side by doing this.radio1.Checked
If you want to access your elements via javascript, you can do a document.getElementById('radio1') and you will get the DOM element that way.
If you want to use jQuery, you can access the radio buttons with
$('#radio1')
If you want to test if the radio button is checked, you can use
if ($("#radio1").is(':checked')) {//...
hmmm... I would try changing the line to:
string selVal = Request.Form("markerSel");
Related
I have an ASPX that has a repeater. Inside the repeater is a text box with a JQuery datepicker attached to it. The text box's ID is static, so it is the same for all of those items within the repeater. However, when I make a change to the second or subsequent repeater item's date box using a datepicker, it changes the first item's date box and leaves the one actually attached to the selected datepicker alone.
Other than the obvious solution of "don't define items with the same ID," which results in another problem that will probably end up in another question, is there a way to fix this problem?
This example
<asp:Repeater runat="server"
ID="rptWhatever"
ClientIDMode="Predictable">
<ItemTemplate>
<asp:TextBox runat="server"
ID="tbxWhoCares"
CssClass="ImaDatePicker">
</asp:TextBox>
</ItemTemplate>
</asp:Repeater>
Will render the textbox to something like:
<input id="tbxWhoCares" type="text" class="ImaDatePicker"/>
So regardless of the id you should be able to do this in your script:
$(".ImaDatePicker").datepicker();
The problem with non-unique ID's is a big one but should be an easy fix if you set the attributes in the Repeater to ClientIDMode="Predictable" and leave the same attribute in the TextBox to its default.
Update
It seems jquery UI datepicker requires a unique id.
So you can select multiple inputs using a common css class but the id's must be unique otherwise you run into that problem.
It shouldn't work that way...but it does.
Alternatively you could just use the native <input type="date" ... />
$(function() {
$(".ImaDatePicker").datepicker();
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/themes/base/theme.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/themes/base/jquery-ui.min.css" rel="stylesheet"/><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script>
<input id="tbxWhoCares" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares" type="text" class="ImaDatePicker" />
<br><br><br>
<input id="tbxWhoCares_1" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares_2" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares_3" type="text" class="ImaDatePicker" />
I know this has been working for me in the past, but my attempt to set the value of my radiobutton is ignored and the value is set to the ID of my radio button.
ASP.Net
<asp:RadioButton ID="rb" runat="server" />
Code behind
//Test 1
rb.InputAttributes.Add("value", "foo");
//Test 2
rb.InputAttributes["value"] = "foo";
HTML output
<input id="rb" type="radio" name="rb" value="rb" />
What am I missing here?
Setting the value in ASP.Net markup is working, but I rather do this from codebehind.
You can simple do:
rb.Attributes.Add("value", "foo");
HTML output:
<input id="ContentPlaceHolder1_rb" type="radio" name="ctl00$ContentPlaceHolder1$rb" value="foo">
Code behind :
rb.Attributes.Add("value", "RadioButton");
Output
<input id="rb" type="radio" name="rb" value="RadioButton" />
Reference:
Set HTML Attributes for Controls in ASP.NET Web Pages
I have a form with 2 Text Boxes (along with other controls). Both of them have TextChanged Event. I'm using Tab Key to go from one Control to another.
After entering some value in the first TextBox and then pressing Tab, the focus is not going to Second TextBox.
I'm using TextBox2.Focus();
But this is not working.
Your Code is not useful for me. My TextBox does have OnTextChanged Event. I implemented TabIndex, but this is not working after PostBack.
Why to do server side code when you can handle it with plain html property tabindex
Plain Html Code
<span>2</span><input type='text' tabindex="1" /><br/>
<span>1</span><input type='text' tabindex="3" /><br/>
<span>3</span><input type='text' tabindex="4" /><br/>
<span>4</span><input type='text' tabindex="2" /><br/>
ASP.NET Code
<asp:TextBox ID="txtField1" runat="server" tabindex="1" />
<asp:TextBox ID="txtField2" runat="server" tabindex="2" />
For working demo see here
I have the following html:
<html>
<body>
<form runat="server">
Name: <input type="text" name="name" />
<br />
<input type="submit" name="submit" />
</form>
</body>
</html>
How do I retrieve the value in the "name" textbox posted back to the webserver to manipulate in ASP.NET WebForms?
(I know about the ASP.NET built-in controls and the possibilities with them, but I am looking for a "clean" solution without the use of built-in ASP.NET controls)
If you can't, or don't want to use asp.net textboxes, then you can retrieve the name of a regular html textbox like this:
string nameTextPosted = Request.Form["name"];
Just note that textboxes created in this manner will not automatically persist their values across postbacks like asp.net textboxes will.
Simplest solution would be to turn it into a server-side component and access it by it's name. e.g.
<asp:TextBox Id="Name" runat="server"></asp:TextBox>
...
string name = Name.Text;
Unless you have other reasons not to use a component, you'd only be making things much more difficult on your part for no justification.
ASP.net includes Html server controls for backward compatibility for just someone like you fond of html. make your html tags server controls by adding the runat="server" and id properties and you are able to access them inside your server side code with their id.
<form runat="server">
Name: <input type="text" name="name" id="name" runat="server" />
<br />
<input type="submit" name="submit" id="name1" runat="server" />
</form>
Now after this you can control their behavior:
name.Value="Hellow World !"
You have to add id and runat="server" in each control. like this :
<input type="text" name="name" id="name" runat="server" />
Its better to use asp:TextBox like this :
<asp:TextBox ID="name" runat="server"></asp:TextBox>
I got a request to add this form to a asp.net control.
I want to use asp.net text box and button to submit the info to the form. (because I have special controls to match the look and feel).
this is the form:
<form name="ccoptin" id="signup" action="http://visitor.r20.constantcontact.com/d.jsp"
target="_blank" method="post">
<input type="hidden" name="llr" value="yyyyyy">
<input type="hidden" name="m" value="xxxxxx">
<input type="hidden" name="p" value="oi">
<label>sign up for new services and promotions:</label>
<input type="text"name="ea" value="" class="text" />
<input type="submit" id="iframe" class="submit"
name="go" value="submit" />
</form>
can this be done?
yes, you can use asp.net Textbox control for html input control and you can put the same styling. e.g.
<asp:TextBox ID="ea" CssClass="text" runat="server"></asp:TextBox>
Button control for html submit button e.g.
<asp:Button ID="iframe" CssClass="submit" runat="server" Text="submit" />
For your input type hidden, you can use asp.net HiddenField Control
<asp:HiddenField ID="llr" runat="server" Value="yyyyyy" />
Yes it can be done . On browser side ASP.NET controls get converted in to HTML even if you use the asp.net button.
Drag and drop asp.net button from toolbox and put attribute id , cssclass , name , text . It will get converted in end to HTML as expected
<asp:Button id="iframe" cssclass="submit"
Text="Submit" runat="server" />
Yeah. You have to consider these notes:
If you want to use ASP.NET controls, you should add runat='server' attribute to your form element. It's because ASP.NET controls (AKA server controls) while rendering check to see if they are get rendered in a server form (VerifyRenderingInServerForm method).
<asp:Hidden control is your replacement for <input type='hidden'
<asp:TextBox control is your replacement for <input type='text'
<asp:Button control is your replacement for <input type='submit'
All of your server controls should have runat='server' attribute
ASP.NET only allows for one form with runat=server, and all of your server controls have to be within a form with runat=server. Nesting forms isn't advisable.
See reference on form nesting:
https://web.archive.org/web/20170420110433/http://anderwald.info/internet/nesting-form-tags-in-xhtml/.
You'll need the form in a different document object - maybe host it in an iframe and conver the mini-form to an ASPX page that you load into the iframe ...