Несколько представлений MVC и JQuery Несколько элементов JqueryUI - PullRequest
Новая
       5

Несколько представлений MVC и JQuery Несколько элементов JqueryUI

0 голосов
/ 11 июля 2011

просто быстрый вопрос об инфраструктуре MVC JqueryUI,

У меня есть страница _layout.cshtml, которая инициализирует набор вкладок

У меня есть представление, в котором есть указатель даты jqueryUI.

Представление загружается динамически во вкладки и отображается, но если я загружаю последующий экземпляр представления на вкладках, средство выбора даты будет заполнять только первый экземпляр средства выбора даты.

myвопрос в этом
1. MVC использует независимые объекты для создания независимых представлений с теми же идентификаторами, что и в представлениях
2. JQueryUI использует XML Dom с уникальными идентификаторами для создания своих базовых объектов

, поэтому какони должны работать вместе.Мой вид выглядит следующим образом: 

    <div class="PoCreate">
            <div id="pnlProject">
                <fieldset>
                    <legend>Project</legend>
                    <label for="ProjectNo">
                        Project #:
                    </label>
                    <input type="text" name="ProjectNo" id="ProjectNo" />
                    <input type="button" name="btnProjectNo" id="btnProjectNo" data-linked-search="@Url.Action("Project", "SearchObj")"
                        value=".." />
                </fieldset>
            </div>
        </div>
        @Url.Script("~/scripts/PageScripts/_PoIndex.js")

Файл сценария содержит 

$('.PoCreate').PoCreate({});

, а функция PO содержит 

$.fn.extend({
    PoCreate: function (opt)
    {
        $(this).each(function ()
        {
            var _self = $(this.parentNode),
            _opts = {}, tabIdContext = $(this.parentNode).attr('id');
            $.extend(_opts, (opt || {}));

            $('.date', _self).each(function ()
            {
                $(this).attr('id', tabIdContext + '-' + $(this).attr('id'));
                $(this).datepicker(Globals.Dates).keypress(function (e) { return false; });
            })

            $(':button').button().filter('[data-linked-search]').click(function (e)
            {
                $.extendedAjax({ url: $(this).attr('data-linked-search'),
                    success: function (response)
                    {
                        $('#dialog-form').find('#dialog-search').html(response).dialog(Globals.Dialogs);
                    }
                });
            });
        });
    }
});

1 Ответ

0 голосов
/ 15 мая 2012

Я нашел способ решить эту проблему,

При создании виджета JQuery мне нужно переименовать идентификатор поля DatePicker, чтобы он был уникальным для созданной вкладки.

поэтому мой TabId = ui-tab-01 и DatePickerId = DatePicker1

переименовывает DatePickerId так, чтобы теперь он был ui-tab-01-DatePicker1

...