флажок asp.net преобразован в флажок с тремя состояниями, не затрагивая оригинальный обработчик события

Question

У меня есть usercontrol с флажком asp.net. Я пытаюсь написать скрипт jquery для преобразования этого обычного флажка в флажок с тремя состояниями. Состояния «проверено», «не проверено» и «промежуточное». Нажатие на промежуточное состояние должно изменить состояние на проверенное, нажатие на непроверенное состояние должно изменить состояние на проверенное, а нажатие на проверенное состояние должно изменить состояние на непроверенное.

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

Вот моя функция jquery, которая грубая, но работает:

function SetTriStateCheckBox(checkboxfinder, initialval, originalCkbxUniqueID) {
    var i = 0;
    var chks = $(checkboxfinder);
    if (initialval){ chks.val(initialval); }
    chks.hide().each(function() {
        var img = $('<img class="tristate_image" src="../Images/tristateimages/' + $(this).val() + '.gif" />');
        $(this).attr("checked", ($(this).val()=="unchecked"?"false":"true"));
        $(this).attr("name", "input" + i + "image" + i);
        img.attr("name", "" + i + "image" + i);
        i++;
        $(this).before(img);
    });


    $(".tristate_image").click(function() {
        t = $("[name='input" + $(this).attr("name") + "']");
        var tval = t.val();
        $(this).attr("src", "../Images/tristateimages/" + (tval=="checked" ? "unchecked" : "checked") + ".gif");
        switch (tval) {
            case "unchecked":
                t.val("checked").attr("checked", "true");
                break;
            case "intermediate":
                t.val("checked").attr("checked", "true");
                break;
            case "checked":
                t.val("unchecked").removeAttr("checked");
        }
        setTimeout('__doPostBack(\'' + originalCkbxUniqueID + '\',\'\')', 0);
    });   
}

Вот упрощенная версия моего обработчика событий OnPreRender, который регистрирует сценарий запуска:

protected override void OnPreRender(EventArgs e)
{
    string tristatescript = " SetTriStateCheckBox('input[id$=\"ckbx1\"]', 'intermediate','"
        + ckbx1.UniqueID + "'); ";
    ScriptManager.RegisterStartupScript(this, this.GetType(), "ckbx1_tristate", tristatescript, true);
    base.OnPreRender(e);
}

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

Если я достану часть .hide() из jquery и нажму на исходную кнопку-флажок, Request.Params['__EVENTTARGET'] будет таким же, как при нажатии на вновь вставленное изображение.

Я не уверен, куда идти отсюда. Есть предложения?

Answer 1

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

: -)