• SharePoint 2010 date time pick 时间的select chaned 的事件 用Jquery 获取


    Catch the clientside onchange events on a date/time field

     
    While spending my time in designing Sharepoint Forms, I often face the task of pre-populating fields according to who's logged, and under which conditions the user got to this page.
     
    I'll write a post on prepopulating different types of fields in the near future, but before that let's talk about the datefield, and how to handle the changes made to this field.
     

     
     
     
    Did I say field? Fields is what I should have said. This control has 3 input fields, and the very handy datepicker control (the little calendar). To fully catch the onchange event, we have to take a look at those 4 controls and make them fire our function upon change.
     
    First things first.
     
    1) The Datefield
     
    Let's have a look at the HTML for this field:

    <INPUT id=ctl00_m_g_30b0923a_0f4a_4deb_bc52_524e5708b391_ff10_1_ctl00_ctl00_DateTimeField_DateTimeFieldDate class="ms-input" title=(Start)Date value=1-1-3000 maxLength=45
    name=ctl00$m$g_30b0923a_0f4a_4deb_bc52_524e5708b391$ff10_1$ctl00$ctl00$DateTimeField$DateTimeFieldDate
    AutoPostBack="0">

    I've highlited the parts that makes this control easy for us to find. For javascript that is.
    It's an INPUT field, with an id that ends with DateTimeField_DateTimeFieldDate and has a title that equal's the public name of the field ((Start)Date in this example).
     
    Assuming you know your jquery (if not, go check it out!) here's my function to get the field.
     
    function GetSPField(tagName, identifier, title) {
    return $(tagName+'[id$='+identifier+'][title='+title+']').first();
    }
     
    var MyDateField = GetSPField('INPUT', 'DateTimeField_DateTimeFieldDate', '(Start)Date');
     
     
    2) The Timefields
     
    Now that we've found MyDatefield, we can get the Hourfield and MinuteField. fortunately Sharepoint doesn't make this very difficult. Just append 'Hours' and 'Minutes' to the datefield's id, and we're good to go:
     
    var MyHourField = $('#'+MyDateField.attr('id')+'Hours');
    var MyMinuteField = $('#'+MyDateField.attr('id')+'Minutes');
     
     
    3) Events for the fields
     
    With the 3 fields in our reach, we can add the event. Once again, jquery is our friend:
     
    function TimeHasChanged() {
    alert('welcome in this new day and age');
    }
     
    MyDateField.bind('change', TimeHasChanged);
    MyMinuteField.bind('change', TimeHasChanged);
    MyHourField.bind('change', TimeHasChanged);
     
     
    4) Handling the DatePicker
     
    When clicking the datepicker, we get a handy calendar enabling us to easily pick a date. Hence the name....
    However after selecting an appropriate date, all it does is close and fill in the datefield. No events or nothing. At least no OnChange event.
     
    Digging into the datepicker.js, in the _layouts folder, I found the following piece of code:
     
    if (typeof(resultfield.onvaluesetfrompicker)=='function')
    {
    resultfield.onvaluesetfrompicker();
    }
    else
    {
    eval(resultfield.onvaluesetfrompicker);
    }
     
    Meaning we can set an onvaluesetfrompicker event on the datefield, that will be called when a date is picked. As simple as that.
     
    Our final piece of code here should then be (quick and dirty):
     
    MyDateField.get(0).onvaluesetfrompicker = TimeHasChanged;
     
    Hope you get good use for it. Enjoy!
     
  • 相关阅读:
    dotNet MSIL中的一些不常见IL指令
    DNGuard HVM Release
    让 .Net 程序 脱离 .net framework框架 运行的方法
    [转载]Calling printf from C# The tale of the hidden __arglist keyword
    浅谈.Net脱壳中方法体的局部变量签名还原
    DNGuard HVM 2007 标准版正式发布
    DNGuard HVM RC2 发布(运行库更新)
    DNGuard HVM 2007 更新[20070823]
    .Net 保护中的 native compile 方式
    gridview输出到excel
  • 原文地址:https://www.cnblogs.com/ahghy/p/2735358.html
Copyright © 2020-2023  润新知