Разрешить редактирование ячейки с помощью щелчка левой кнопкой мыши ИЛИ открыть диалоговое окно при нажатии Ctrl - PullRequest
Новая
       22

Разрешить редактирование ячейки с помощью щелчка левой кнопкой мыши ИЛИ открыть диалоговое окно при нажатии Ctrl

0 голосов
/ 27 марта 2012

Обновление: я до сих пор не понял этого, но увидел Jquery - Jeditable: как восстановить нередактируемый без обновления страницы , что похоже на то, что я хочу сделать. Пытался включить его, но я не уверен, что я делаю это правильно, так как для его работы требуется 2 клика (или 2 ctrl-клика).

$ ( "div.wanttoedit"). Нажмите (функция (е) {
if (e.ctrlKey) {
$ ( 'Div.wanttoedit') addClass ( 'non_edit') removeClass ( 'редактировать') отвязать ( 'click.editable');...
alert ('Ctrl был нажат');
} else {
предупреждение («Ctrl не был нажат»);
$ ( 'Div.wanttoedit') addClass ( 'редактировать') removeClass ( 'non_edit');..
$ (».Edit ') .editable ('? HTTP: //#request.host#/vp/metrics.cfc метод = returnformat updateMetrics & = равнину);
}
});

<div id="#results.id#" class="wanttoedit non_edit">#val(value_disp)#</div>

Опять же, любая помощь очень ценится. Спасибо.

Я все еще очень плохо знаком с jquery / javascript / jeditable, поэтому, пожалуйста, будьте добры и откровенны, насколько это возможно. :)

У меня есть таблица с метками строк = имя метрики и метками столбцов = месяцы. Ячейки содержат соответствующие значения метрик. Я хочу, чтобы можно было щелкнуть левой кнопкой мыши, чтобы значение метрики можно было редактировать, а также щелкнуть левой кнопкой мыши (или щелкнуть правой кнопкой мыши, щелкнуть при нажатой клавише Shift и т. Д.) И указать причину пропуска метрики ( если бы это было). Эти две вещи обновлены в двух разных таблицах в моей базе данных, но обе они связаны с метрическим идентификатором / именем и периодом / месяцем, с которым они связаны.

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

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

Я использую Coldfusion (не уверен, что это необходимые знания, но подумал, что упомяну об этом на всякий случай) и могу предоставить любые фрагменты кода по мере необходимости, чтобы вы могли помочь мне исправить это.

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

$ (документ) .ready (function () {
$ ("# cymteamtabs"). tabs ({
кеш: false,
load: function (event, ui) {
$ ( ".EditMetric ") .editable (" HTTP: //#request.host#/vp/metrics.cfc метод = updateMetrics & returnformat = равнину?");
},
ajaxOptions: {cache: false}
}
);

<cfloop query="metrics">
<tr>
<td>#metrics.mdisplay#</td>
<cfloop query="dates">
<td id="#results.id#" class="editMetric">#val(value_disp)#</td> </cfloop>
</tr>
</cfloop>

Да, и просто чтобы убедиться, что мне ясно, что я хочу, чтобы это делалось .... если я щелкну по полю Ctrl, появится всплывающее окно, позволяющее ввести информацию о пропусках (редактирование отключено ). После закрытия этого диалогового окна, если я щелкну левой кнопкой мыши по полю, оно активирует редактирование этого поля, поэтому, по сути, я не хочу полностью отключать jeditable, я просто хочу, чтобы он переходил в режим гибернации между тем временем, когда пользователь нажимает Ctrl на поле и когда всплывающее диалоговое окно из-за этого закрывается.

Заранее спасибо.

Ответы [ 2 ]

1 голос
/ 05 апреля 2012

Я не уверен, что это лучший способ сделать это, и я не уверен, что он делает именно то, что я хочу, но пока он работает. 

$(document).ready(function()
{
$("#cymteamtabs").tabs(
    {
    cache: false,
    ajaxOptions: {cache: false},
    load: function(event,ui)
        {
        $(".editMetric").click(function(e) {
            if (e.ctrlKey) {
                var metric_id = $(this).attr('data-metric-id');
                var date_type = $(this).attr('data-date-type');
                var value_date = $(this).attr('data-value-date');
                var url_tf = 'cym';
                var url_view = 'edit';
                scorecards.display.miss_details(metric_id,date_type,value_date,url_tf,url_view);
                e.stopImmediatePropagation();
            }
        });
        $(".editMetric").editable("http://<cfoutput>#request.host#</cfoutput>/vp/metricCFComponents.cfc?method=updateMetrics&returnformat=plain");
        }
    });
});

Похоже, что сначала проверяется Ctrl-щелчок, а если он нажат, запускается нередактируемый код и e.stopImmediatePropagation ();Похоже, что не позволяет запустить jeditable код под ним.

0 голосов
/ 28 марта 2012

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

Проблема заключается в типах событий- Отвязывание их кажется немного чрезмерным.Лучшим вариантом было бы установить редактируемый элемент как <td />, как у вас есть, но у вас есть отдельный элемент (например, span) в качестве триггера.

Чтобы продолжить работу с текущим html, вы можете попробовать это: 

$('.editMetric').editable('url1', {
    event: "nrmlClick"
}).editable('url2', {
    event: "ctrlClick"
}).bind('toggleClick', function(e) {
    if (e.ctrley) {
       /* modal javascript here */
       $(this).trigger('ctrlClick')
    } else {
        $(this).trigger('nrmlClick')
    }
});​

У меня нет возможности проверить это должным образом, но это должно работать.

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

Надеюсь, это поможет!

...