how to save javascript values to use in server code?

Question

I have a label that shows the price depend on 2 other DropDownLists via javascript. I want to use this label value in my server code when submit button in hitted. how can I figure it out?

.aspx.cs page code:

  protected void btnSubmit_Click(object sender, EventArgs e)
    {
       Int64 totalPrice = Convert.ToInt64(lblMablaghGhabelePardakht.Text);
       System.Windows.Forms.MessageBox.Show(totalPrice.ToString());
       return;
    }

.aspx page code:

<script type="text/javascript">
    var ratesArray = [[0, 0], [1, 1000], [2, 1500], [3, 2000], [4, 2500], [5, 3000]];
    var days = 7;
    var pricePerDay = 0;
    var TotalPrice;

    function timleLimitDrpFunc() {
        var tElem = document.getElementById('<%=drpTimeLimit.ClientID%>');
        days = tElem.options[tElem.selectedIndex].value;
        TotalPrice = days * pricePerDay;
        SetPrice();
    }

    function ratesDrpFunc() {
        var rElem = document.getElementById('<%=drpRates.ClientID%>');
        var rateIndex = rElem.options[rElem.selectedIndex].value;
        pricePerDay = ratesArray[rateIndex][1];
        TotalPrice = days * pricePerDay;
        SetPrice();
    }    

    function SetPrice() {
        var pElem = document.getElementById('<%=lblMablaghGhabelePardakht.ClientID%>');
        pElem.innerHTML = TotalPrice; 
        pElem.value = TotalPrice;   
    }                   
</script>
<asp:DropDownList ID="drpRates" runat="server" onchange="ratesDrpFunc(); return false;">
</asp:DropDownList>

<asp:DropDownList ID="drpTimeLimit" runat="server" onchange="timleLimitDrpFunc(); return false;">
</asp:DropDownList>

 <asp:Label ID="lblMablaghGhabelePardakht" runat="server" Text="0"></asp:Label>
<span>ریال</span>

<asp:Button ID="btnSubmit" runat="server" Text="ثبت" class="FormButton" OnClick="btnSubmit_Click"
    ValidationGroup="submit" />

---

Changes after comments: I maked below changes but returns null(0)... where is my problem?!

function SetPrice() {
   var pElem = document.getElementById('<%=lblMablaghGhabelePardakht.ClientID%>');
   pElem.innerHTML = TotalPrice;
   pElem.value = TotalPrice;

   var hElem = document.getElementById('<%=hndTotalPrice.ClientID%>');
   hElem.valu = TotalPrice;                
   }                                        
   </script>
   <asp:HiddenField ID="hndTotalPrice" runat="server" />

.

protected void btnSubmit_Click(object sender, EventArgs e)
    {
        string strtest = hndTotalPrice.Value;    
       // Int64 totalPrice = Convert.ToInt64(lblMablaghGhabelePardakht.Text);
        Int64 totalPrice = Convert.ToInt64(hndTotalPrice.Value);
        System.Windows.Forms.MessageBox.Show(totalPrice.ToString());
        return;
    }

---

Answer: I used hElem.setAttribute("value", TotalPrice); instead of hElem.valu = TotalPrice; and my problem resolved.

Answer 1

From @SJuan76's comment on the hidden field & your question on how to use it:

<asp:HiddenField ID='someID' runat='server' />

Then use javascript to set the value once you know the final price. You'll need to use the client id in the javascript.

Here is an article on that: http://www.jagregory.com/writings/how-to-use-clientids-in-javascript-without-the-ugliness/

---

change your SetPrice function to this and see if that will fix the problem, and here 'TotalPrice' should be the parameter.

function SetPrice(TotalPrice) {
   var pElem = document.getElementById('<%= lblMablaghGhabelePardakht.ClientID %>');
   pElem.innerHTML = TotalPrice;
   pElem.value = TotalPrice;

   var hElem = document.getElementById('<%= hndTotalPrice.ClientID %>');
   hElem.valu = TotalPrice;                
}

You don't declare the TotalPrice in the set price function so it doesn't know what that is. So it could return null/0 based upon that.