开发者

How I use .Live() jQuery function with Jquery UI datepicker?

I have a datepicker (localized to spanish):

$(document).ready(function () {
    $("#datepicker").datepicker(
        { dateFormat: 'dd/mm/yy',
            dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa'],
            monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo',
                'Junio', 'Julio', 'Agosto', 'Septiembre',
                'Octubre', 'Noviembre', 'Diciembre'],
            monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr',
                'May', 'Jun', 'Jul', 'Ago',
                'Sep', 'Oct', 'Nov', 'Dic'],
            onSelect: function (dateText, inst) {
                var form = $(form);
                $.ajax({
                    url: "/Trabajo/",
                    type: "POST",
                    data: { dia: dateText },
                    success: function (result) {
                        $('#trabajos').replaceWith($('#trabajos', $(result)));
                    }
          开发者_StackOverflow      });
                return false;
            }
        });
});

Its working perfectly, its updating the #trabajos div with the new info but the dom is not updated. I know that .live() is for that but, as jquery noobish, how I change this code to implement the live function?

Thank you.

PS: If there is a asp.net mvc guy, if my form is like:

@using (Ajax.BeginForm("/Trabajo/", new AjaxOptions { UpdateTargetId = "trabajos" }))

Why I have to manually update it on the success func?


Try like this:

$(document).ready(function () {
    attachDatePicker();
});

function attachDatePicker() {
    $('#datepicker').datepicker({ 
        dateFormat: 'dd/mm/yy',
        dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa'],
        monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
        monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
        onSelect: function (dateText, inst) {
            var form = $(form);
            $.ajax({
                url: '/Trabajo/',
                type: "POST",
                data: { dia: dateText },
                success: function (result) {
                    $('#trabajos').replaceWith($('#trabajos', $(result)));
                    // reattach the datepicker if you updated 
                    // the corresponding DOM element
                    attachDatePicker();
                }
            });
            return false;
        }
    });
}

Remark: never hardcode urls in your javascript files as you did in the url property of your AJAX call. Always Url helpers. So instead of:

url: '/Trabajo/'

use:

url: '@Url.Action("Index", "Trabajo")'
                     ^         ^
                  action    controller
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜