Getting a value from a JavaScript function to my ASP.NET / C# Code-Behind

Question

I got a code snippet for a date and time picker i found in this place: Date and Time Picker

I didn't manage to insert it into my code normally from some reason so i just used the demo code on the bottom and pasted it in my ASP.NET site and this is the code:

// Head

<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="screen" href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">

// Body

<div id="datetimepicker" class="input-append date">
    <input type="text"></input>
    <span class="add-on">
        <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
    </span>
</div>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
</script>
<script type="text/javascript" src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
</script>
<script type="text/javascript">
    $('#datetimepicker').datetimepicker({
        format: 'dd/MM/yyyy hh:mm',
        pickSeconds: false,
        language: 'en'
    });
</script>

It works fine and i can see and choose a date and time in my page, but as stated in the API in order to get the time to my Code-Behind i have to use this JavaScript function:

picker.getLocalDate();

The problem is it's a JavaScript function which obviously returns some data, and i have no idea how to get it inside my C# code, I've looked everywhere and found some solutions that didn't work out.

Hope you could tell me what should i do to get it, Thanks!

Add an asp:HIddenField or plain <input type=hidden id=hiddenDate runat=server> to your page, and then deposit the value of picker.getLocalDate into that hidden field's ID via document.getElementById(). When you postback, it will be included in the data sent back to the server. — David W
– David W, Commented May 6, 2015 at 18:35
I understood that hidden input is the answer, but i'm not really sure on how to use it together with JavaScript — argamanza
– argamanza, Commented May 6, 2015 at 18:53

Emran Sadeghi · Accepted Answer · 2015-05-06 19:03:14Z

3

add this code to java script :

document.getElementsByName('mydate').value = picker.getLocalDate();

add this code between form tag :

<asp:HiddenField ClientIDMode="Static" runat="server" id="mydate" />

use this code in you'r code behind :

string myDate = mydate.Value;

but be careful use javascript after all element.

edited May 6, 2015 at 19:03

answered May 6, 2015 at 18:39

Emran Sadeghi

7128 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Greg · Accepted Answer · 2015-05-06 19:21:02Z

You have several approaches, you haven't indicated your technology so I'll cover several approaches.

Hidden
Ajax
Query String
runat

The simplest approach would be the hidden or runat. To demonstrate, I'll start with the runat approach:

// Front End:
<input type="text" id="txtDate" runat="server" />

// Back End:
Console.WriteLine(txtDate.Value);

So in this instance, if your JavaScript modifies the Text Box, when your server side code runs it will call the value on the field.

This approach is similar to the HiddenField or Hidden. You store the value in a container, that is exposed to the server for easy transport from the Client to the Server.

<asp:HiddenField id="hdDate" runat="server" />
<input type="Hidden" id="hdDate" runat="server" />

Doesn't matter which one you utilize, the server can access either. You simply need to have JavaScript append a value.

The other two approaches, work more ideally for a Service. When you call another page or a Controller, you in essence have a parameter. Which will indeed, allow you to transfer the data.

However, I'm not sure if those are the approaches you actually need though. After looking at the documentation, this should solve your issue:

// Front End:
<div id="datetimepicker" class="input-append date">
    <input type="text" id="txtDate" runat="server"></input>
    <span class="add-on">
        <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
    </span>
</div>

// Back End:
var example = txtDate.Value;

Collectives™ on Stack Overflow

Getting a value from a JavaScript function to my ASP.NET / C# Code-Behind

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related