当datepicker字段更改时,JQUERY更新选项卡

时间:2009-10-30 16:59:37

标签: jquery-ui-tabs

我有一个Jquery的UI日期选择器和一些通过AJAX显示一些数据的UI选项卡(在ASP.NET 1.1中),我想在选择新日期时更新所有选项卡对象。

每个人都可以帮助我?????

这是我的代码:

<script type="text/javascript">
function getId(){
    var TabSel = $('#tabs').tabs('tabsselect').val();
    return TabSel
}
function getDate(){
    var dataPick = $('#datepicker').val();
    return dataPick
}
$(document).ready(function() {
        $.datepicker.setDefaults($.extend({showMonthAfterYear: false}, $.datepicker.regional['it']));
        $("#datepicker").datepicker(
        {showOn: 'button', defaultDate: '-1w', showDefault: true, buttonImage: 'images/cal.gif', buttonImageOnly: false,
            altField: '#alternate', altFormat: 'yymmdd'}
        );

        $('#datepicker').datepicker({
            onSelect: function(dateText, inst) { 
               //change the tabs here.
                $('#tabs').tabs({ 
                spinner: '<b>Caricamento in corso....</b>',
                ajaxOptions: { data: { id: getId, seldate: getDate}}
                });

            }
            });
    });
</script>
</HEAD>
<body>
    <div class="demo">
        <p>Data: <input type="text" id="datepicker" value="01/10/2009" ><input type="hidden" id="alternate" >   
        </p><br>    
        <div id="tabs">
            <ul>
                <li>
                    <a href="Tab1.aspx" id="Tab1">Tab1</a>
                <li>
                    <a href="Tab2.aspx" id="Tab2">Tab2</a>
                <li>
                    <a href="Tab3.aspx" id="Tab3">Tab3</a>
                </li>
            </ul>
        </div>
    </div> <!-- End demo -->
</body>

非常感谢。

亚历山德罗

1 个答案:

答案 0 :(得分:0)

在jQuery Datepicker的onSelect方法中实现选项卡更改。

$('#datepicker').datepicker({
   onSelect: function(dateText, inst) { 
       //change the tabs here.
   }
});