2013-11-19 2 views
0

Я пытаюсь реализовать элемент управления календарем и использовать для него календарь jquery. Я хочу сделать доступным дату. По умолчанию все даты в пользовательском интерфейсе доступны. Я хочу только, чтобы эти даты нажимали так, чтобы они были из базы данных, и я хочу получить доступ к значению (какой даты нажата) на C#. Если пользователь нажимает на дату, я хочу показать всплывающее окно и выполнить операцию базы данных с C#.jQueryUI Календарные ячейки в C#

<script> 
    $(function() { 
     $("#datepicker").datepicker(); 
    }); 
</script> 

Я успешно реализован контроль, но не могу понять, как передать дату щелкнул в код (.cs) файл

Любая идея, как я должен пойти на это.

UPDATE

<script> 
$(document).ready(function() { 
    var enabledDays = ['11-30-2013', '12-14-2013', '12-21-2013', '01-11-2014', '01-11-2014', '01-25-2014', '02-08-2014', '02-22-2014', ] 
     function enableAllTheseDays(date) { 
      var m = date.getMonth(), 
       d = date.getDate(), 
       y = date.getFullYear(); 
      for (i = 0; i < enabledDays.length; i++) { 
       if ($.inArray((m + 1) + '-' + d + '-' + y, enabledDays) != -1) { 
        return [true]; 
       } 
      } 
      return [false]; 
     } 
    $('#datepicker').datepicker({ 
     dateFormat: 'mm-dd-yyyy', 
     beforeShowDay: enableAllTheseDays 
    }); 
}); 
</script> 

ответ

1

Вы можете хранить его в ASP.NET hidden field и доступ к нему в коде позади.
Вы можете реализовать это нравится -

<asp:HiddenField runat="server" ID="hdnDate" ClientIDMode="Static" /> 

и в коде Javascript

<script> 
$(function() { 
var dateVal = $("#datepicker").val(); 
//Set your date value here 
$("#hdnDate").val(dateVal); 
}); 
</script> 

, а затем получить доступ к нему в коде-за, как -

hdnDate.Value 

Update:
Чтобы выбрать только несколько дат, используйте DatePicker's beforeShowDay.

+0

hmmm. спасибо, я могу получить такие значения, но как насчет того, чтобы сделать некоторые даты нажатием кнопки. Как я могу привязать его к источнику? – dnts2012

+0

похоже, что вы редактировали вопрос – Vandesh

+0

проверить обновление в своем ответе – Vandesh

0
<asp:TextBox runat="server" id='DataPicker'> 

и вашего Jquery

<script> 
    $(function() { 
     $("#DataPicker").datepicker(); 
    }); 
</script> 

Это предполагает, что вы находитесь под конфигурацией клиента ID или использовать классы иначе ...

кода За

string dateString = DataPicker.Text 

или пропускание его как свойство модели, литье производится автоматически

+0

Implemeting datepicker не проблема. Проблема заключается в том, как сделать некоторые даты нажатием кнопки, а затем воспроизвести с ними в C# – dnts2012

1
var enabledDays = <%= EnableDays %>; 
//EnableDays is a property in aspx page Class 
and handle `beforeShowDay` calnder event 
$(function() { 
     $("#datepicker").datepicker({ 

      beforeShowDay: function (date) { 

        var m = date.getMonth(), d = date.getDate(), y = date.getFullYear(); 
        if (!$.inArray(y + '-' + (m + 1) + '-' + d, disabledDays) != -1) { 
         return [false]; 

        } 
        return [true]; 
       }, 
      //handle on select event 
      onSelect: function (dateString, inst) { 
       var selectedMonth = inst.selectedMonth +1 ; 
       $.ajax({ 
        type: "POST", 

        url: "<base url>/<asp page name>.aspx/web method name", 
        //year and month and day is the parameters name in the web method 
        data: "{year:"+inst.selectedYear+",month:"+ selectedMonth+",day:"+inst.selectedDay+"}", 

        contentType: "application/json; charset=utf-8", 
        dataType: "json", 
        success: function (msg) { 
         var data = msg.d; //.net buts the data in msg.d not msg 
        } 
       }); 

      } 

     }); 
    }); 

стороне сервера определить статический метод

[WebMethod] 
public static return_type method_name (int year,int month, int day) 
{ 
    //you can return List<T> and process it in javascript or you can return html string 
    //and bind it in js 
} 

это хорошая ссылка: http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/ проверить это

+0

Спасибо .. я пробовал .. но beforeShowDay не работает с датами 2014 .. он отлично работает с датами 2013 года .. любая идея, см. обновление в моем вопросе для кода – dnts2012

0

Осуществление является сложным/легко в зависимости от конкретного подхода, который вы используете.

Если вы используете веб-форму, и «нужно» дату выберите событие на самом деле выполнить код на сервере, есть несколько вещей, которые вы должны сделать:

  1. Добавить скрытое поле в страница
  2. Зарегистрируйте пользовательский механизм обратной передачи в своем коде.Это довольно сложно, однако, следующий SO пост установит вам в этом направлении: ASP.NET postback with JavaScript
  3. В инициализации сайта Date Picker, написать что-то вроде:

-

function onDateChanged(){ 
    //Invoke a full postback 
    __doPostback('foo',''); 
} 

$(function(){ 
    $('#datepicker').datepicker({ 
     'onSelect': function(dateText, inst){ 
      //Set the hidden control here. 
        //invoke postback 
        onDateChanged(); 
     } 
    }); 
}); 

Кроме того, вы могут использовать pagemethods, как указано в одном из ответов здесь.

Если вы используете asp.net mvc, вам необходимо отправить правильную форму на сервер, поэтому вместо этого вызывается onDateChanged, вы найдете экземпляр для формы html и назовите submit.

document.getElementById('form1').submit(); 

В качестве альтернативы, если у вас есть какое-либо действие контроллера, чтобы получить только дату, чтобы сделать некоторую обработку и вернуть некоторые данные обратно, это может быть достигнуто асинхронно тоже с помощью $.ajax() вызовов.

+0

Я работаю с веб-формами – dnts2012

Смежные вопросы