I have a dropdownlist with 5 items. Value of last item is "other". By choosing "other" appears popup with input. The value of this input i set to this item by javascript. So value bes inserted text. When i submitting the form, it doesn't work with this dynamic value, but other items of select works. Any ideas? Thanks very much!
I have a dropdownlist with 5 items. Value of last item is "other". By choosing "other" appears popup with input. The value of this input i set to this item by javascript. So value bes inserted text. When i submitting the form, it doesn't work with this dynamic value, but other items of select works. Any ideas? Thanks very much!
Share Improve this question asked May 8, 2012 at 14:47 Serhio g. LazinSerhio g. Lazin 9,6526 gold badges27 silver badges33 bronze badges 3-
Submit the form will
post back
the page, any thing you do in the client side will vanish unless it send data back to server, which is, AJAX. – fankt Commented May 8, 2012 at 14:55 - Can you post the code you're using to set the value of the item? – Snuffleupagus Commented May 8, 2012 at 14:59
- Access the dynamic value by using the Request.Params collection. – Zachary Commented May 8, 2012 at 15:14
3 Answers
Reset to default 4Here is a quick example of using Request.Params collection to read dynamically added value.
Here is the client side code.
<!-- Server Control - Drop Down List -->
<asp:DropDownList ID="ddList" runat="server">
<asp:ListItem Text="A" Value="A"></asp:ListItem>
<asp:ListItem Text="B" Value="B"></asp:ListItem>
<asp:ListItem Text="C" Value="C"></asp:ListItem>
</asp:DropDownList>
<!-- Control to fire JS event to add a new item to the Drop Down List above -->
<input type="button" value="Add Item D" id="AddItem" />
<!-- jQuery event to add a new option to the list on the click (no postback) -->
$('#AddItem').click(function ()
{
$('#<%= ddList.ClientID %>').append('<option value="D">D</option>');
});
Here is the server side code to read the value.
var ddlListSelectedValue = Request.Params["ddList"];
Rather than set this value as droupdown list item value, you can use hiden field
<input type="hidden" id="hiddenField" runat="server" />
set value using JavaScript as below
document.getElementById ("hiddenField").value = "inputValue";
hiddenField value can access from code behind as below
string inputValue = hiddenField.Value;
Just Update you Function
$('#AddItem').click(function ()
{
var dropdown= document.getElementById("<%= ddList.ClientID %>");
dropdown.options[dropdown.options.length] = new Option('YOUR TEXT', 'YOUR VALUE');
});
Cheers
I have tested it myself, it works. Following is a plete example:
<html>
<head>
<title>Test ddl Item Addition By IuR</title>
</head>
<body onload="add_dditem()">
<script type="text/javascript">
function add_dditem()
{
var dropdown= document.getElementById("ddList");
dropdown.options[dropdown.options.length] = new Option('YOUR TEXT', 'YOUR VALUE');
}
</script>
<select id="ddList">
</select>
</body>
</html>