title: Get DropDownList value in javascript
body: <p>I have a DropDownList  called ShippingList and when a value is selected, I want to pass that value into the variable simpleCart.shippingFlatRate. I tried creating a var and getting the selected value and then passing that var, but for some reason var shipList remains null (Firebug console). I am new to asp.net and this is my first time using javascript, so I'm kinda stuck, is this even the simplest/easiest way of passing the value?</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      simpleCart.email = "abc@gmail.com";
      simpleCart.currency = "EUR";
      simpleCart.cartHeaders = ["Name_noHeader", "Price_noHeader", "increment_noHeader", "Quantity_input_noHeader", "decrement_noHeader_noHeader", "Remove_noHeader", "Total_noHeader"];
      var shipList = document.getElementById('&lt;%=ShippingList.ClientID%&gt;');
      var shipCost = shipList.options[shipList.selectedIndex].value;
      simpleCart.shippingFlatRate = shipCost;
  &lt;/script&gt;
  </code></pre>
  
  <p>EDIT all the markup:</p>
  
  <pre><code>    &lt;%@ Page Title="" Language="C#" MasterPageFile="~/Standardmaster.Master" AutoEventWireup="true" CodeBehind="WebShop.aspx.cs" Inherits="PetShopParadise.Customer_Pages.WebShop" %&gt;
  &lt;asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"&gt;
  &lt;/asp:Content&gt;
  &lt;asp:Content ID="Content2" ContentPlaceHolderID="mainContent" runat="server"&gt;
  
  
  
  &lt;script type="text/javascript" src="/simpleCart.js"&gt;&lt;/script&gt;
  
  
      &lt;h2&gt;
          Welcome to the Web Shop of 
          &lt;asp:Label ID="Label1" runat="server" Text="Label"&gt;&lt;/asp:Label&gt;
          !&lt;/h2&gt;
  
      &lt;asp:SqlDataSource ID="SqlDataSource2" runat="server" 
          ConnectionString="&lt;%$ ConnectionStrings:PetShopParadiseConnectionString %&gt;" 
          SelectCommand="SELECT [Name] FROM [Vendors] WHERE ([VendorID] = @VendorID)"&gt;
          &lt;SelectParameters&gt;
              &lt;asp:QueryStringParameter Name="VendorID" QueryStringField="VendID" 
                  Type="Decimal" /&gt;
          &lt;/SelectParameters&gt;
      &lt;/asp:SqlDataSource&gt;
      &lt;asp:GridView ID="ProductsGrid" runat="server" AllowSorting="True" 
          DataSourceID="SqlDataSource1" AutoGenerateColumns="False" DataKeyNames="ProductID" &gt;
          &lt;Columns&gt;
              &lt;asp:BoundField DataField="ProductID" HeaderText="ProductID" 
                  SortExpression="ProductID" InsertVisible="False" ReadOnly="True" /&gt;
              &lt;asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" /&gt;
              &lt;asp:BoundField DataField="Type" HeaderText="Type" 
                  SortExpression="Type" /&gt;
              &lt;asp:BoundField DataField="Description" HeaderText="Description" 
                  SortExpression="Description" /&gt;
              &lt;asp:BoundField DataField="Price" HeaderText="Price" SortExpression="Price" /&gt;
              &lt;asp:TemplateField HeaderText="Image"&gt;
              &lt;ItemTemplate&gt;
              &lt;a href="javascript:void(window.open('&lt;%# "/FullImage.ashx?ProductID="+ Eval("ProductID")%&gt;','_blank','toolbar=no,menubar=no'))" &gt; &lt;asp:Image ID="Image1" runat="server" ImageUrl='&lt;%# "/Thumbnails.ashx?ProductID="+ Eval("ProductID")  %&gt;'/&gt; &lt;/a&gt;
              &lt;/ItemTemplate&gt;
              &lt;/asp:TemplateField&gt;
              &lt;asp:TemplateField&gt;
              &lt;ItemTemplate&gt;
              &lt;a href="javascript:;" onclick="simpleCart.add( 'name=&lt;%# Eval("Name") %&gt;' , 'price=&lt;%# Eval("Price") %&gt;' , 'quantity=1' );"&gt;Add To Cart&lt;/a&gt;
              &lt;/ItemTemplate&gt;
              &lt;/asp:TemplateField&gt;
          &lt;/Columns&gt;
      &lt;/asp:GridView&gt;
  
      &lt;br /&gt;
  
      &lt;br /&gt;
      &lt;div id="LocationDetails"&gt;
          &lt;asp:Label ID="Label2" runat="server" Text="Choose Location"&gt;&lt;/asp:Label&gt;&lt;asp:DropDownList
              ID="ShippingList" runat="server" 
              onselectedindexchanged="ShippingList_SelectedIndexChanged" 
              AutoPostBack="True"&gt;
              &lt;asp:ListItem Value="5" Text="Europe"&gt;&lt;/asp:ListItem&gt;
              &lt;asp:ListItem Value="10"&gt;Asia&lt;/asp:ListItem&gt;
              &lt;asp:ListItem Value="8"&gt;America&lt;/asp:ListItem&gt;
              &lt;asp:ListItem Value="12"&gt;Africa&lt;/asp:ListItem&gt;
              &lt;asp:ListItem Value="15"&gt;Rest of the World&lt;/asp:ListItem&gt;
          &lt;/asp:DropDownList&gt;
  
  
  
   &lt;script type="text/javascript"&gt;
          simpleCart.email = "abc@gmail.com";
          simpleCart.currency = "EUR";
          simpleCart.cartHeaders = ["Name_noHeader", "Price_noHeader", "increment_noHeader", "Quantity_input_noHeader", "decrement_noHeader_noHeader", "Remove_noHeader", "Total_noHeader"];
          var shipList = document.getElementById('&lt;%=ShippingList.ClientID%&gt;');
          var shipCost = shipList.options[shipList.selectedIndex].value;
          simpleCart.shippingFlatRate = shipCost;
      &lt;/script&gt;
  
          &lt;br /&gt;
          &lt;asp:Label ID="Label3" runat="server" Text="Shipping Cost"&gt;&lt;/asp:Label&gt;
          &lt;asp:TextBox
              ID="ShippingCostBox" runat="server"&gt;&lt;/asp:TextBox&gt;
  
      &lt;/div&gt;
  
      &lt;div id="cartTotal"&gt;
      &lt;strong&gt;Total: &lt;/strong&gt; &lt;span class="simpleCart_total"&gt;&lt;/span&gt;&lt;/div&gt;
  
      &lt;div class="simpleCart_items"&gt;&lt;/div&gt;
  
      &lt;div class="CartOptions"&gt;&lt;a href="javascript:;" class="simpleCart_checkout"&gt;Checkout&lt;/a&gt;
      &lt;a href="javascript:;" class="simpleCart_empty"&gt;Empty&lt;/a&gt;&lt;/div&gt;   
  
  
  
      &lt;asp:SqlDataSource ID="SqlDataSource1" runat="server" 
          ConnectionString="&lt;%$ ConnectionStrings:PetShopParadiseConnectionString %&gt;" 
  
          SelectCommand="SELECT [ProductID], [Name], [Type], [Description], [Price], [Image] FROM [Products] WHERE ([VendorIDF] = @VendorIDF)" 
          OldValuesParameterFormatString="original_{0}" 
          ConflictDetection="CompareAllValues" &gt;
  
          &lt;SelectParameters&gt;
  
  
              &lt;asp:QueryStringParameter Type="Int32" 
              Name="VendorIDF" 
              QueryStringField="VendID" /&gt;
  
          &lt;/SelectParameters&gt;
  
      &lt;/asp:SqlDataSource&gt;
  
  
  &lt;/asp:Content&gt;
  &lt;asp:Content ID="Content3" ContentPlaceHolderID="bannerContent" runat="server"&gt;
  &lt;/asp:Content&gt;
  </code></pre>