?
Solved

jquery datepicker inline value c#

Posted on 2014-11-03
9
Medium Priority
?
320 Views
Last Modified: 2014-11-06
I have a JQuery Datepicker that is inline. How do I get the value in c# to show on the same page  as the calendar?
0
Comment
Question by:RecipeDan
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
  • 3
9 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 40421268
c# run on the server
the jQuery calendar is built once the page is loaded by Jquery, in your browser
you browser have no idea of c#
c# have no idea of jQuery

you can send the value of the datepicker using usual method
<asp:TextBox id="datepicker" runat="server" />

$("#<%= datepicker.ClientID %>").datepicker(options);
0
 
LVL 1

Author Comment

by:RecipeDan
ID: 40421799
I think I asked the question and didn't give enough information. I have a JQuery Datepicker, I need to get that value and use it in the code behind to call a SQL Database and use that value as a label on the same page as the calendar. I know how to create the label but do not know how to get the Datepicker value and use it in the code behind.
0
 
LVL 1

Author Comment

by:RecipeDan
ID: 40421808
  <script>
  $(function() {
      $("#calendarwrapper").datepicker({
      numberOfMonths: [3,1],
      showButtonPanel: true
    });
  });
  </script>
[code]
[code]
        <div id="calendarwrapper">

        </div>

Open in new window

0
What is a Denial of Service (DoS)?

A DoS is a malicious attempt to prevent the normal operation of a computer system. You may frequently see the terms 'DDoS' (Distributed Denial of Service) and 'DoS' used interchangeably, but there are some subtle differences.

 
LVL 111

Expert Comment

by:Ray Paseur
ID: 40421852
I don't have a C# example, but I can tell you that the general design pattern is a jQuery/AJAX request that will dynamically call a script on the server.  This article explains the theory of the AJAX interaction.  I'll see if I can put together an example that uses the datepicker.
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/A_10712-The-Hello-World-Exercise-with-jQuery-and-PHP.html
0
 
LVL 82

Expert Comment

by:leakim971
ID: 40421875
but do not know how to get the Datepicker value and use it in the code behind.

  $(function() {
      $("#calendarwrapper").datepicker({
            onSelect: function(date) {
               $("#<%= Hidden1.ClientID %>").val(date);
            },
            numberOfMonths: [3,1],
            showButtonPanel: true
    });
  });

Open in new window


<asp:Hidden ID="Hidden1" runat="server">

Open in new window

0
 
LVL 111

Accepted Solution

by:
Ray Paseur earned 2000 total points
ID: 40421980
Please see: http://iconoun.com/demo/ajax_datepicker.php

Here is the front-end (client-side) script:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - With AJAX Request</title>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">

<script>
$(function() {
    $("#picker").datepicker({
        onClose: function(picked){
            $.get("ajax_datepicker_server.php", {d:picked}, function(response){
                $("#output").html(response);
            });
        }
    });
});
</script>

</head>
<body>
<form>
<p>Date: <input name="chosen_date" type="text" id="picker" /></p>
</form>
<div id="output">The chosen date goes here</div>
</body>
</html>

Open in new window

And here is the back-end (server-side script).  All this does is reformat / regurgitate the information received from the client-side script, but in your real-life application this script would also update a database or do other meaningful processing with the date received from the datepicker.
<?php // demo/ajax_datepicker_server.php
error_reporting(E_ALL);

/**
 * A backend server-side script gets called from the jQuery "datepicker"
 * Receives a GET-method request with d= argument
 * Returns a reformatted date value via echo() for inclusion in a <div>
 */

// INTERPRET THE DATE STRING INTO A TIMESTAMP
$t = !empty($_GET['d'])
   ? strtotime($_GET['d'])
   : NULL
   ;

// IF THE TIMESTAMP IS UNUSABLE
if (!$t) die();

// REFORMAT INTO A PRETTY DATE AND SEND BACK AS IF BROWSER OUTPUT
$d = date('l, F jS, Y', $t);
die($d);

Open in new window

0
 
LVL 1

Author Closing Comment

by:RecipeDan
ID: 40424423
Awesome Ray. Thank you for your help
0
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 40424567
Thanks for the points, and best of luck with your project! ~Ray
0
 
LVL 82

Expert Comment

by:leakim971
ID: 40426342
look like you did it with Ray_Paseur solution :
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/Q_28552099.html

Ray_paseur use OnClose
I propose to use OnSelect

Wait... it's probably not the same project.. my bad.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question