Симпленодальное подтверждение внутри события перед jstree с использованием JQuery - PullRequest
Новая
       5

Симпленодальное подтверждение внутри события перед jstree с использованием JQuery

1 голос
/ 15 августа 2011

Моя основная потребность - либо stopImmediatePropagation (), либо не в jstree - на основе диалога подтверждения пользователя. Например, пользователь проверил узел верхнего уровня, и мой код понимает, что это может быть опасно для него - и запрашивает подтверждение. Если пользователь говорит «нет», остановка будет препятствовать фактической проверке. Я хочу, чтобы это было узловым, поэтому пользователь вынужден сначала ответить на этот диалог.

SimpleNodal «подтвердить» выглядел как хорошее решение. Все работает, кроме остановки распространения. Заходя в firebug, причина в том, что возврат выполняется в jstree.stopPropagation (), потому что this.originalEvent не определено.

Был бы очень признателен за более простой способ или обходной путь.

Фрагмент из jquery.js - этот возврат выполняется вместо завершения остановки: 

stopPropagation: function() {
  this.isPropagationStopped = returnTrue;
  var e = this.originalEvent;
  if ( !e ) {
    return;
  }

Здесь начинается код ошибки - выполняется остановка, но принимается приведенный выше возврат: 

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type='text/css' href='confirm/css/demo.css' rel='stylesheet' media='screen' />
<link type='text/css' href='confirm/css/confirm.css' rel='stylesheet' media='screen' />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.jstree.js"></script>
<script type='text/javascript' src='confirm/js/jquery.simplemodal.js'></script>
<script type='text/javascript' src='confirm/js/confirm.js'></script>
</head>
<body>
    <div id="demo1" style="float:left;width:50%;">
        <ul>
            <li>
                <a href="" id='a' >aaa</a>
            </li>
            <li>
                <a href="" id='b' >bbb</a>
            </li>
        </ul>
    </div>

    <script type="text/javascript">
        $(function () {
        $("#demo1").jstree({ 
            "themes": {
            "theme": "default",
            "dots": true,
            "icons": true,
            "url": "themes/default/style.css"
          },

            "plugins" : [ "themes", "html_data", "ui", "checkbox" ],
            "checkbox": { "override_ui" : true, "checked_parent_open" : false }

        })
        .bind("before.jstree", function (event1, data) {
            console.log(data.func);
            if(data.func === "uncheck_node") {                 // a node was unchecked
                if (typeof(data.args[0]) == "string") return;
                id = data.args[0].parentNode.id;
                if (id == 'a') {
                    **//Uncomment these 2 and the stop works**
                    **//event1.stopImmediatePropagation();**
                    **//return false;**
                    return(
                        confirm('Any Luck', function(isYes) {
                            if (!isYes) {
                                event1.stopImmediatePropagation();
                                return false;
                            } else
                                return true;
                        })
                    );
                }
            }
            if(data.func === "check_node") {                   // a node was unchecked
                $(function(){console.log('hello world');});
            }
        })
    });
    </script>
    <div id='confirm'>
        <div class='message'></div>
        <div class='buttons'>
            <div class='no'>No</div>
            <div class='yes'>Yes</div>
        </div>
    </div>
    <div style='display:none'>
        <img src='confirm/img/confirm/header.gif' alt='' />
        <img src='confirm/img/confirm/button.gif' alt='' />
    </div>
</body>
</html>
...